How To Make Simple Icons For Nokia S40, for photoshop beginners Options

[your_mother]

This is an easy tutorial for photoshop beginners who want to make their own icons. Hope it's understandable (finally my photoshop is in english!!), if you have any questions don't hesitate to ask...

1. Create a new file with the size 48 x 48 px.

2. Add a new layer on top of your background layer. You can simply click on the little icon on the bottom of your layers-palette.
(IMG:http://i1121.photobucket.com/albums/l507/your_mothers/Tutorials/1.jpg)

3. Select the ellipse tool. You might have to make a right-click to find it...
(IMG:http://i1121.photobucket.com/albums/l507/your_mothers/Tutorials/2.jpg)
Make sure the option shown below is active. You can find those options on the top of your photoshop window.
(IMG:http://i1121.photobucket.com/albums/l507/your_mothers/Tutorials/3.jpg)

4. Draw an ellipse. If you want it perfectly round you can hold shift while drawing.

5. Right click on the layer with your ellipse and choose 'Blending Options'.
(IMG:http://i1121.photobucket.com/albums/l507/your_mothers/Tutorials/6.jpg)

6. Play around with the layer-options. As you can see I added a small shadow (size and distance 2px), beavel and emboss (I used an angle of 90 to 70 with a pretty big size and low depth), color overlay (light blue) and a stroke (1px).
(IMG:http://i1121.photobucket.com/albums/l507/your_mothers/Tutorials/7.jpg)
You can already see what it looks like now on your screen. Once you're satisfied click ok.

7. Choose the custom shape tool. Again, you have to right click on the tools palette to find it.
(IMG:http://i1121.photobucket.com/albums/l507/your_mothers/Tutorials/8.jpg)

8. Choose your desired shape in the options on the top of your photoshop window. If you click on the little arrow on the right you are able to choose from more shapes.
(IMG:http://i1121.photobucket.com/albums/l507/your_mothers/Tutorials/9.jpg)

9. Create a new layer. As described in point 2.

10. Draw your shape to fit nicely into your ellipse.

11. Hide the background of your icon. That's very important, otherwise you end up with a white square. Simply click on the little eye on the side of your background layer to do that.
(IMG:http://i1121.photobucket.com/albums/l507/your_mothers/Tutorials/10.jpg)

12. Save your file as .png. Choose 'File' - 'Save for web and devices'. Choose 'PNG 24' in the dropdown menu on the right top and save.
(IMG:http://i1121.photobucket.com/albums/l507/your_mothers/Tutorials/11.jpg)


And that's it. Here's the finished icon:
(IMG:http://i1121.photobucket.com/albums/l507/your_mothers/Tutorials/Untitled-1.png)
Now of course you don't have to repeat all of this for every icon. You can simply add a new layer and draw a new custom shape on it for your next icon. Of course you have to always hide the previous shape before...

This post has been edited by your_mother: Jul 10 2011, 06:29 AM

[Aleena143]

Mom nice tutorials,definetly it will be a great tutorials whom r beginners...

mom i need a help frm u....pls teach me r give me one examples for ,how to create ornamental softkeys.i just love to do it...

like lia, u, and others doing.....here

(IMG:http://img651.imageshack.us/img651/341/softkeys.jpg)

waiting for one more tutorial based on ths softkeys.

[your_mother]

mom i need a help frm u....pls teach me r give me one examples for ,how to create ornamental softkeys.i just love to do it...

I would love to help you, but for once I can't. I simply don't know myself how those people do it... If you take a look at my themes you can see that most of them have very simple borders. I'm hoping somebody else makes a tutorial about it, I'd like to learn that myself...

[Na3em0]

owsum tutorial thnx

[LordOfLightning]

Awesome tutorial mom
and thanks

[Aleena143]

mom i need a help frm u....pls teach me r give me one examples for ,how to create ornamental softkeys.i just love to do it...

I would love to help you, but for once I can't. I simply don't know myself how those people do it... If you take a look at my themes you can see that most of them have very simple borders. I'm hoping somebody else makes a tutorial about it, I'd like to learn that myself...

Oh, thanks mom, but i hope anyone write tutorial on ths .

[Mr_Crash]

(IMG:style_emoticons/default/wow.gif) Once again great Tutorial mom.. (IMG:style_emoticons/default/notworthy.gif)

And about ornament softkey you can download ornament brushes from Deviantart...! (IMG:style_emoticons/default/thumbsup.gif)

[san-sagar]

nice tutorial once again momy...****

[pokefansara]

could i pls knw how do i upload a preview of d icon pds file i've made for the dc contest pls....!!i'm a li' new here...!!