T-shirt Design Process and Tutorial


#1

Im starting a new t-shirt design. I will try to make this an insightful overview with tips and tricks on how I go about creating a design.

Feel free to ask questions, or comment as you please.

I watched Water Horse, and I sketched during the movie. Immediately even before seeing the movie, hearing the words ‘water horse’ brought a vivid image in my mind. As I began to watch and sketch, the idea was formulated.

“I am his only friend” was one of the lines that stuck out. For me, I started to think what would be a good message?

“He was my only friend” rang in my head. Im secretly a tormented artist who has tendencies to be melancholic, so this phrase was delicious to me, BUT, I thought it would be better to tend towards a more positive message. So

“Imagination” is the title, and the idea is “I wish to live the life of my Imagination.” This is pending. It seems to always change…

It reminds me of a Colin Hays song lyric, “When I awoke today, suddenly nothing happened But in my dreams, I slew the dragon”

If only, we could, or tried to live the lives of our imaginations, what we could accomplish…

Anyways. Heres the sketch snapshot.

TIP: I know I will probably make it front chest centered. I have a tendency to try to make my compositions an upside down triangle when doing center chest. The reason for this, is it has a slimming effect, and in general is aesthetically pleasing as the human form is similar being the shoulder are broad and slims until the hips… erm… most of the time.

Designs that are heavy at the bottom of the shirt and rise have a tendency to make the person look bottom heavy, and also for large bosoms, sometimes designs get lost under the fold.

Laying out the general shape of the design you want will make it easier for you to imagine your t-shirt canvas.

TIP: After scanning the sketch, I leveled most of the gray out to get clean lines, then used brightness/contrast to reduce to gray with dark lines.

WHY? You dont want to stare at a high contrast image all day while working do you? And you would be amazed at how easily now you can pop things into 3d by adding white as a highlight. Thats for later…

TIP: I do everything in raster/Photoshop. I start at

16x20 inches
300 DPI

and although this is very specific to my design workflow, I work in GRAYSCALE. mainly because I save the coloring for last, and to be efficient. In grayscale, you only have one channel. In RGB, you have 4, so 4 times the data for everything you do.

That’s all for now.

Anyone have any questions? Know how to use Levels?


#2

Can’t wait to see it through.
-Andy


#3

What a cool idea, Jimi! I think I’m going to learn a lot from this :slight_smile:


#4

Don’t you mean 3?


#5

technicality.

if you count the composite as one, then four.
if you only count red, green, blue, then three.


#6

PC only - Adobe Photoshop Save Jpeg Script

I obtained this from the internetz.

This is a tool I often use to capture snapshots for progression shots, as well as in the end when you need a composite to make a comp. I’ve made an action out of it, so I just press a button and it saves a jpeg for me. It’s faster than the manual Save for Web option.

This JavaScript will save JPG snapsots of the current PSD image to the same location where the PSD is saved. Each image saved will have a timestamp appended on the filename in the format “filename_MMDD-00h00m00.jpg”

Download link: http://www.jimiyo.com/downloads/savejpeg.js (You may have to use ‘save link as’)

To use this script, File > Scripts > Browse


#7

I rarely venture into EBW, but glad I did this time.

Better watch out, jimiyo, or i’ll steal your soul and make your pictures myself.

EDIT I was going to do a thread like this a while ago, but then I thought “dude, yyou’re not that talented” so I didn’t. I’m glad someone who does gotz the mad skillz took up the challenge.


#8

Here’s my first attempt at a video tutorial. It’s just a basic overview.

(I was raised in Tennessee, please excuse the heavy accent.)

Ill cover the techniques used in the following comments, possibly later Sunday evening.

Here’s the first video. Eventually, I might upload the videos to youtube so I can embed them, but for now you’ll have to follow this link.

http://www.jimiyo.com/woottut1/country.html


#9

Jimi, you definitely sound like you were channeling Bob Ross during this video. Love it. God I miss that man’s show, better than valium it was. Thanks for the demo and the useful information. Someday I aspire to using better techniques. :slight_smile:


#10

Thanks for the tips. I hope other people write stuff in here. Even if they think they aren’t experts there are loads of people who would love to learn more, but don’t even know where to start (thinking of myself).

Bob Ross had the best fro for a white guy ever! Love them happy little trees.


#11

Hey guys. Thanks for responding/commenting. If you have any questions let me know.

Here are some of the short cuts discussed in the video, and other short cuts.

In #1 and #2, I am referring to the boxes of color at the bottom of the adobe tool palette.

  1. ‘X’ - toggles from foreground and background color. This is useful for toggling between black and white when painting on a multiply layer. This requires that the FG/BG colors be set to default black and white. If you have used any other colors, this may not be so…

  2. To reset the foreground and background colors, press ‘D’

I used to have this pasted on my monitor. Now I am shortcut master. These are just the basics. When you reach Shao Lin PS Master level 6, you will contort your fingers into things like

CTRL-ALT-SHIFT-N for New Layer without prompt, or
CTRL-ALT-SHIFT-E for Flatten all Visible layers onto current layer

I’ll add more later!

  1. To use Dual Windows for Image, goto

Window > Arrange > New Window for (Image Filename)

This will allow you to zoom into one, and still see updates in a zoomed out view.

http://www.jimiyo.com/misc_fullsize/adobeguide.jpg


#12

Here’s a video of how I make swirlies. Hope you find it enlightening and entertaining.

http://www.jimiyo.com/woottut2/Swirlies.html


#13

Jimiyo, this is incredibly generous and helpful of you to do! I’ve already learned much just from reading your blog and tutorial/tip site. Thank you for posting and keep it up.


#14

the video terminates about half way through, what up? oh, and thnks for this Jimiyo, i definitely am inspired by your skills and can now steal them, albeit i must figure out how to do em on open source equivalents. and somebody pointed out i :j or;j like you… uh…
I’m just starting out so if you would be so gracious as to send me critiques, it would be aprreciated, that goes for everyone. Thanks for the excuse St. Patty.
:j


#15

I think this design is wonderful.

Thanks for taking the time to instruct. I give classes in beginning watercolor, so I know teaching can really eat up your time and energy.

I’m obviously new to the t-shirt design game and would like to know if Adobe Illustrator would be a good software to use for this purpose. Photoshop is out of my budget range (ouch!) but I figure I could stimulate the economy in a few weeks by buying A.I.

Do you think that might be a good place to start?


#16

Hmm… I use Illustrator for everything, and I’m finding it difficult to try to stroke using the pen tool in Photoshop. At least, it’s not set up to do it easily enough, but I just managed to do some at 2 AM before bed. Going to try it again.

One question- what works better- making pressure-style strokes using the pen tool, or making a shape using the pen tool and stroking the fill?


SILLINESS: Randomly quoted posts of no particular significance.
#17

I tried this out too. Pressure style strokes were easy enough once I found the right way to do it. The simulate pressure function was hiding from me, but I found it (right clicking the path with the path selection tool and clicking “stroke path”). I just wish it were easier to curve the path. I keep losing those little adjustment points. I found a decent tutorial on making shapes with the pen tool too


SILLINESS: Randomly quoted posts of no particular significance.
#18

Hey guys, I appreciate the comments!

Ill try to catch all the ques, if they havent been answered by someone else.

  1. Video terminates about half way through, what up?

Im still learning the recording software.

  1. Adobe Illustrator would be a good software to use for this purpose…Do you think that might be a good place to start?

Yes. Illustrator is a good product, I find it difficult to use. Even having used it for several years, I rarely touch it unless necessary.

If you want to experiment with Raster graphics. There is an open source product you could use called

GIMP - http://www.gimp.org

or

If you buy a WACOM tablet, which I would suggest, it comes with Adobe Elements, which is just a crippled version PS. It has all you need to make tshirts. Tablets range from $79 up. Graphire is the entry level one, I believe still comes with Elements.

or

PaintShopPro, I believe is another product. It’s been a while since I used it, but its very easy to use, and has other fun tools that PS doesnt necessarily concentrate on.

  1. Schrobblehead that is a most awesome link to a pen tutorial. I didnt want to have to make a pen tutorial. That one is SWEET!

i agree with Schrobblehead. Pressure style strokes are easiest.

I have a simple overview on how I use the stroke with pressure technique at
http://blog.jimiyo.com/?p=1


UPDATE

http://www.jimiyo.com/2008/imogen2.jpg


#19

l o l. It definitely helped me (along with your video). I’d been struggling to draw clean lines with my tablet.


#20

Thank you for the suggestions. I’ll look into them.

I have a somewhat hard time with depth perception and image distortion since I had to have a tumor removed that was near an optic nerve (wouldn’t you know) many years ago. I find that I can achieve depth in watercolor by using gradients and perspective. I can’t draw things freehand because the process of seeing something and translating onto paper gets garbled, so I have to take a photo, print it out, trace it, and then transfer it to the watercolor paper. It can get pretty grueling sometimes. I also have a large collection of images that I’ve accumulated of photos out of old magazines, etc., where the copyright has expired. I’m hoping that whatever software I end up with can help streamline these processes.

This is an example of my watercolor work. It’s a mermaid with a crystal ball, “seeing” her favorite dry land treat, coffee.

I wanted to enter a version of it in the “water” themed derby but wasn’t able to finish in time:

I have another one that’s Egyptian-themed, maybe I"ll get a chance to use that sometime.

Anyway, pardon my ramblings and again, thanks so much.