In this tutorial I will teach you how to make the stylish Windows Vista help icon.
Step 1
Open up Photoshop and create a new document 512px by 512px with a white background, 72dpi.
Step 2
Create a new layer
. Set your foreground colour to Black (Keyboard Shortcut: D). Get the Elipse Tool 
. Hold down the Shift key on the keyboard and drag out a big black circle about this big:
Step 3
We need to center this circle so press Ctrl + A on the keyboard to select everything on the circle layer. Now go to Edit menu and choose Cut (Or Ctrl + X on the keyboard). Your circle will disapear but don't worry! Go to the edit menu again and choose Paste (or Ctrl + V on the keyboard) this will paste your circle in the center of your image.
Step 4
Create a new layer
. Draw a circle slightly smaller than the last one using the Elipse Tool . Remember to hold down Shift to make it a perfect circle. Then Cut it and Paste it again like we did in Step 3 to center it. To give you an idea of how big it should be here is the centered, smaller circle with the selection round it so you can see its size:
Step 5
In your layers palette Ctrl + Click on the thumbnail of the layer with the smaller circle. Now with your selection still active click the thumbnail of the layer with the bigger circle. Press Ctrl + D to deselect the circle.
Step 6
Select the layer with the big circle (which now has a hole in it, done in step 5). Right click the layer and choose Blending Options. Check the box next to "Drop Shadow" and give Drop Shadow these settings:
Step 7
Now check the box next to "Bevel & Emboss" and give it these settings:
Step 8
Now check the box next to "Color Overlay" and give it these settings (The grey color is #747474) :
Once you've done this click 'OK'.
Step 9
You should now be back at the main image which should look something similar to this:
Step 10
We now need to style the inner circle. Right click the layer for the smaller circle and choose Blending Options. Put a tick next to "Inner Glow" and use these settings (The dark blue used is #080656):
Step 11
Now you need to add a "Bevel & Emboss" using the settings below:
Step 12
Now add a "Gradient Overlay" with the below settings. The light blue colour is #4566ff and the dark blue colour is #141182. Click OK once your done.
Step 13
You should now have an image looking like this (I have resized the image so its smaller than the origanal):
Step 14
This all looks very nice but you can't have a Help button without a "?" question mark! Type the question mark in white with Lucida Grande font in bold, failing that use Tahom or Verdana. Resize it so its about this big in your circle. Remember to center it:
Step 15
OK. Go to the question mark layer blending options. Add an Drop Shadow with these settings:
Step 16
We're also going to add an Inner Shadow with these settings:
Thats it! Your finished. You should now have something like this:
And it still looks great when minimized:
Thanks for reading and I hope you enjoyed the tutorial!
- Adrian
