Home About Contact Us search

Rating Star

In this tutorial, i'll show you how to make stars for use in rating purposes.

Start a new document with white background. set your foreground color to: #FFC600

Choose the SHAPES tool, and from the pulldown box, select the star shape shown below. This shape comes with the default set in Photoshop 7.



Click and Drag on the canvas to draw this shape. Remember to hold down the SHIFT button while drawing.

Make it big like the one shown.

Now go to Layer » Rasterize » Shape to rasterize this shape.

Use the Magic Wand tool, click on the WHITE area within the star to select it. Hold SHIFT while clicking on the other areas to allow multiple selections.

Create a new layer, then fill the selection with #FFF200.

CTRL+D to deselect. then merge the 2 layers together (excluding the background). To do this, link the 2 layers together, then press CTRL+E.

Then hit CTRL+T to resize the star. while holding down SHIFT, click on the handles and resize the star to about 35px.

Then hit enter to apply.

Now go to Layer » Layer Style » Stroke, then apply a 1px stroke of color: #895E26

Then add drop shadows to the star.

This completes our Full star for the rating.

Now, to create a no star, CTRL+CLICK on the layer with the star to create a selection. Create a new layer then fill it with white.

CTRL +D to deselect.

Now to create a HALF star, duplicate the new layer you just filled in white, use the rectangular marquee tool and make a selection on half the star. then hit delete.

Now if you hide the bottom white layer, you should see half a star.

Now, if your save each of these, Full star, half star and zero star in separate gif files, you can use it for your rating system.

Download PSD File

Like this tutorial? Share it


Build Your Own Flash Website

User Comments

khanfiroz Jan/13/2010 22:46very good to see a tutorials i thout it is very helpfullfor the stident
Barva Dec/18/2009 09:11So nice, Thanks. But can you explain, if I fill white layer is gone a completely white, there is nothing like that your example(white star) Now, to create a no star, CTRL CLICK on the layer with the star to create a selection. Create a new layer then fill it with white. Thanks again Barva
sexziie:P Nov/14/2009 07:52eii qee pedOo..!!! :D
franky Oct/09/2009 22:51gr8 dude..!
Mwinyi Oct/01/2009 22:17i like dis, ur so inteligent
Joshua Sep/16/2009 14:33Thanks but I cannot find the SHAPES tool... Wonder where it is... Hope you can E-mail me at this address redvoltaire@yahoo.com Or if can anyone can tell me...
el chivo Aug/31/2009 23:32LOL >:)
hello Feb/27/09 19:23its quite confusing eh.
vijay Jan/17/09 16:35got to say great explainig power( i salute you for your efforts)
rai Oct/15/08 07:36very nice
Tim Mousel Oct/7/08 16:56Excellent tutorial!!!! Thank you very much. I needed this badly!
Jon Jul/2/08 12:41Thanks mate, just what i as looking for
PINE Jun/16/08 20:35Hed dammit.you should atleast try to appreciate a smple tutorial.were lucky to have things such as this!
Noel May/26/08 13:44what kind of people you are, you should know atleast how to say thanks even this is just a simple tutorial. Tnx for this post. It helped me a lot
mugi May/1/08 14:07What's the shapes tool, i'm using adobe photoshop CS2
jim Apr/7/08 07:54forget what these idiots are saying, thanks for posting this tutorial!
... Mar/4/08 02:21this is GAY!
Bill Feb/12/08 02:17UR A DUMBASS
o loco Feb/1/08 04:28Gee... what's up with all the negativity... we were all noobs once
blah Dec/21/07 01:58bLAH DIS IS BULLSHIT
vijini Nov/15/07 17:32it's very nice
dammit Nov/4/07 23:16you idiot . cab you just say where is that shape tool . beginners must know. go fck urself
photo Oct/5/07 04:00any idiot who doesn't know where/what the shape tool is shouldn't be working in photoshop
Jay Aug/22/07 03:05WHAT THE FUCK IS THE SHAPES TOOL?!
designer May/25/07 14:21thanks for this , good effort please keepitup
See 26 - 50 of 70 comments

Leave A Comment

Your Comment:
Your Name:
Your Email:
Your Website: (optional)
Build Your Own Flash Website
ecover design tutorial tutorial tutorial
psdeluxe Photoshop Lover Good Banners Add Your Site