12 Tips for Flawless Service & Happy Clients

12 tips for improving your e-mail correspondence with your design clients.
flawless service
Hey true believers! At Go Media we’ve started having in-house “classes.” Basically any designer from Go Media that has some good advice to pass along to the staff will schedule a time to do a quick presentation. Everyone in the office can choose to attend the mini-class to learn something.

This past Monday I did a mini-class I called “Flawless Service.” The class was nothing more than me reading through every e-mail I had with a client for one particular project. Some of what I do during my correspondence with a client is nothing new to my staff. But some of it was, and it only took a second.
I can’t actually SHOW you the correspondence I had, but I did type up this quick list of the sorts of things I naturally do during a normal engagement with a client. I thought I could share it with you. It’s really just common sense, but a quick reminder never hurt.

1. Establish your contact and means by which you’re going to communicate. Clearly Identify who you are, how you are in contact and provide your contact info. It’s also VERY useful to force the client to pick one “leader” if there will be a number of individuals giving feedback. Make them all report to their leader, then that leader can provide one piece of clear feedback to you.

2. Establish the details of the job. What is the deadline? What format is this design to be delivered in? Are there proof deadlines? Make a schedule if necessary. I know this is elementary stuff here, but I still think some designers don’t do a thorough enough job collecting all the details of a job. Err on the side of asking too many questions.

make small talk with your client3. Develop a rapport with the client. I frequently find myself talking with clients about things wholly unrelated to the project at hand. If I find out that a client is a Spider-Man fan – I can’t help but discuss why I think he’s the best super hero. Sometimes it’s about business, jogging, or whatever. Anything that piques my interest will be a conversation point. Feel free to engage the client in conversation of interest. Establish common ground, make jokes, whatever. This will endear you to the client, make you friends with them. This fundamentally changes the way a client works with you. Now, they’re rooting for you, helping you, they WANT you to succeed. They CARE about you. Because they feel like they know you. I really do this a lot.

make sure the client understands your value4. Make sure the client understands the VALUE of what you’re doing, particularly if discounting your rates in any way. This has to be done with extreme subtlety and tact. Saying something like: “Dude, you are sooooo lucky to be working with me. I normally charge three times this much.” Will simply not cut it. But if you find an opportunity to slip in the value of what you’re doing without sounding like a jerk – take it.

5. Make them laugh, or at least smile. I try my best to slip in a joke or silly comment into my e-mails. If you can make a client laugh, you’ve absolutely endeared yourself to them.

6. Make a schedule and stick to it. Clients appreciate punctuality. If you take the lead in setting up a schedule and you hit your deadlines – you’re as good as gold to them. Don’t forget – the emphasis needs to be on the “…sticking to it…” part. If you make a schedule only to miss all the deadlines you’ve set, you’ll only be punctuating your own failures.

7. Carbon copy all interested parties. If there are other people who need to be kept “in the loop” then make sure you CC them on every single e-mail. I’ve made the mistake of leaving people out of the daily correspondence. The results are always a mistake that could have been easily avoided.

give them something for free8. Give them options, but make sure you also give them what they asked for too. If you’re going to do something outside of the requested design – make sure you give them what they asked for too. This is very important. The client shouldn’t feel like they have to ask twice, or fight with you to get something. You CAN make a concerted effort to educate and pitch them on a different idea. But I would probably do this in a phone conversation. And reassure them that they will get what they want in the end.

9. Repost their feedback along with your revised proofs. When posting revisions – if they’ve given me a check list, I will often type back their check-list to them, and include little comments. This way they absolutely know I’m listening to and following their directions.

10. Up sell when things are going well. Now, Go Media is not a hard-sales kind of company. But when things are going very well and the relationship has been established, I will take the opportunity to let them know about other services that we have available. It might be something as simple as this: “If you ever need any web design, we do that too!”

give them something for free11. Give them a little something for free. This is usually in the form of consulting. But it can be a real quick design project too. Here are two examples of things I might say/do: “I was thinking about your project last night and had a good idea for your new product…” Or “I noticed that your logo was a low resolution jpeg. I took a minute to vectorize it and output a high-res version for you. I’ve attached those files – no charge.”

12. Say Thank You. Nothing is more powerful than a well timed and sincere thank-you.

And with that, I want to thank you for taking the time to read this post. I hope you learned something.

Pointers for Designers Working with Apparel Companies

Paint the Stars article header

There is often a disconnect between an artist and a screen printer. Problems often arise when there is a lack of understanding of the print process and a lack of communication between the designer and client. Screen printers get mad when a customer sends them a job that has a bazillion colors and is outside the realm of their capabilities to print. Designers get upset when a client can’t afford to pay printing costs on his brilliant 16 color shirt design.

So what should a designer know about working with apparel companies? What do they expect? How can you improve your chances of your designs getting approved?

Awhile back, I had asked Dave Pearson, founder of awesomely successful UK-based fashion company Paint the Stars, a few questions about this. And his answers were fantastic and insightful. Dave offers this advice to all designers who design t-shirts for clients.

I know that Go Media would often do 4 or 5 concepts for a company and they would all get rejected. We would be upset that the client didn’t accept our “artistic vision.” When truthfully, part of it was our fault for not following some of these suggestions. However, after reading through Dave’s suggestions, our approval has begun to increase noticeably.

Show Preliminary Proofs

Paint the Stars Skull DrawingI’d say one of the main problems we encounter when we hire people is that more often than not, designers don’t provide any kind of preliminary proofs. As a designer as well as someone who hires people, I know from both sides that design rejection sucks for both parties; for the client it’s always difficult to tell a designer that you’re ‘not feeling it‘ for whatever reason – it is essentially telling them that you don’t like their work. I’ve never found that to be an easy thing to do because designers work hard, so to be told that it’s not good enough can make you feel like you’ve wasted your time and, if it’s something that happens more than once with the same client, can start to make you question both your ability and your choice of client – nobody wants to be paid $200 to do 5 different designs before one is accepted.

I’ve had designs rejected before, I think it’s apparent that most clients find it difficult to do, because no-one ever says ‘Nah, that sucks’ ..they usually say ‘That’s awesome but…‘ or the classic ‘I’m not feeling it’. But because I’m also in their position I can sympathize with what a difficult thing to do that is when someone is putting their art out there for your acceptance. The flipside of that of course is that designers should be aware that the industry they are in is pretty black & white – clients rarely say ‘yeah.. it’s alright, I’ll take it‘, so they should be able to take rejection with a pinch of salt because of course, it’s never personal.

How to avoid getting your ego bruised

Paint the Stars Skull Shirt designed by Jeff Finley of Go Media The reason I always ask for proofs at the sketch stage is to try to avoid situations like this altogether – if someone provides you with a rough sketch that gives you some basic idea of where they’re going with it and you don’t like it, it’s not so much of a kick in the balls for them to be told that you don’t like it, because it’s just a sketch. When someone presents you with a full resolution ready-for-print design as your first proof it’s a lot harder to dismiss their efforts without alienating them, upsetting them or even pissing them off. We’ve actually taken a design before because we felt bad for the guy who did it because he clearly put a lot of effort into it, and we probably shouldn’t have done that. I think it’s equally important to receive proofs at each stage of the design process, not like for every hours work, just regular updates to keep track of the progress, again to avoid wasting everyone’s time and stepping on people’s toes.

Working with the brand’s art direction

Direction is a double edged sword for some companies (ourselves included) for a number of reasons. Many companies like Johnny Cupcakes and Pyknic have some of the most amazing and random ideas for tees and I’m told they’re quite specific, but generally their stuff is spot on because of it – of course giving a specific brief can give mixed results, especially when you have a clear vision in your mind of what you want, meaning that anything short of it will be a disappointment, which puts a lot of pressure on the designer.

But the brand’s idea sucks

The other element of giving direction is that sometimes your idea is god-awful. Generally a designer will know this, and will try to work with it as best as they can, but as the saying goes ‘you can’t polish a turd‘, so it’s not always a bad idea for an artist to try to implicate their own ideas onto the design, and usually, so long as the client is kept in the loop and its worked out, the client won’t mind you trying, and they certainly shouldn’t be afraid to suggest or try something if they feel it’s going to better the design.. we encourage it. Of course, if someone is 100% set on an idea then just do what they say – you are being paid and if they have enough faith in both the idea and your design then you should take their word for it and do it. You may hate how it turns out, but if it’s what they asked for – they’ll probably love it.

Go Nuts!! But first…

Paint the Stars Candy Hoodie designed by Go Media The other direction form, or non-direction rather, is saying to a designer ‘go nuts‘, and it’s equally risqué – this is usually based of the artists’ portfolio or reputation, and in some instances they’ll hit one out of the park, and in others they could miss the point, and you’ll be left embarrassed when you have to tell them that it’s not what you’re after, even though you clearly specified that you wanted them to ‘go nuts‘. This happened to us recently with one of our favorite designers, and it was embarrassing, but the problem there was probably in the artist not knowing enough background info on our company, which is something we should have made him aware of. If you have enough faith in a designer then allowing an artist to do what they like isn’t a bad idea – we work with this guy called Drew on every range, and his stuff is consistently amazing, but the problem with that is he doesn’t let us direct him, he just comes up with something, and we have to hope its good. As I said, it pretty much always is, but there have been times when things have needed changing. If you have your own style, or a designer has enough faith in you to have free roam of your imagination, then take a look at their existing stuff and come up with something that both stretches you and could fit into their range. That’s why they will have asked you.

Understand the company’s background

Paint the Stars Sugar Skulls shirt I always try to tell new designers we hire a little bit about our company and what kind of thing we do, in our case it’s a pretty alternative ’emo’ (eurgh..) type brand, but with our own inside jokes and unfunny references to retro and nostalgia thrown in… we also try to out ourselves across as a brand who doesn’t take themselves too seriously. A lot of brands take the ‘doing it for the art‘ route with high levels of integrity, which is fine, but we grew up listening to Blink-182, and we’re all about songs about ‘dicks and butts‘, and we try to purvey to our customers and our artists that we’re not too serious and pretty fun. There’s a level of immaturity to our brand, but we don’t see that as a reason to have people only designing shirts with wieners on them for us, so there’s nothing wrong with doing something out of character or serious because that alone doesn’t change the fun/stupid fascia of our brand. Companies don’t want hundreds of tees that are the same, they just want the same undertone to run throughout the brand, which is our job when marketing, and not entirely yours when designing.. just be aware of what a company is about and has done previously, they will have asked you because your style is something that they would like in their line, not because they think you can copy their other shirts.

Brands want variety

I think it’s important for an artist to get to know their client, or at least what they’re about as a company – because that allows you to design accordingly. I touched earlier upon a tee one of our favorite (and everyone’s favorite) designers did for us – he came up with this beautiful shirt and it was incredibly pretty and we loved it. But we looked at it and came to the conclusion that it just didn’t fit in with what we are doing; it was almost too beautiful.. and it was hard to tell the guy because he is not only awesome, and busy – but we’d also told him to ‘do what he likes‘. I think the downfall of that in that instance was that he didn’t know enough about our company, and had we have told him he’d have probably come up with something different. In the end he came up with something a lot more ‘us‘, and ironically, one of the best shirts I’ve ever seen anywhere.. It’s out in September.. keep your lookin’ balls peeled folks, you’ll know which one I mean.

I should add, I don’t think companies should stick to 1 genre or look, but I think it’s apparent when something doesn’t fit into your line and is out of context with your company. We have no problem with trying new things and we encourage it.. our new range is very broad, without being vague, as a result of that and we’re really stoked about that.

Be nice and professional

Paint the Stars Lost at Sea shirt Finally, there’s nothing wrong with being nice to a client. We’ve actually found that the more high profile designers are a lot more pleasant to work with then the low-end ones which could be down to being more professional and aware of how manners affect clients. If you are friendly and approachable towards a client, there’s a greater chance of a). you finishing the project faster because you feel more at ease with one another to share ideas and critiques and b). being re-hired by that client for another project. We’ve had plenty of occasions where we’ve approached artists whose work we love only to get a bullshit response like they’re doing us a favor as opposed to the reality of us doing them a favor by giving them money. And there’s been occasions like that where we’ve chosen not to follow it up and work with people like that regardless of how good their work is.

Clients contact you because they think you are good at what you do and are willing to pay for your services. When people contact me for designs I always take both of those things as a massive compliment because that’s what they are. There’s no need for feigned enthusiasm or niceties, but a little manners like your mother taught you wouldn’t go amiss, because it makes you seem more approachable. If you went into a shop and asked politely to try on some shoes, and the sales guy sighed and threw them at you whilst yelling nothing but the cost, you’d probably go somewhere else for your footwear.

Summary

  1. Proof! Lots! It’s time consuming sometimes, but a) you’ll build up a better relationship with the client and b) it’ll save you time if it gets declined at the sketch stage.
  2. Don’t take critique or rejection to heart. Clothing companies don’t enjoy having to reject anything and we all appreciate how much time and effort goes into work. If your design gets rejected, it’s nothing personal, because if it, was we wouldn’t have hired you in the first place. You may find your rejection level goes down if you send more proofs, as it means you are getting direction constantly rather than springing a thumbs up/thumbs down on a final design, because it is usually harder to take rejection on a finished piece.
  3. Direction – Listen to what your client wants, if they are adamant about a specific design then just do it because it’ll be what they’re after, but don’t be afraid to suggest or sketch out potential changes because each persons’ imagination only stretches so far and you may have thought of something that they otherwise wouldn’t have. If you are given free roam of a design, find out a little about your client first. (See number 4)
  4. Know the client. When working with a new company, find out what they’re about if they haven’t already told you – ask other designers what they’re like, check out their existing work, or simply ask the client because they’ll be happy to tell you. This will improve both your working relationship with the client and the chances of coming up with something they’ll like. You wouldn’t design a floral shirt for a cyber-goth company.
  5. Be nice to clients, they want to pay you for doodling and messing about with Photoshop because they like what you do.. that could be the best job in the world, and you should realize how lucky you are to be doing it and to have people wanting to pay you to do it. Take it as a compliment. It also makes you easier to give direction or critique to, and can usually guarantee repeat business between you and the client.

Check out Paint the Stars online store, they have a bunch of really cool shirts!

Paint the Stars has really cool shirts!

Impressive Watercolor Splatter Effect Tutorial & Freebie

This guest post was written by Nick Steimling from HeavyPrints . Many thanks, Nick, for sharing your knowledge with Go MediaZine readers!

I have been working with natural media more recently, and as a result, I have been learning how to bring my natural work onto the digital drawing board. I have shown a few people my “watercolor” technique and it has proven to be wildly popular amongst my peers. It’s not very hard to accomplish, so I figured I’d take a few minutes to share it with you good folk!

For this tutorial I will assume that you have a basic working knowledge of Adobe Photoshop. Everything here should be backwards compatible back to 7.0 at the very least. Without further delay, I present information for you to be having:

By the end of this writing you should be able to achieve a halftone watercolor effect similar to what I have achieved with this:

watercolor effect tutorial

Making The Drips and Splatters

Before we can do anything in Photoshop, we have to have some splatters and washes and drips. I don’t actually use watercolor paints, I make an ink wash. You could just as easily search free stock images such as those at The Stock Exchange, but I prefer to make them myself. If you’d rather not wait for paint to dry, you can snag the free high quality textures at the bottom of the post. It lends greater flexibility to my technique, and a more accurate delivery of the effects. Here are the supplies that I use, your mileage may vary:

Ink Wash Supplies

supplies

The supplies pictured are as follows:

  • A standard Wash Brush used for painting
  • A Canson acrylic sketch pad (185LB Cold Press Paper)
  • Dr. PH Martin’s Bombay Black India Ink
  • a Sauce Cup (be sure that the owner of the sauce cup is okay with ink being put in it..long story…)

Obviously, the supplies you use are up to you. This is just what I have had the greatest success with.

I fill my sauce cup about 1/3 of the way up with water, then I add approximately 3 drops of black ink. You may have to figure out what works best for you, but this mix has worked well for me in the past. Note: I use black ink because the contrast allows for a reasonable file quality even with my cheap scanner.

At this point I lay some paper towels on a counter, hold the paper up with one hand, and proceed to make a mess. There’s really no wrong way with this effect. The sloppier the better. I usually try to stay generally true to whatever shape I’m working with, but keep in mind that the imperfections are what makes it interesting. Also, once I get the drips and wash the way I’d like I lay the paper flat and splatter some of the mix on it. It’s fun – make a mess!

Here’s a video tutorial so you can see exactly how it was done.

Okay, I have made a mess. Now what?

At this point you’ll need to scan your wash into the computer, or take a high quality picture of it to transfer to your computer. Save it somewhere you can find it and open it up in photoshop. I try to scan at nothing less than 300DPI, but it’s not really that important. As long as the file is big enough to resize without getting terribly pixelated, you should be okay. Here’s mine:

splatter-sample

This is my splatter image.

I have already opened up the file that contains the linework for my Mermaze design.

Press Ctrl+A to “select all” on your ink wash file, then click the window with your other artwork and Ctrl+V to paste it into the image.

Resize, rotate, and move your wash to where you want it in the final output. I have placed it behind my lines, personal preference. Here’s where I’ve arrived:

watercolor-placement

Once you are happy with size and placement, you’ll want to be sure that you have the wash layer selected in your laters pallet, then Ctrl+A to select all and Ctrl+X to cut the image.

Making The Halftone

Press Ctrl+N to make a new document, be sure the background is set to white or transparent, and click okay to make the new document. Press Ctrl+V to paste your wash into the new document. Once you have this done, we will prepare the wash to be made into a halftone.

Press D to reset your foreground and background colors. Then click the “Image” menu and select Adjustments>Gradient map. The gradient map dialog will pop up, and you should notice your wash become slightly more black and white.

Click the gradient picture on the dialog so that the Gradient Adjustment Dialog pops up. You will need to move the white tab in towards the middle until you are sure that the white background on your wash is absolutely white. Then you’ll need to adjust the black tab until your wash is as dark as you feel it should be.. Mine looks something like this:

gradient-map

I have placed red arrows pointing to where I have my black and white tabs set. This step is important because if your background is anything other than absolutely white, the halftone will have little dots placed all over it in an attempt to make it look off-white. It will not be attractive. Hit “OK” on both of the dialogs when you are finished setting the tabs.

Tip: A good way to be sure your background is pure white is to click your foreground color so that the color selector comes up, click the background of your image with the eyedropper tool, and make sure the hex code is “FFFFFF”.

Now that your background is white, and everything looks good, it’s time to make the halftone. In the “Image” menu select Mode>Grayscale. Press OK on any questions that pop up about flattening layers, or losing color information.

Now you will open the “Image” menu again and select Mode>Bitmap. When the first Dialog pops up, be sure the Method is set to Halftone Screen:

halftone-screen

When you press OK a second Dialog will pop up. You may want to play with these settings a bit but the important parts to note here are: Halftone type should be “Round” and never set “Lines Per Inch” or “Angle” higher than 45 if you are setting this design up to be screen printed. Any higher and the printer could encounter problems. If at all possible, it’s best to contact the printer first and ask them.

Once that is done hit “OK” and your splatter should now be a halftone. From the “Image” menu select Mode>GrayScale once again. Using the magic wand tool select the white background of your ink wash. Press Ctrl+i to invert your selection. Press Ctrl+X to cut the selection, Select the window with the design you want the watercolor placed in, and press Ctrl+V to paste it in. You will probably need to move your halftone into position.

Finally from the “Layer” menu select Layer Style>Color overlay and pick a color you would like your halftone to be. That’s all of it. Here’s what mine looked like:

final-splatter

That’s all for this tutorial. I’ll have more soon!

Free Ink Wash Splatters

I have a file with some high resolution splatters for you to try out. The image below is a sample of some of the washes, drips, and splatters in the package. They’re all really hi-res, so you’ll be able to get a lot of mileage out of them. Click the link below the image to download the file:

watercolor freebie

[download#31#nohits]

How to Design Your Own Custom Hoodie

We know how much you guys and gals love a good tutorial! We just launched our new Hoodie Templates and they are amazing. I decided to sit down and design a hoodie and to write a tutorial in celebration.

You should know right from the start that there is a lot to digest here. This is a long tutorial and will demonstrate some advanced skills. Along the way you’ll not only learn how to create a detailed illustration, but also how to create professional hoodie mock ups with Go Media’s Hoodie Design Pack.

Here’s what we’re gonna make:

IN THIS POST

1. Creating a Custom Hoodie Design
2. Mocking it up
3. More mockup examples
4. Hoodie Design Pack feature tour

WHAT YOU’LL NEED

1. Something to sketch with
2. Scanner
3. Adobe Photoshop
4. Wacom Tablet
5. Go Media Hoodie Design Pack
6. A cup of coffee

So, first things first:

CREATING YOUR CUSTOM HOODIE DESIGN

We’re making a super custom illustrated hoodie design, right? The best place to start with a project like this is the sketchbook. For some inspiration check out my colleague’s sketchbook. You should start sketching something that you’re really interested in. Personally, I love tentacle looking things and couldn’t get the word “bogus” out of my head…so a bogus octopus was born. I did this one really quick (about 15 minutes) but your mileage may vary.

I scanned the rough image from my sketchbook into Photoshop and busted out my handy dandy Wacom tablet.

sketch

I set up my file for 25” by 20” at 300 dpi in CMYK, then pressed ctrl+alt+shift+n to create a new layer and began to draw over my sketch.

initial settings

We always get questions about what kind of brush settings we use when drawing with a Wacom. These are the exact settings I used.

pen settings

pen settings2

Remember how quickly I sketched the octopus? It’s just a starting point, because as you can see I don’t always stick to the original sketch. As I am working I just let the drawing dictate where things should lie.

If you aren’t comfortable with this, you can just add all the detail that you want to your initial sketch and try to follow it a little more closely inside Photoshop.

outlines1

In this next shot you can see how the drawing is growing beyond the boundaries of the original sketch. It’s starting to shape up! Take a look at your own design right now and start to revise it until you’re happy. We’ll be moving on to adding details in just a minute.

outline2

After I had my rough outline at a satisfactory point, I then went back through the drawing and added detail to make the little guy come to life a bit more. For me, it usually just involves thickening up outlines to simulate depth and adding texture to the rough outline. In this particular image, it mostly involved making wrinkles and adding splashes of ooze.

These next few shots are really important. As Bill expertly explained in his “How to Become a Master Designer” series, one of the secrets to depth is varying line weight. Take note of how this looks and try to add a little depth to your own design.

lineweight

Okay! Looks like all my linework is complete. Now let’s bring it to life with some color.

outline3

Adding Color

Once I was finished with the outline of the drawing, I went back and began to add color. I started by laying down the base color of the octopus. For this drawing I chose a nice bluish green color.

Here’s how I set up my new Octopus layer:

  • Use the magic wand to select all the white area around your black outline and all the other spots where you don’t want the octopus color to be.
  • Then use select inverse and create a new layer.
  • Use the bucket tool and fill the new layer with the color you chose.

color1

Then I selected a slightly darker hue and added shadows to create even more depth and dimension.

shadows

I followed the creases and folds of the tentacles with my Wacom pen keeping in mind which parts I want to pop forward and which I want to recede into the background. Always try to think of where the light would be hitting the different areas.

shadows2

I wanted the octopus to look really wet and shiny, so I added heavy white highlights throughout the illustration to simulate a glossy surface. Again, just follow the creases and folds keeping in mind how the light would hit the various parts. Also keep your Wacom pen strokes somewhat loose and free flowing.

color3

highlights

I then chose other colors that complimented the design and I used them to add the final details to the octopus. FYI: I always keep my colors on separate layers. It makes it much easier to edit them without having to destroy the whole drawing if you decide to change something.

colordetail

For the background of the illustration, I created a free form splatter shape that echoed the shapes of the ooze splatters. I duplicated the shape and used a bitmap to create a halftone image. I then used hue shift to change the color to a purple hue.

background3
background 2
background1

The final illustration looks a little something like this…

fullfinal

Making the Repeating Pattern

I really liked the way the tentacle/intestine shapes were looking so I decided to make a repeating pattern from them to use as a background texture/all over print.

To begin with, I created a file at 1800 x 1800 pixels. I then copied portions of my black outline layer from the octopus illustration into the new file.

offset

After I had arranged the tentacles into a design I was satisfied with, I used the offset filter to make the pattern repeat. I did this by offsetting the image by half of each of my dimensions, so 900 pixels in width and 900 pixels in length. You will notice at this stage there is a noticeable area in the center where the lines are crazy and don’t match up – don’t freak out – we’re gonna fix this.

refineoffset

So, I erased all the weird seams and began to re-connect the tentacles with my Wacom Pen. Go back and redraw, erase, and repeat. There are a lot of lines to clean up, but the most important thing is that you should not change any of the lines on the outer edge of your design or your pattern will not repeat correctly.

repeating pattern

Once you get it to a point where you think everything looks good, double check to make sure the pattern aligns correctly in all directions. If it does, congratulations, you just made a repeating pattern…not so hard, huh?

MOCKING IT UP

Now if a client asked for a hoodie design – she might not be too impressed if I show her just the flat illustration. She asked for a HOODIE, so that’s what we’re going to give her. Enter the hoodie templates.

hoodytemplate

I begin by dragging my artwork onto the “whole hoodie” layer to size it and get it positioned where I want it. Once you get it where you want, the joy of the hoodie template comes into play. The design already looks pretty darn real because it’s automatically shaded by the ‘Shadows’ & ‘Highlights’ layers.

For this design I only want the print to appear on the front and the pockets of the hoodie. However, if you want some custom pockets or cuffs – it’s really easy. Adam Wagner has painstakingly masked off the various parts of the hoodie at nearly every seam, so you can do some really custom things with the design.

Anyway, for my particular design, I opened the folders for the “Chest” and “Pocket” Layers and pasted the design onto the “Left Chest”,” Right Chest”, “Left Pocket” and “Right Pocket” Layers.

chestdesign

Now that I have my design in place, let’s move on to coloring the hoodie. I am a huge fan of reversible hoodies (two looks for one price baby!), so we’re to mock this up as one.

I began with the outside color of the hoody. I’m on a big purple kick right now so I am going with a vibrant dark purple color. I selected the folder named “Colors” and I use hue shift to adjust one of the color layers until the hoody is the right color of purple.

hoodycolor

On the inside, I used a green that is similar to the green of the ooze in the design. I sampled the green from the ooze with the eyedropper tool and then filled all three of the “liner fill” layers with the fill bucket tool.

hoodycolorinside

The last thing I did was add the seamless pattern to the whole hoodie. For the outside I gave the pattern a light purple color, and for the liner I gave it a light green color. Presto – done.

alloverpattern

Here’s the final design and hoodie mock. Phew – we made it! If all of this was a bit difficult for you, give it time & keep reading. I’m going to show you some really quick shortcuts to get you started in the next couple of sections.

mockfinal

MORE MOCK UP EXAMPLES

I’m pretty happy with the final result, but let’s take a look at what the design would look like on a couple of different hoodies. I really like the way this next one shows the inside of the liner. Gotta love reversible hoodies.
hoodie-mockup-photoshop
Here’s one more in a standard flat view.
blog-mockup-31

HOODIE DESIGN PACK FEATURE TOUR

Alright. This post is getting kind of long, but I really want to explain the Hoodie Design Pack a bit more. There’s a ton of included treats & functionality. Let’s see what’s under the hood.

1. The Templates

template-layersOk, so here is the meat & potatoes of the design pack. It includes 10 Hoodie templates in PSD format. Each Hoodie has masks & layers for nearly every single seam on the hoodie. Each seam has the following layers which make it really easy to experiment with many design possibilities.

1. The shape layer (this acts as the mask)
2.
Fill Layer
3.
Pattern Layer (more on this in a minute)
4.
Art Layer.

To the left you can see all the seams that we’ve already masked out for you.

These layers make it a snap to mockup complicated designs that need to look real. For example, you can realistically mockup diagonal stripes on each of the pockets, or give your design dark cuffs. Besides all these layers, you’ll notice lots little details, like how the tag & drawstrings are separated for some extra realism.

The Colors Group has eight preset base colors, and you can of course fill any of these layers for any base color you choose.

2. The Textile Patterns

pattern_preview1The Hoodie Design Pack also includes 93 Seamless Textile Patterns for quick experimentation with the templates. Think of these as “presets” to start stimulating design ideas & options.

Textile Patterns include:

  • Herringbone
  • Houndstooth
  • Zebra, leopard & crackle print
  • Plaid & Argyle
  • Shearling

The hoodie mockups below were created in a few clicks using a few of the included patterns. Cool!
more-mockup-examples1

THAT’S IT!

Phew! We went from sketch to scan to final Illustration to mock up. Then we went ahead and explored the Hoodie Design Pack in a little more detail. I think that’s enough for this time! I hope you ended up with a killer illustration and had fun playing around with the templates.

New Go Media Forum

Go Media Forum now Open

Registration is now open for the new Go Media Forum! Why a forum? I originally planned it to mainly offer support for customers of The Arsenal. However I received a lot of messages from folks who wanted it to become a popular hangout for the design community.

While I would love that idea, it usually takes a community of great members to establish a forum as a go-to place for inspiration and resources. It’s not just up to me.

If the Go Media forum is to be what people want it to be, then it will take some outstanding design citizens to make it that way. A good forum is a place where a designer can promote his or her own work, get feedback, and help others. If done right, motivated members of the forum see an increase in their own brand awareness and often an increase in new work for him or her. Their expertise and dedication to the community will always help their bottom line.

I will continue to provide support for our customers and readers. So feel free to sign up and start posting on the forums. I am looking for forum moderators too so I’ll be paying attention to who participates and looks like they would make a good mod. In fact, Simon Hartmann, a loyal Go Media reader, has stepped up to be the initial moderator.

As always if anyone has suggestions on how we can make it better for the design community, let me know!

How to Design a Font: {Part 4} Finishing Touches


Well this is it – the final part in my series “How to Design a Font”! Be sure to catch up with the previous articles in the series:
Part 1: Get inspired
Part 2: Draw up a Storm! and
Part 3: Make it Digital

Great now we’re finally into fontlab. This is pretty much the easiest part of the entire process, so no worries. First thing you need to do is open a new font. Go to File, New and a window will pop up with a bunch of different characters: uppercase, lowercase, and various other characters. If you double click any of the windows with a character in them, you will be able to add in your own design. When the character is grayed out that means there isn’t any information there.


Now all you need to do is copy the character in Illustrator and paste it into Fontlab. Something to keep in mind is you may have to look around for your letter after you’ve pasted it into the window. Usually it won’t perfectly paste near the grid lines. You may need to move around the canvas and grab the letter and move it to the grid area. Just make sure that you are selecting all the nodes.

When the nodes are selected they will be red. Just click and drag to select all of the nodes at the same time. If you’d like to select only one node than all you need to do is click one at a time, pretty simple right!

Something that I love so much about fontlab is that each node is given x and y coordinates, so it’s easy to move around the nodes perfectly into place. You can move the nodes using the arrow tools on your keyboard. If you hold down the shift and arrow key together you can move an object much faster. If you’d like to work on another letter you just close out of the character window you’re working in and double click on another one. Continue copying and pasting your letters into each of the windows until you have imported your entire font.


Wow, you’re so close to finishing up this font it’s scary! You’ll notice that there are dashed lines on each side of a letter; these are to help with kerning. The red line is used to tell you the measure the distance between the stroke and the dashed line, I use this all the time. So how exactly do you figure out the right spacing for your letters? I have to admit that I am not a kerning pro but I have a little recipe that I’ve gotten from my book, Designing Type, that I’ve found really helpful. It really helps you to understand how letters work together and breaks down pretty much every letter’s characteristics. I would really recommend buying the book because there are lots of useful tid bits on how to make a kick ass font. Below is the formula that I follow whenever I am working on the kerning for a font.

Spacing Capital Letters

1- Set the left and right sidebearings of the H. Each sidebearing is 25-50 percent of the width between the inside of the strokes. Sans serifs have tighter spacing than serif fonts.
2- Test the sidebearings of the H by setting the word ‘HHHH’. The letters should be harmonious – not too open or cramped.
3- Set the left and right sidebearings of the O. These sidebearings are slightly less than the sidebearings of the H.
4- Test the O by setting the word ‘HOH’. The O should appear balanced between the two H forms, and the color of the word should be even. If not, revise the sidebearings of the O.
5- Re-test the O by setting the word ‘HHOOHH’. Again, all six letters should be harmonious, and the color of the word should be even. If not, revise the sidebearings of the O. The initial H may also require readjustment.
6- Once the H and O are satisfactory, the other upper case sidebearings can be set as follows:

Diagonal and open letters with minimum space:

4-A-4 4-V-4 4-W-4
4-X-4 4-Y-4 4-T-4 4-J-1
Straight sided letters with heavy verticals:
1-D-5 1-P-5 1-R-4 1-L-4 1-K-4
1-B-3 1-E-3 1-F-3 1-U-2 1-I-1
Straight sided letters with light verticles:
2-N-2 2-M-1
Letters with round sides:
5-Q-5 5-C-3 5-G-2
Letters with a central spine:
3-Z-3 *-S-*

1 Equal to the sidebearing of the H
2 Slightly less than the sidebearing of the H
3 Half of the sidebearing of the H
4 Minimum sidebearing
5 Equal to the sidebearing of the O
*Must be adjusted visually

Spacing Lower Case Letters

1- Set the left and right sidebearings of the n. The right sidebearing will be slightly thinner than the left, since the arched corner is lighter than the vertical stem. The left sidebearing is 25-50% of the n counter.
2- Test the sidebearings of the n by setting the word ‘nnnn’. The word should be even in color, and neither tight nor loose.
3- Set the left and right sidebearings of the o. The sidebearings of the o are smaller than those of the n.
4- Test the o by setting the word ‘non’. The o should appear balanced between the n forms, and the color of the word should be even. If not, revise the sidebearings of the o.
5- Re-test the o by setting the following words: ‘nnonn’ ‘nnonon’ ‘nnoonn’
Adjust sidebearings of the o and/or n as necessary.
6- Once the n and o are satisfactory, the other lower case sidebearings can be set as follows:

Diagonal letters with minimum space:

4-v-4 4-w-4 4-x-4 4-y-4
Letters with short vertical stems:
1-r-4 1-m-2 1-j-1 2-u-2
Letters with tall vertical stems:
1-b-5 3-p-5 3-k-4 3-l-2 3-h-2 3-i-1
Letters with round sides:
5-c-6 5-e-6 5-q-1 5-d-1
Irregularly shaped letters:
*-g-* *-a-* *-s-* *-z-* *-f-* *-t-*

1 Equal to the left sidebearing of the n
2 Equal to the right sidebearing of the n
3 Slightly more than the left sidebearing of the n
4 Minimum sidebearing
5 Equal to the sidebearing of the o
6 Slightly less than the sidebearing of the o
* Must be adjusted visually.

Ok, now our kerning is complete! This is pretty tedious but it’s so important to get a nicely kerned font, I would say that it is equally as important as a nicely designed font. If your font is hard to read then who will want to use it? So to test out your kerning abilities open up quick test to see how the kerning looks. To open up quick test go to tools > quick test as > Open Type TT (.ttf). A window will pop up with how your font would look all typed out. You can highlight the text and add in your own. A good sentence to test out is: The quick brown fox jumps over the lazy dog. This will give you a good idea of how the characters will work in a sentence. You can also grab some Lorem Ipsum online to test out whole paragraphs. Print out a variety of sizes so you can see how the letters work large and small. REALLY scrutinize the font at this point. You want to make sure that it’s easy to read. If it burns out your eyeballs you should probably keep working on the kerning.




Once you get something you feel proud of, you’re done. My test is that if I want to show the project to everyone I know, that means I did a sweet job. Fonts aren’t as easy to make as some people may think, it has taken me weeks to finish a font. You should be really proud of yourself for kicking butt and making something awesome. After reading these tutorials if you have questions please feel free to email me. If I’m not too slammed with design projects I’d be happy to help critique fonts or answer any questions. Thanks for sticking it out and getting through this marathon of a tutorial!

Cleveland’s Marathon, Go Media’s Design, Bill’s experience

Vector Girl on a motorcycle

Cleveland’s Marathon

This past spring I participated in the Cleveland Marathon. It was a lifelong goal of mine; to run a marathon. Being the designer that I am I couldn’t help but notice the design on the give-away t-shirts (which were actually very nice synthetic-fiber jogging shirts.) In my opinion the design could use a little help. My first thought was: “Go Media can do better than that!” I also believe that you shouldn’t complain about something unless you’re also going to offer a solution.

The solution was obvious: Go Media needed to get involved with the Cleveland Marathon! We needed to do our best to improve the designs of their t-shirts. So, a few months ago

Sexy Holiday Vector Pin-Up Girl Tutorial

Vector Girl on a motorcycle

A month or so ago I did this sweet tutorial of a pin-up girl on a motorcycle. It had been a project from on of our better clients. Since they liked and bought the design I thought that they wouldn’t mind if I posted a tutorial about how I made it. I was wrong. Threat of legal action later and that killer tutorial was taken down. I am truly sorry to our client. I should have asked.

BUT… …the tutorial was very good with lots of details. And I didn’t want to deprive you of all the time I put into it. There was only one thing to do: remake it. So, that’s what I’ve done. I found a different motorcycle, different girl, re-illustrated (vectorized) the entire thing, added a Christmas theme AND even added some more detailed instructions! 16 hours later, it’s better than ever and here for your tutorial pleasures.

Without further ado…

Holiday Vector Pin-Up girl on a motorcycle T-shirt Design (Phew! That’s a mouth full.)

It’s time for another sweet vector tutorial. And what would make a better subject than a pin-up girl on a motorcycle wearing a sexy Christmas outfit? Well, not much. At least, not much in my book. So, let’s get right to it. Oh – quick warning; there will be a few gratuitous plugs for Arsenal products at the end, but it’s just a little bit right at the end. This tutorial can be completed at no expense to you. ;)

Here is what our final design is going to look like:
Vector Girl on a motorcycle

This design took me eight twenty-four and a half hours to complete from beginning to end. The first time I did it in about eight hours. Then it took me 16 more hours to rewrite this tutorial and redo all the artwork.

What you’ll need to complete this tutorial:

A computer
Adobe Illustrator
Adobe Photoshop (just a little bit)
Access to stock images (or stolen ones will work too.)
Client logo (if you have a client)

This tutorial will cover:

• The Technique
• Finding Photos
• Proper perspective
• “Frankensteining”
• Vectorizing the girl
• Making vector fur
• Vectorizing the motorcycle
• Grabbing some stock vectors
• Putting it all together
• Mocking it up

Project Synopsis:

Originally this project was to design a series of new t-shirts for an American motorcycle company. Some of the direction we were given was: “comic book style drawings” and “an old school style pin-up girl.” I thought I could combine those motifs into a modern vector style pin-up on one of their newer more contemporary motorcycles.

The Technique

The technique I used for this design is vector illustrating off of photographs. I could hand draw something then create my vector art off of that, but that would take about twice as long. Working off of photographs is like having a model. Unfortunately you can’t tell your photo to change positions, so you’re forced to do an extensive search until you find the pose you’re after. Once you assemble the images you need you’ll place them into Illustrator and draw vector shapes over the photo to create an illustrated look/feel to the design.

Finding Photos

Finding the photos that you’re going to use can sometimes be a real lengthy process. I have spent as much as 2-3 hours looking for the “right” photos. When I am working on paying projects I like to find my images on royalty-free image websites like istock.com. This way I can avoid any legal entanglements that might get me or my client in trouble. BUT – as you are creating vector art out of these images and not using the photos themselves it does open up the opportunity to “steal” some images. If you’re going to use unlicensed images as a resource for vectorizing just make sure your final art is not recognizable (in any way) as that original photo. When in doubt I say just pay for your images. Certainly for a client as big as this one was and the possible huge exposure it will get, it’s best to play it safe. And please – always protect yourself. If you’re dragged into court because you stole an image – the defense: “But Bill told me I could do it.” won’t stand up.

Proper perspective

I know the final piece of art I’m after is a girl sitting on a motorcycle. It would be great if I could find a picture of a girl in the pose I want on the exact model of motorcycle that I like. But that’s not going to happen. Even better would be if I HAD the motorcycle of my choosing and a hot model to shoot photographs of. But that’s DEFINITELY not happening. So, I’m going to have to find the images of each separately, make sure the fit together (have the same perspective) then draw them together. In this case I think it will be easier to pick the motorcycle picture first then find an image of a girl to fit onto it.

Vector Girl on a motorcycle

For this design I chosen this slick contemporary motorcycle (all logos have been airbrushed off to protect the innocent.) What else can I say? It’s a fairly sweet looking motorcycle. I think it looks a bit more modern than a normal “hog”. I chose this particular photo because it shows off the bike itself. It was originally a shirt design for the manufacturer and I thought they would appreciate seeing the details of the motorcycle. Artistically I would have preferred to use something that had a fish-eye lens type of effect with the rear tire as the focal point. But the bike would be hard to recognize and trying to find a picture of a girl at that same perspective would be nearly impossible. This photo is a straight-on perspective shot with a typical 35mm lens. It shouldn’t be hard to find a picture of a girl that fits.

“Frankensteining”

For the pin-up girl here is the first photo that I found that I really liked.
Vector Girl on a motorcycle
She looks hot and has a sexy dramatic pose. Also, her upper body seems to be angled as though she is sitting on my motorcycle. Unfortunately her hips and leg don’t quite look to be in the correct position. If she were sitting on a motorcycle her hips would be turned more toward the camera and her leg would extend out almost straight. No problem, I just need to pull a “Frankenstein.” To “Frankenstein” a photo is to take several different photos, cut different body parts and put them together. In this case I need a beautiful leg to attach to this torso. Here is the image I found.
Vector Girl on a motorcycle

Also, I’m not a huge fan of the face on my girl in the photo. I could find yet another image, but I happen to recall a great vector face I’ve got in one of our vector packs. It’s a beautiful face that’s in the sexy vector pack which is part of Vector Set 2.

Here is that face:Sexy Vector Face

Now – you don’t need to use a stock vector face, You can use the face in your original photo or just find a different face to vectorize. Here is a sample of a face that I vectorized… just to give you an idea of how the vector lines look.
Sexy Vector Face

When you’re piecing together a bunch of photos like this (three parts of a woman and a motorcycle) it’s helpful to bring your photos into Photoshop and do a quick mock-up to make sure all the different parts will fit together when you’re done doing the vector illustration. To do this I will make a rough cut-out of each body part and layer them on top of my motorcycle. This will require some rotating, reflecting and scaling to get them into place. This allows me to get a sense of where the pieces overlap and fit together. Here is the Frankensteined body parts and motorcycle for this pin-up put together. I think it looks pretty good.Sexy Vector Face

Here is what this design looks like now that I’ve mocked up the photos together. These all seem to fit together so now I can take these over to Illustrator and start illustrating them. It’s smart to use the free “comps” (preview images) from royalty free stock image sites to make sure the pictures will fit together before you pay for high resolution ones.

Vectorizing the motorcycle

I decided to start illustrating the motorcycle first. Before I begin making my vector shapes I’ll try to decide how many different colors I’m going to use. This makes my decision making process easier while I’m drawing. I can look at each area and ask myself: “Can this be defined with one of my colors?
Vector motorcycle color selection
Here is a little diagram showing the colors I selected and some samples of each color on the motorcycle. You can see that the four colors I selected are a real light grey to represent the chrome, black for the, uh, black, dark grey for the dark grey and a medium grey for the middle greys on the bike. It’s important to LIMIT THE NUMBER OF COLORS you select. There are a couple of reasons for this. First and foremost is the fact that it SHOULD look like a drawing. If you have too many colors it starts to look like a photo. If it’s going to look like a photo, then why not skip the labor of vectorizing and just USE the photo? Secondly the more colors, the more work! And nobody likes that. I try to limit myself to 3-6 colors per object. You can see that for this motorcycle I’ve selected 4 colors; black, dark grey, medium grey and off-white. This shouldn’t be too hard.

The first step I take whenever I’m doing a vector illustration off of a photograph is to outline the entire object I’m working on. This will allow me to draw vectors right up to and past the outline of the shape, then quickly chop off the excess. Let me show you this process.

Step 1. Outline your object (in this case it’s a motorcycle.)
Vector motorcycle step1
Step 2. Draw an interior shape that butts up against the edge. Since we already have the outline of the object drawn you don’t need to worry about the portion of your shape that is part of the outline. We will use the pathfinder tool to chop off the excess.
Vector motorcycle step 2
Step 3. Make a duplicate of your outline and paste it directly on top of the current outline. You can accomplish this by clicking Edit/Copy then Edit/Paste in Front. Or, you can simply use the quick key combo of Control-C then Control-F. Now you will have two exact copies of your outline with the new one on top and still selected.
Vector motorcycle step 3
Step 4. Hold down the shift key while you select the new interior shape that you drew. So, now you should have two shapes selected – the interior and one of the outlines.
Vector motorcycle step 4
Step 5. Use the Pathfinder tool: Intersect. This will preserve the shape where the two shapes overlap, or, intersect. Essentially, this will chop off the excess shape outside the outline.
Vector motorcycle step 5
This may seem like a lot of steps, but once you’ve learned it you’ll be able to do this in a split second. And that’s certainly faster than having to draw the edge of everything that butts up against the outline.

Now that you’ve got that little trick under your belt… you still need to endure the slow laborious process of drawing each individual vector shape. This is where you earn the big bucks.

One other thing to keep in mind is the stacking order of your shapes. The first shape you draw will be on the bottom. The last one you draw will be on top. So, if you can clearly see that one shape is on top of another… …start on the furthest back shape first, then build your way up. If you do make your shapes out of order; no problem. You can always reorder them. It’s just faster easier if you work in order the first time through.

Here is my final vectorizing of this motorcycle (Just the shapes with no colors put in.)
Vector motorcycle line art
And here is what the final motorcycle looks like with no outline and each shape filled with the appropriate color.
Vector motorcycle line art
premium subscriber benefits rss

Vectorizing the pin-up girl

Now that I have found the pictures on I-stock that work for this composition, I will buy the high resolution versions. You may wonder if it’s possible to just use the low resolution comps for doing the vector illustrating on. In my experience; no. When you zoom in to see the details they’re all pixels. It becomes very difficult to decide where to draw your lines. The higher the resolution the image is the easier it will be to illustrate (vectorize) it.
As my girl is in two pieces and as I’m fairly confident that I can put those pieces together – I will illustrate them separately. Also, I have a little skirt to cover the joint between the leg and the torso. As with the motorcycle, I always start with an outline of the entire object. Then I will build up lights and darks on top of that shape. Here is the leg with the first few sets of shapes defined.

sexy Vector leg outlines

You’ll notice I didn’t get too detailed near the foot. In fact, I thickened up the part around her foot and thickened the heel. I know that this will turn into a sexy boot later, so, no need to worry about the details around her toes.

Here is the leg complete and filled with the five colors I’ve chosen for her skin. Also I went ahead and did the outline for the boot. You’ll notice that the boot follows the shape of her body fairly close. All you really need to do is add a few wrinkles where the boot flexes at the Achilles and also add a little flair out at the top where the boot meets the leg. This creates the illusion that the leg goes into the boot.
sexy Vector leg outlines
We will illustrate the upper body the same way as the lower body and the motorcycle. We start with an outline then draw shapes to define areas that are lighter or darker. You’ll notice that most of the shapes have soft round corners. The gradients that make up these shapes have smooth transitions, so you want to avoid sharp corners.
I tend to put more shades of color and more details into the face. That is where all the beauty and emotion is shown. So, there are a lot more details in the face. Also, for women I will exaggerate the fullness and color of the lips. I will also exaggerate the length of the eye lashes and even increase the size of the eyes slightly. After all, this IS an illustration. Why not take advantage of your ability to “play” with the proportions and details. You can shrink the waist, increase the bust, lengthen the hair – whatever. It’s your illustration! And just to be clear that I’m not being sexist; I use the same technique on illustrating men. I make them more muscular, strengthen their jaw line, broaden their shoulders, etc.
I’ll usually put the hair on last. It’s easy to layer it on top of the head once everything else is in place.

One very challenging (code word for annoying) part of the girl is the fur on the edges of her outfit. In order to speed up the fur-mailing process I will follow these steps.

First I outline the shape with large clumps of hair (fur).
drawing Vector fur
Second I just draw lots of simple vector lines.
drawing Vector fur
Third I create an art brush in the shape of a simple triangle. When it is applied to these curving lines it will look just like more hairs.
drawing Vector fur
Fourth I will use the: Object/Expand Appearance to convert these brushes into solid vector shapes, then I will use the Pathfinder/Merge option to combine these hairs with the original shape.
drawing Vector fur

So here is our complete girl with boots and sexy Santa Claus outfit.sexy Vector Ms. Claus

You’ll notice that I added a sack of Christmas gifts over her shoulder. I noticed that her arm and hand were in just about the right place. All I had to do was add some fingers grabbing the sack.
One last little detail to help make this look like an illustration; a black outline. To make the black outline I will select the entire girl, Copy/Paste then Pathfinder/Merge to create one single shape. I’ll add a black outline to that shape and drop it right behind my pin-up.

drawing Vector fur
Now here she is placed on top of her motorcycle! Wa-Hoo! She looks hot! Sometimes I put a smile on my own face. This is working out better than I had anticipated.

Almost done. Now, for some fun stuff.

Grabbing some stock vectors and Putting it all together

Ok, we’re almost done, but we need to add some artistic elements into it and add the Go Moto Cycles Logo. Fortunately for us we’ve been provided with vector logos by our client. And for additional vector shapes to finish off the design, it’s off to the Arsenal!
Remember that gratuitous plug for our products that I warned you about earlier? Well.. here it is: Go Media’s Vector Packs are an EXCELLENT resource for design elements. I will frequently use them to either make a complete design or use them to polish off a near-complete design.
drawing Vector fur I scroll through our store and found this pack of halftone patterns I thought would look slick on the design.
vector halftones
At this point I am just taking my halftone vectors and brand logo and arranging them behind my girl and motorcycle until it looks good. Here is the final composition:Vector Girl on a motorcycle

Mocking it up

Now that I have the design done I need to make sure the client likes how it looks. I believe that it helps to mock up your design on a shirt. The cooler you can make the design look (by mocking it up) the better chance you have that your client is going to like it. Are you ready for some more product plugs?? Why sure! First, I drop my design onto a Go Media Apparel Template. The nice thing about using a Go Media templates is that it only takes you a split-second! The masking is done, the shadows are already in place. All you have to do is drop your art onto a layer in photoshop, resize it and pull the mask down!

Here is a little diagram of how the template is set-up:
drawing Vector fur
Also, I want to put a slick texture in behind my shirt. NO PROBLEM! Let’s revisit the Arsenal and grab a texture from our wood pack.
drawing Vector fur

Now we put it all together and Voila, masterpiece design!

drawing Vector fur

Intro To 2.5D Compositing in After Effects [Video Tutorial]

Amazing Distressed T-Shirt Mockups in less than 3 Minutes

47 Essential Resources for T-Shirt Designers

Interested in starting your own clothing line? Or maybe you just want to get an edge on some of the other designers on the major social t-shirt sites. Either way, there is a world of resources to be discovered that can help you do both.

This post will help you find all the tools and resources you need to start your own clothing line. By doing so, you will be entering the ranks of such super stars as P Diddy, Martha Stewart, and that model who sells clothes at K-Mart.

In the links below you will find resources for t-shirt designers all across the web. While a number of the tools and tutorials can be found right here at Go Media, we have also included a great number of other off site resources. After all, this wouldn’t be the ultimate resource for t-shirt designers if we just stuck to this site now would it?

Well, maybe it would, but that’s for another day. So, here you go, the ultimate collection of resources for t-shirt designers.

Books

This collection of books and e-books can teach you just about everything you wanted to know about printing shirts, cutting shirts, selling shirts, and more.

Thread’s Not Dead – $47 – Amazon
Widely considered the “Bible” of t-shirt design, this is a must have.

Download a free chapter

holding_tnd

Full for Design (Website: $37)
One of the most up to date e-books about starting your own online clothing line.

Generation T: 108 Ways to Transform a T-Shirt (Amazon: $10)
Teaches you a bunch of really cool ways to cut up your shirts to make them even more unique.

300% Cotton: More T-Shirt Graphics (Amazon: $20)
The third in a series of books that showcase the art of t-shirt designs.

Simple Screenprinting: Basic Techniques & Creative Projects (Amazon: $20)
Includes over 20 different screen printing projects on shirts and other surfaces to help you learn how to screen print.

T-Shirt Factory (Amazon: $17)
A showcase of over 300 outstanding t-shirt designs.

Vintage T-Shirts: MORE THAN 500 AUTHENTIC TEES FROM THE ’70S AND ’80S (Amazon: $17)
A celebration on popular vintage t-shirt designs from the 60’s and 70’s.

Vintage Rock T-Shirts (Amazon: $20)
Showcases fan made and non-commercial use t-shirt designs used to promote singers and bands.

Print Liberation: The Screen Printing Primer (Amazon: $17)
The complete DIY guide for learning how to make your t-shirts.

Photoshop CS3 for Screen Printers (Amazon: $30)
Teaches you how to use CS3 to create better images for screen printing.

Do It Yourself Screenprinting (Amazon: $8)
Uses drawings and illustrations to teach you step by step how to screenprint.

How to Print T-Shirts for Fun and Profit (Amazon: $40)
The best book on the business of starting your own t-shirt company.

Where to Sell Your Designs

Social t-shirt sites are popping up all over the place these days. This is great for both professionals and wannabe professionals because it offers more outlets for you to sell your designs. But, which of these t-shirt sites are worth getting involved with? Below are some of the more popular t-shirt communities.

Threadless
One of the original t-shirt community websites.

Design By Humans
T-Shirt community site that works on public voting.

Red Bubble
Artistic community where you can upload your design and Red Bubble takes care of the rest.

Cafepress
Upload your design and Cafepress will market, sell, print, and mail your shirts for you.

Big Cartel
This is a cool site that lets you create a really nice online store in just a few minutes. I highly recommend this one.

Spread Shirt
This is another site that is extremely similar to Cafepress.

Odicca
No public voting here, Oddica gives artists 41% of each shirt sold.

Tee Tonic
Allows you to submit your design to be voted on.

La Fraise
This is kind of like the French version of Threadless.

Enclothe
These guys don’t accept unsolicited designs, but they are always on the look out for new artists. Feel free to send them a link to your portfolio.

Blank Clothing, Vectors and Templates

Spend any time looking for these online and you will realize just how hard they are to find. Luckily we’ve created an awesome blank t-shirt pack. If you have happened to miss this, you should seriously check it out. Aside from the product shout outs, there are also some round ups of free t-shirt vectors and more.

Included in this list are some great site for finding quality vectors, both free and paid, for helping you create your killer design.

Inspiration

Are you having a tough time coming up with an idea for your next t-shirt design? Then check out this collection of some of my favorite t-shirt designs. These designs have come from a variety of designers and websites. Hopefully they will get your creative juices flowing.

Zombi Zombie

The Old Man in the Sea

The Audacity of Joke

Altitude Sickness

Pen Tool Sun

Royal Hush

Ninjas vs Luchadores

Flowing Inspiration

Amazon Addiction

Tutorials

Looking to up your t-shirt design skills? Or maybe you are just learning the ways of the business. In this collection of tutorials everyone from the advanced designer to budding newbie should be able to find something interesting.

Add to the List

What do you think? Do you have or know of any other great tools and resources for t-shirt designers? If so, lets us know by leaving a comment below.

How to Design a Font: {Part 3} Make it Digital!

The Grid

Now that you have your font pretty well figured out it’s time to get into the computer. First things first, setting up Illustrator. I like to first turn on the grid. This is the easiest way to transfer your font from the grid paper to the computer. To turn on the grid go to “view” under the menu bar, then “show grid”. Once you have the grid on you should turn on the rulers (also under “view”). Make sure to adjust your rulers to points instead of inches or whatever your default is. Just right click on the ruler and select “points”. The reason you want to be working in points is because that is the measurement system that fontlab uses too. Now what I do next is to figure out the height of my cap height, ascender height, median, baseline, and decender.


Now as a little refresher from our last tutorial remember that the cap height is just under the ascender height. The median is about 60 percent the total height between the baseline and ascender height. Might need to use a little math here; take your total height and times that by .6 and that is going to be your median. This isn’t an exact rule but traditionally that is where the median is placed. The height of your characters should be about 700 points high. I’ve noticed that sometimes when you import a character very small fontlab doesn’t perfectly paste the character’s nodes. If you have a character with lots of rounded areas sometimes fontlab will paste nodes weird. There is only a slight difference but it can be a bit annoying. Make sure you NEVER scale up your font once you get into fontlab.

\

The Font Toolbox

Alright, now that you are all set up it’s time to get crackin’. How I start out is making a font “toolbox”. What I usually do is make a variety of different forms that I’ll use for the rest of the font. This way you make sure that all the forms are completely the same. Here is an example of a font “toolbox” that I use to make Usonia. Amazingly you don’t need that many pieces to create a font. If you are making a script font a toolbox probably isn’t going to work well. What you might want to do is simply scan in the grid paper and trace directly into Illustrator.

Every font is different with different accents you may want to add to the characters. The best thing to do is to figure out what pieces you’d like to use pretty regularly and make the shape. The key here is usability, try and make the shape as usable for as many characters as possible. These are the types of shapes I make: stroke, serifs, shape that connects strokes, additional accent pieces. There isn’t a hard and fast rule to making certain shapes, just make pieces you see yourself using a lot. Cool, now we are good to go onto putting together the letters.

So what I do at this point is refer back to my drawn shapes I made before, this is basically like my blueprint for the characters. What I do is copy and paste the pieces out of the toolbox I think I’ll need to start arranging them into the characters. If you find that you need to make a stroke make sure that you expand the stroke so that it turns into a shape. To do that go to “object” then “expand”. A little window will pop up that asks if you want to expand the fills the strokes. Just click OK.

As I am working on a font these are some of the most common tools that I use:

Transform: Sometimes you want a shape to not change size, just orientation. Use “object” then select “transform” from the drop down menu. You’ll have all your options there to pick whatever you’d like to do. It’s a lot faster than trying to completely redraw your shape!

Direct Selection Tool (open arrow): I use this tool a lot if I want to delete or move particular nodes.

Pen tool: I use this a lot to make extra pieces. I like to make rounded parts of my letters a lot so I most often use the pen tool for those. If you want to make a rounded corner then click in one place on your canvas, then try and pick a place diagonally away from that point and hold down your shift key and drag and it will use only 90 and 45 degree angles to make the curve.

Zoom tool: Really zoom into your font to make sure that all your separate pieces are lining up right. I usually zoom into my font for fine tweaking whenever I am moving a piece into place.

Once you have assembled all your pieces together you’re almost done. Make sure that all your strokes are expanded and you’re ready to merge the shape together. If you don’t expand your strokes you will run into issues since fontlab doesn’t read strokes, only shapes. It will see a line but nothing filling in that line, so strokes in fontlab just look invisible. So now that all of our strokes are expanded we can merge the shape. Open up your pathfinder tool. There are several different options you have here. The one you will most commonly use is “merge”. This one takes all the shapes you have selected and merges them into one shape. To help avoid problems later on its best to just merge in Illustrator and get the font looking EXACTLY how you want now. I only like adjusting kerning (space between letters) in fontlab.

Now let’s say you want to make a grunge looking font. Grab one of our grunge vectors and you can overlay that on your letter. Now with both selected click in the pathfinder tool “minus front”. Generally this should work for you but honestly I’ve noticed this tool is a little funny. If this doesn’t work or subtracts pretty much your entire letter then try another tool or select only part of your letter with the direct selection tool and try it then. Sometimes a process of elimination works best.

Ok now that you have all of your shapes together it’s time to do a little cleaning. So what I’ve noticed with the merge tool is that it will add extra nodes sometimes to the shape. What you have to do is zoom way into your letter and, using your pen tool, delete these extra nodes. This may seem sort of tedious but sometimes fontlab can make your letters look jagged so getting rid of these extra nodes leaves you with a smooth curve. What we’re trying to do is make sure that the font is as PERFECT as possible before you get into fontlab. Once you get into fontlab, believe me it’s all downhill from there!

So once you have done all of these steps for every character you’re probably pretty tired! Making a new font is a LOT of work. So take a quick break, and grab yourself a little snack! Once you’re fueled up it’s time to make your characters huge! I’ve noticed that fontlab has a default size of 700 points tall. So you could start out at that size. Make sure you grab ALL of the letters and special characters and size them all at the same time. You spent all that time getting them perfect, the last thing you want to do is size them up individually and then they’re all different sizes. Amazingly you can really tell if some letters aren’t the exact same size. Keep in mind that it doesn’t matter if you go outside the canvas area, since you’re not printing this it doesn’t matter if the characters are all inside of the live area. Usually when I size up my fonts they go pretty much to the end of the entire work space! What I usually do is turn on my rulers and put guides at 0 and 700 so I know exactly how large to make the letters. Well that is pretty much it for Illustrator.

Now we’re ready to get into fontlab so get ready for the fourth and final installment sometime next week!

Advanced Hoodie Video

Freebies, Discounts, Vectors & Textures!

Discounts

Last week Go Media’s Arsenal released Tennery & Ladies Short Sleeve Templates. This week Go Media has two major resources to announce – Vector Pack 13 & Fingerpaint Textures! To celebrate the new packs, we’re sharing the discount code usually reserved for existing customers only. So, when checking out, just use the code: thirteen to get 15% off the already super low price. We know times are tough, but that shouldn’t mean you have to go without the latest design resources! Hope this discount helps. Be sure to use it right away because the code will expire in two weeks, on November 28th.

Freebies

It wouldn’t be Vector Pack season if there wasn’t a freebie involved! Here are seven pieces from the new Vector Pack 13 – my favorite from each pack. Each set has a lot of variety, and it was hard to pick a favorite! Definitely check out the real thing over at the Arsenal.

Free vector pack 13

[download#29#nohits]

BONUS: We’re also giving away two hi-res freebies from the new Fingerpaint Texture pack! If you’ve downloaded either of the Watercolor Texture Packs, you know how useful these things are.

free fingerpaint textures

[download#30#nohits]

Go Media Construction Update

Hey Everyone! There have been some requests to see updates on the office construction. We ARE in the new office! Everything is not done yet – but it’s about 90% done. I’ll try to keep the text in this post fairly light and just show you as many pics as possible. You’ll notice there is lots of extra room. I wanted to make sure we built a space

Tennery Typeface & New Apparel Templates

Watch out! It’s Big November at Go Media – and that not only means tons more awesome design resources to spice up your upcoming projects, but a whole new & improved Arsenal.

We’re kicking it off with the Tennery Typeface and latest installment of Apparel Templates.

Tennery

tennery
I remember when Oliver started working on Tennery last summer. I was a big fan of it even in the early stages, and I think it shaped up into an incredible typeface. It’s really unique and yet totally applicable – and comes with three weights plus oblique versions. The lower case ‘y’ in Tennery is one my favorites. Definitely worth checking out.

Ladies Short Sleeved Templates

You may remember that last month the Ladies Long Sleeved Template Pack was released. Jimiyo wrote a pretty sweet tutorial about his process for mocking tees back then, but he was actually using an early version of our Ladies Short Sleeved Templates . A lot of you commented wanting to know when those would be available. Well today is the day!

apparel template layers

We listened to your feedback about our first Apparel Template Pack and made a lot of changes for this latest version. They’re now in PSD format (no more Tiffs!), have layers that make it even easier to change the shirt color and new highlighting (in addition to shadows). The biggest change is probably how much easier it is to paste ‘Your Art’ right into the shirt area. No more mask dragging. Just paste & go.

Arsenal 2.0

Finally! We’re getting really close everybody. We’ve totally outgrown the current Arsenal, and we’re pretty pumped to be able to do a better job giving you fresh design ammunition. So get excited for more reliable downloads, forums, better search, and user accounts!

We’re opening the flood gates on new design resources. Look out for a ton of new stuff this month!