Icon Tutorial #1: "Hello Stranger"
Well, I've been obsessed with two things lately. 1> Closer, this movie is absolutely amazing, awe-inspiring. So watch it. 2> Making Icons, Yeah, i started this journal last week, because i just LOOVED TO MAKE TEH ICONS. So, i decided to create a walkthrough of an icon i made, since i had nothign better to do.
This is a cap of the beautiful julia roberts, from the movie closer. This is a part, where, she and larry walk along the Thames (i think), and larry buys anna some balloons for her birthday, thus, she smiles. I thought it was a nice picture, so i thought i would use it. You can look in Cap it!'s memories.
I opened the image in photoshop. At this point examine athe picture, and figure out what view, shpes and lines you want in the icon. Sometimes asymetrical icons look beautiful. But i decided to go with a strait face shot. I used the marquee tool and held shift while i dragged, so that the selection would be a perfect square.
Fallow these directions once your selection is... selected. On the tool bar: Edit>Copy Merged, File>New... (Phototshop will automatically set the dimensions), Edit>Paste. Your image is now sqaured. If your wondering why its a little big, is because, i work with images big, then when im done editing, i resize, but your image must be a complete square.
Make a new layer. Go to your Tools Bar, and click and hold on the paint bucket, a drop out menu should appear, click on the gradient setting. Save the above image, and open up the drop down menu for gradient types, I chose the color from the boat in the background of the image, but you may choose other colors. Make sure the gradient is Solid to Transparent. Now drag the gradient from the upper right corner.
In your layers window, go to the blending change drop down menu, and choose Color Dodge. This is what you should end up with:
I did the same thing from the lower left corner but with a darker color on a new layer:
use a color picker to select that, and then apply the exact same gradient, from the lower left corner, and turn on Color dodge, next, change it's opacity to 52%:
Here we will sharpen the image, it looks like a bad optimized image at first, but when we resize the icon, it will look better. Figure 1-a (hold mouse over image to see what figure) is the steps you should take to apply Sharpen More, and figure 2-a is what it should look like after, remmeber to only sharpen the layer with the actual; image of Julia on it..
New Layer. Here i layed down some base grunge brushes, in the same color as the second gradient, on the background. If any got ont the face I would erase with the same brush, so as not to ruin the effect. Grunge brushes are v ery good for base effects, because theyre so random. Next I turned on Color Dodge, leave the opacity alone.
New layer. I took the the coilor from a strand of hair in the icon, (you can use mine if you wish), and applys a grune diagonal line brush in Color Dodge mode.if you like it really bright, you can leave it, but for me, i had to change the opacity:
Opacity at 26%
New layer. Finally i layed down a nice rose diagonal (on the oposite diagonal of course) down in Overlay mode at 15% opacity.
New Layer. Take the color from the first picture, and either, type yourself, or use large text brushes. Next apply Color Dodge blending mode, and lower the opacity to 15%:
Next, on the top bar go to: Image>Image Size and make sure the properties are the same as the second image above. This is what you should come up with:
Now, you can leave it, but i like to add text and stuff. So i typed "hello stranger", a very prominent line in the movie, in a rose color on a new layer. Next click the selection tool, on your tools bar. Make a new layer underneath your text layer, and hold Ctrl and Alt then click on the text layer. Make sure you are on the layer beneath it , and with the selection tool still selected, on the arrow keeps, press down once, and over which ever way once, then fill with black. Next reselect the text layer, and making sure you are still on the shadow layer, press delete on your key board. Finally i lowered the opacity of the shadow layer down to 48%:
Finally, in a new layer, i added a 2 px bvorder around the edge in the same rose as the type, and applyed Color Dodge mode, then capped it with a 1 px white border all around the edge on a new layer, this is what you should have: