Monday, November 10, 2008

Glossy Error Icon Tutorial

In this tutorial I will show you how to make my very glossy error message icon using Adobe Photoshop.

See what we will be making just below.



photoshop tutorial error icon



First we need to make the outer border of the ellipse shape, so with the ellipse tool drag out a circle (the color doesn''t matter we will change it later).

In the layers panel double click the new shape layer to get to the layers styles panel and give it settings as shown below.



photoshop tutorial error icon

photoshop tutorial error icon

photoshop tutorial error icon

photoshop tutorial error icon

photoshop tutorial error icon

And here is the metallic gradient I made..

photoshop tutorial error icon



Now your ellipse should look something like this.



photoshop tutorial error icon



Now that was the first part, easy right? the next stage is to make the inner ellipse, (the red shape), so with the ellipse tool drag out a new shape, a bit smaller, so it looks like the one below.



photoshop tutorial error icon



Again go to the layers styles panel and give this shape the following style settings.



photoshop tutorial error icon

photoshop tutorial error icon

photoshop tutorial error icon



And now the result should look like this.



photoshop tutorial error icon



Yes I know this is a lot of settings for such a little effect, but I promise its worth it..

Now lets make the X in the middle, you can use the custom shape tool to make one, or the text tool and use a custom font the make a cool variation, bit I didn''t, I quite liked the standard X with crisp corners.



photoshop tutorial error icon



Now yet again go to the layers styles panel and give it the following settings.



photoshop tutorial error icon

photoshop tutorial error icon

photoshop tutorial error icon

photoshop tutorial error icon



Now we are almost done, we only need the final touch, but its one of the most important things, the glossy effect.

We will be making this 3 times, using the same technique on 3 different places, so I will only show it once.

Hold down ctrl and click the outer ellipse shape layer to load the shapes selection.

Choose the elliptical selection tool, set the selection mode to subtract from selection, and drag over the selection as shown below.



photoshop tutorial error icon



Finally we will make a gradient going from white to transparent and drag it in the selection to make the glossy effect.



photoshop tutorial error icon

photoshop tutorial error icon



Now as I wrote before, you will need to repeat this last step two more times to accomplish the full effect as I did.

That''s it for now, I hope you enjoyed it.

Copyright by www.blog.0tutor.com

No comments:

Post a Comment