Drag Idol image

Let me start by saying this: I am not a graphic designer. I’ve had no formal art training. If you put a Monet and a Renoir in front of me, I’m just as likely to tell you they were done by Degas as I am to tell you they were done by Picasso. I’m just clueless on art, generally.

Thus, when I was tasked with making us a poster for Drag Idol ‘07, I was a bit queasy at the thought. I had just finished designing the poster for Pride Idol ‘07 (another post), and I already felt like I was running out of creative steam. I consider myself a jack of trades, and a master of none — so it’s easy for me to burn out on ideas for these kinds of things. Nonetheless, I had to soldier on. Joe was breathing down by back (hee!), and we needed something to put up in the clubs.

(BTW: You can click any of the images below to see a larger version.)

Drag Idol roughAfter telling Joe that I wasn’t sure I could do this one, he sent me a picture he had found on the internet. While I have no artistic ability to speak of, one that I can say with pride (no pun intended) is that I do have something of an “eye” for what’s going to work and what’s not. What I knew from viewing this image was that it would be difficult to pull a usable poster out of it for a few reasons:

  1. Fuzziness: it simply wasn’t a clear enough picture, which compounded our next problem…
  2. Too small: if you’re planning on printing something out, it needs to start BIG. While Photoshop and other graphic programs can help you size images up, there is a point beyond which lose clarity.
  3. Not ours: I’m sure Joe had intended to get the creator’s permission, but quite frankly that kind of stuff is just annoying. I avoid it whenever possible by using royalty-free images.

All that being said, there is one good quality to this image: it’s colorful. It certainly would have been eye-catching, had we gone with it.

I could tell that Joe was struggling with what to do about this poster. Norman (the owner of the bar where we’re having the fundraiser) had sent him an e-mail saying we needed to get some posters up well ahead of time, because word-of-mouth wasn’t going to work for this, and Joe was evidently a little nervous about our timeline. I was less-so, being that we had about a month-and-a-half before the event. I figured we could get the posters up two-or-three weeks ahead of time with no problems. Joe had different ideas…

After seeing Joe’s conception, I decided to buckle down and get to it. I started my brainstorming by heading to Dreamstime stock images. (Look for more about Dreamstime in a forth-coming post…) I searched for “Drag Queen,” but found slim-pickins.

Drag Idol rough, 2My first download was this. I figured that I had plenty to work-with here. While I was definitely right, the biggest problem I was having was that there was too much detail. Biggest problems being the translucent dress and the multitude of “see-through” hair.

Now, when you’re working with images and trying to edit them in some way (we’ll get to more of that in a minute…) what you want to avoid is any image that makes it more than difficult to edit. For example, let’s just say that I wanted to change the background of this image. While our model contrasts well with the background, the multiple instances of “see through” areas like the dress and hair means that we’d have to spend a lot of time trying to edit these areas to make them look natural. Bad idea — we want less time, not more.

After a few minutes, I gave up on her and decided to do two things: first, decide what the hell it was I was trying to do, and second, find a new image.

The best place to go for ideas (for me, at least) is Tutorialized.com. This site allows people to submit tutorials for any number of different software packages or coding languages. People can then vote on, and comment on, the tutorials. Most people don’t use the web-2.0 aspects of it, but it’s definitely a nice, huge repository of tutorials. Because I’m using Photoshop, I headed over to that category.

The most popular tutorial, by a very, very long-shot, was “Pop Art“, explained as such:

Turn your photos into Lichtenstein inspired pop art. This photoshop tutorial will also show you how to create great-looking halftone shading!

Pop Art tutorial teaser imagesThe great looking teaser images had me hooked, so I read the tutorial and figured this might be a neat way to go.

I started the tutorial with the original model, but quickly realized that the shading was simply too dark. One of the steps of the tutorial requires you to change the “threshold” of the picture, which basically means that you make the image black-and-white, and then decide where the shadows start or stop. Unfortunately, because I was working with an African-American model, and the lighting was very dark on one side of her face, my problem was compounded.

Drag Idol rough, 3Upon review of the Dreamstime archive, I decided to go with an image of the other model. While none of the pictures in the archive had full lighting, like the Scarlett Johansson picture from the tutorial, this one was at least a little closer to what I was needing. Less of the face was shadowy, and there were fewer areas of translucence to work with. What see-through areas I did have, I could pare down to nothing since I was going to be distorting the image a great deal.

While my intention with this blog is certainly to teach and inform how I did things, I’m not going to walk through any tutorials that you can find elsewhere — that’s a bit too redundant and I’m already long-winded. So, feel free to walk through the “Pop Art” tutorial to see what results you get.

Once I had gotten through the tutorial, I found my biggest hurdle of the project. What now? If you’re like me, you’ll find that the most difficult thing about a project is going from these simple conceptions, over the “big picture” hurdle. It’s pretty simple (if not sometimes tedious) to follow a tutorial, but how do you finish it off and make it look WOW?

One thing I did was look for “photoshop poster tutorial” on Google. While Tutorialized is great, sometimes you just can’t find specifically what you’re looking for, and a good web-search will do the trick. And here, it worked out. I found a whole two-pages worth of poster design tips! Good stuff. I look through to find some design inspiration.

… but before I did, how odd it was to see this story on Google news!

Andy Warhol inspirationWarhol bought for $250 in 1962 may fetch $15 mln

LONDON (Reuters) - A U.S. collector who bought an Andy Warhol portrait of Marilyn Monroe in 1962 for $250 is offering the painting for sale in May and can expect to fetch over $15 million, auctioneers Christie’s said on Monday.
ADVERTISEMENT

“Lemon Marilyn” was one of 13 portraits the celebrity-obsessed artist made of Monroe after she committed suicide in August, 1962. “Orange Marilyn,” another painting in the series, was sold for $16.3 million in 2006.

Christie’s did not reveal the identity of the private collector, who bought the painting at Eleanor Ward’s Stable Gallery in New York where Warhol held his first one-man exhibition that included eight paintings in the series.

The work will be on public display at Christie’s in London from Monday until Wednesday, and will go on sale at auction on May 16 in New York.

Contemplating this Warhol sign-from-above, I thought about ways to make this disembodied head look right on the page. I noticed a few of the posters had simply done a top/bottom “framing” type of action, wherein a central picture is flanked on the top and bottom by blocks of color. Good enough for me… but what color?

Time to use a tool I’ve been looking to try for a while! There are a multitude of “color pickers” on the web today, and I just used the first one that came up in my Yahoo! Bookmarks when I searched for “color.” (I always bookmark these things when I run across them. You’d do well to do the same.)

With EasyRGB, you simply put in the RGB of the color you want to match, and it spits out 11 other colors in harmony with your original color. I chose the hair because with the way I had my poster laid-out, a little of the hair was going to overlap into my upper “block” of color framing. Thus, the color would need to span both the background behind the face, as well as the color framing blocks, meaning it would need to be more in harmony than the face would — even though the face itself is the largest contiguous block of color.

Comparison of before/after colors.My color swatches were actually a bit bizarre, but I had plenty of blues, some pinks and purples to work with, and an olive-green. I then tweaked the eye-color of my face, and the lip color of my face to match the new hues I had. Here’s the comparison. (Original on the left, new on the right.)

Alright, so at this point I knew I was going for a pop-artish look, and that I was going to be going pretty gaudy. But it was pretty-much downhill from here, considering that I had my “main” image, I had my conception for how I was going to frame it, and I had a color scheme. Really, the only big thing left was my font.

Free fonts are everywhere on the web, and the only fonts I’ve seen that you need to pay for are ones that have interconnecting letters. I avoid them. For the Pride Idol poster (again, a future post…), I had needed a new font, and had found Urban Fonts, a great site with a ton of fonts. The best feature is that it allows you to input “test” text, to see what your text will look like in the new font. This was great for me, because I needed to find a font that had both numbers and symbols (for the ‘07 portion of the header — “Drag Idol ‘07″). Some fonts don’t include anything but letters, so it’s good to see ahead of time.

I knew I was looking for a retro font, so I used their Retro category, and found Dusty Rose.

It’s probably time to show you the finished product, so you can see how I got there from what you’ve seen above:

Drag Idol poster

(For a full, BIG sized version that you can scrutinize, download here.)

Let me just run down some of the important design elements, now:

Colors
I first picked the same color for the lips and the text because I thought it would tie the text and the face together nicely, plus the pink is very vivid. Then I chose the light pink/purple for the background purely on a test-it moment. I threw a couple other colors from my swatches I had gotten from EasyRGB and none of them looked good with my text color until I got this one. Sometimes you just have to use trial-and-error.

Stroke
You can see around the text that there’s a very thin lining. This is something I learned from another tutorial that talked about ways to make your text really stand out. Layer style stroking is one way to do this. Choose the text layer you want to put a stroke around, and then go into your Layer palette, and click on the stylized “F” button that’s at the bottom of this palette. There’s an option for “Stroke…” where you can set how you want the stroke to show.

I chose a white stroke for the top text and a black stroke for the bottom text, because having it all one color seemed a bit tedious. I have no idea whether this is good design or not — I just know what looked good to my eye.

Custom shapes
I got the “starburst” that goes behind my Pop-art face and also the speech bubble from custom shapes. On Windows, push “U” to get your custom shape tools up. Then click the “Custom shape tool” (it’s the one that looks like a wobbly star). Now you’ll see a “Shape:” box that has a black-and-white shape in it. You need to click on the “Down” button, then on the “Right” button (small, circular arrow that points to the right) and select either “All” or “Load Shapes.” It’ll look dozens more shapes into this box. Then look through and find the shape you need.

Once you create the shape, you need to turn it into a selection. Click on your “Paths” palette and click on the dotted circle. It’ll turn your shape into a selection path. From there, you can fill in the shape with whatever color you want. I also did a layer stroke (like above) on my thought bubble to make it stand out more.

Overlapping elements
You’ll notice that I had the head slightly overlap my text, as I mentioned above. I learned this from some other images I had seen on the net that this really makes elements POP out of the page. With our drag queen’s hair, I thought it would look very “dynamic” if it overlapped the text just slightly, so that the text was still very readable from a distance. After giving it a try, it seemed to work — so I went with it.

There you have it! Once I had done all that, I sat back and just marveled at my handiwork, completely surprised that my non-artsy brain could come up with anything so creative. I must say that, if anything, the color swatches were one of the biggest home-runs here. Having those harmonizing colors really links it all up in your head.

If you have any questions, feel free to post them in the comments section, and I’ll try and respond ASAP!


About this entry