Of Logos and Labels

I've been meaning to do start up an actual brand for a while, but never got around to it. The most serious shot I had at it was a couple of months ago - I went online and tried to find a brand name by translating random English words into Filipino. When I typed in 'craft', it gave me 'bapor'. Out of curiosity, I flipped it back to English, and it gave me the words 'boat' and 'vessel' - it had translated the wrong type of craft! Despite the fact that I couldn't actually pronounce bapor (I never got the hang of rolling my rs in foreign languages), I still liked the sound of it, and I thought the origin of it made for a funny story, so I stuck with it. I went and got myself an email address and an Etsy account and started making little pouches.

When my sister Steph got wind of what I was doing, she got excited but insisted I label my creations. I'd just bought some material that was pretty and somewhat nautical-looking, which fit into the boat idea, and so we decided that it could be my 'signature' material and would make nice swing tags. It looked like this:

I owe Steph, because everyone who I showed the tags to from then on would comment on how professional-looking they were. But having recently decided on a new name and having spent time drawing up a new logo, I wanted to use the tag idea with the new brand. But how to do it? Cutting pieces out of material is one thing, but getting a logo on something is an entirely different kettle of fish...

I headed off to Etsy to see if anyone could make me custom labels. Doing a search proved rather fruitful, but I was a bit overexcited and the idea of having to wait for items to ship seemed frustrating. Through some more searching I discovered some nice tutorials that show you how to make them yourself with printable fabric.

Discovering the existence of printable fabric had my head running off in a million different directions with ideas of what to make, but first off, labels! A lot of tutorials on the internet bug me because they list American products that are hard to find here, so for anyone in Australia, you can buy Avery Inspired fabric from Lincraft stores or Jacquard InkJetPrinting cotton or silk from Eckersleys. Neither shop seems to stock the products in their online stores, but I found them in the physical shops.

Newest acquisition: printable fabric!

Lincraft was out of the Avery fabric, so I got the Jacquard one, and went to work finding a font to go with the logo. It turns out that there are a lot of sites that have open sourced fonts that you can use royalty-free. I went with Google Web fonts, which have the added advantage of giving you a line of HTML that you can stick in the top of a website that will show the font to anyone who views your page. For example, you probably don't have the Gloria Hallelujah font on your computer, but you should be able to see it here in the headings.

I laid out my label design in Inkscape again, and printing them was just like printing them on paper. The fabric comes with a backing that keeps it stiff for printing but then peels off easily afterwards. The only hassle was that the sheets weren't actually A4 sized, so I had to make a custom paper size on my laptop.

Printing...	Success!

According to the instructions, you have to leave the fabric to dry for 24 hours and then wash it out - it comes out a bit sad and crumpled looking! But ironing it leaves it looking fine.

Some wet and crumpled labels

The Jacquard material is pretty soft and thin, and it frays rather easily. It works fine for the bigger labels, but the little ones tend to fray a bit on the sides. I might try and iron some interfacing onto it and see if it will stop it from unravelling so badly, but for now it doesn't look so bad!

Adventures in Inkscape

My dad is an amazing artist. He can take a piece of paper and almost anything that will make a mark on it, and voila! A drawing emerges. There's a beautiful chalk drawing of my mother that sits in their house - she can't be much older than I am now and the amount of life he managed to make radiate off the board is simply breathtaking. My sister managed to get the drawing gene off him, but I wasn't so lucky. I'm even worse on a computer - I can compose and edit things in Photoshop, but trying to draw them from scratch is a nightmare.

One of the few things I can draw are little cartoon elephants. Someone sketched one out for me once - so long ago that I don't know who or when anymore - and it stuck somehow. I've wanted to make labels for the things I make for a long time, and sticking an elephant on it seemed like a natural thing to do, but the idea of drawing it on a computer was terrifying to me.

To illustrate just how terrifying, here's the first attempt I made at digitising an Oliphant Kat, courtesy of Nick's iPhone:

Not very reassuring. But as you can probably see in the header, I managed to do it, and it actually only took a few hours.

Before I show you how I did it, first, a plea - please don't ever be intimidated by software. Experimenting on a computer isn't very different to experimenting with a sewing machine, or with some knitting needles. I saw a tutorial recently about printing custom material, and the first step was "Open Microsoft Word" and I almost audibly sighed. If you want to do something with graphics, use a program that's built for graphics. You can find a lot of free ones online, including Inkscape, which is what I used over the weekend.

I've done enough design computing to know that if you want to draw a logo, you should really be doing it as a vector graphic - it scales really well, which is especially good when printing things. In terms of software, this basically means using Illustrator instead of Photoshop. Sadly enough, I don't have Illustrator, but my friend pointed me towards Inkscape. It comes with some built in, interactive tutorials (Help > Tutorials), which helped me get the hang of it really quickly.

Whiskers, body, head and an ear

As you can see, I drew the Oliphant Kat in pieces. The reason I really suck at computer drawings is that I have next to no mouse control, but the program came with both built in shapes, and lots of ways to combine them. By drawing a shape, giving it a thick stroke and no fill (CTRL+SHIFT+F will get you the stroke and fill options), you end up with nice line drawings.

The body was fairly easy - it was two arcs on top of each other with their endpoints joined together (which I learnt in the tutorial!). The best bit I discovered, though, was while I was drawing the ear. One of my friends was helping me, and we got two ovals on top of each other and joined them together, but the join was really pointy. It turns out that if you want to draw curves, you can draw a built in shape and then hit CTRL+SHIFT+C and it becomes what's called a path. You end up getting points on the outline of the shape that allow you to control where the line goes and how curved or pointed that area is. This means you can draw a curve and then just start bending it, instead of having to draw your shape freehand in the first place.

Green control points on a path

Once I had the pieces drawn, it came down to positioning. You can align objects vertically or horizontally really easily (CTRL+SHIFT+A for options) but making the shapes look like they were in front of or behind each other was more difficult. I wanted to do this all on one layer, so I had to just combine the shapes I had.

Combination options in the Path menu

In the second section of the Path menu there are some interesting looking options that will look familiar if you've ever done set theory in maths. The most useful ones were 'Union' and 'Difference'. Union joins two objects together as if you've stuck them together by gluing the overlapping parts. Difference does the opposite, and will take two objects and delete one of them along with the sections in which they overlap. To make the body look like it was behind the head, I positioned them, hit difference, and was left with the body minus the overlapping head area. The only trick with this is knowing what will get deleted - would I get the remainder of the body, or the remainder of the head? We discovered that in Inkscape, you can move objects 'above' and 'below' each other (Object > Raise/Lower). You need to move the piece you want to keep to the bottom of the other one (Object > Lower to Bottom) before you do the difference.

The head and the body, difference with the head below the body, difference with the body below the head

One last tip - don't ever hit CTRL+C! If you want to copy something, Duplicate (CTRL+D) instead - whenever I tried copying something it did strange and unexpected things.

Before		After

That's it! I went from 'Before' to 'After' in a couple of hours of fiddling with some new software and I'm really happy with the result :D