Full icon tutorial

TUTORIAL - PHOTOSHOP
Mark Greene (ER) icon, "The devil shoots at random"

to


1. Start with the base, created by resizing, cropping, whatever to get it down to the standard 100x100. You all know how to do that, so I won't go into it.


2. Whoa, it's all, hello Mark where are you? We need some light. Go to IMAGE>ADJUSTMENTS>AUTO LEVELS. Whoomph there ya go, we can see him bleeding and in pain. Poor Mark. By the way, that Auto Levels thing doesn't always do the best job on all pictures. But on this one it was brill.


3. Now I really can't quite make out the outline of all the blood and the clear expression of agony on his face, can you? Hmm, no. And it's just not angsty enough when it's all blurry. So hit FILTER>SHARPEN>SHARPEN. Hooray for definition! Doesn't the marble wall behind him look good now?


4. Auto Levels in Step 2 did a lovely job, but I'm thinking it's still a bit too dark. If I didn't know who that was bleeding all over the place, then I certainly wouldn't be able to tell from this image so far. So duplicate the layer and set the blending mode to SCREEN. Do this twice, because once is never enough. Mu ha ha ha. There we go, now we can see a bit better.


5. Trouble is, now it all just looks a bit... flat. And maybe a little too bright. Oooh, I don't know. Time for a soft light layer. And, as mentioned in many, many other tutorials, I'm going to grayscale it too so that it doesn't look too saturated with colour. Duplicate the SCREEN layer, and change the blending mode to SOFT LIGHT. Then go to IMAGE>ADJUSTMENTS>DESATURATE. Mark's popping out form the wall quite nicely now, and the shaft of light on the left is really quite effective and dramatic and noir-ish.


6. Now, while I quite like how it looks already, I'm sorta thinking... booooooooring. Where the colour? First things first with colours - exclusion layer. Create a brand spankin' new layer, after the two screen layers but underneath the soft light/desaturated layer. Then pick a shade of deepest, darkest blue. I ended up with #012659 for this one, but I'm lazy and never save custom colours so it changes all the time. Once you have your colour, go to EDIT>FILL, make sure all those settings are right for the colour you want (it's in the foreground, right?), leave blending at normal and opacity at 100% and click okay. Cool blue. Then change the blending mode for the layer to EXCLUSION. Why Mark, you're all peachy.


7. Mmm, peach. I could actually really eat a peach right now. But that's besides the point. It looks oka and everything, but soemthing's still not quite right. It seems a bit too warm for someone who's just been brutally beaten up. We need coldness. Gradient time it is. Create another new layer, above the exclusion one but still below the soft light/desaturated layer. Use the gradient tool and pick out this gradient:

On the gradient pallette it actually looks much darker to much lighter than that. Anyway, fill your layer with it. Mark suddenly looks like he's choking on exhaust fumes. Set the blending mode to LINEAR LIGHT. Wow, contrasty. And Mark's left arm has actually become part of the light. Take the opacity down to 70%. There's a bit of the peach again (mmm peach), but the coldness and contrast is still there. Yay! I *like* these colours.


8. Next stop: decoration. I'm happy with the actual image, the base we've created. Now I want fun stuff. Like brushes. Icons without even a hint of a border annoy me, so that's what I'm going to deal with first. A while ago I made a reeeeally simple brush that was just a block 100 px wide and oh, say 10 px deep. I selected white as the colour for it because a dark colour would just be too... heavy for this icon. Then I created a new layer, this time on top of the Soft Light layer, and used the brush twice so it framed the top and bottom of the icon. But meh. It looks too blocky and chops off Mark's leg (let's face it, the man has enough problems right now without being minus a leg as well). So change the blending mode to SOFT LIGHT. Ahhhhhhhhhh. That's better.


9. Let's get textual. Oh the angst of this icon. What can I write on it that is remotely appropriate? Since the image is from an episode of ER called 'Random Acts', I figured that 'Random' was pretty good word. Me likes adjectives. But I wrote that and it seemed stupid by itself. So I made up some bollocks to go around it, ending up with the phrase "The devil shoots at random", where I conveniently forgot that Mark wasn't actually shot. Still. New layer for text, I typed the word 'random' (I still liked it as the emphasis of the phrase) in capitals, in Times New Roman, in Italic, in size 3.75. Because I can't be bothered to fuss around with spacing settings I just hit the space bar after every letter to make it look more spread out.

Then I typed out the rest of the phrase, two words per text layer so I can move them around easily, this time not in capitals so as not to distract from the 'random'.


10. Finally. One last tiny little touch, and really only because, a) it's angsty, b) there's blood everywhere already, and c) I'm really into it right now... I used a brush of blood spatter. I put it on a new layer just below all the text, obviously in a blood-like colour, and only let it touch the very edge of the icon, mostly just under the text. I set it to MULTIPLY so it came out a bit deeper in colour because my original red was a bit too light.


11. Ta daah! Icon! LAYER>FLATTEN IMAGE and FILE>SAVE.


x-posted @ longandwinding