Create a Mac Style Interface Button in Photoshop
Feb 21, 2009 Buttons, Photoshop
This tutorial has been viewed: 403 times
In the following tutorial we are going to be creating a stylized button like so
First off you are going to want to create a new document. I used the following settings.
Use the Fill tool 
to fill the background with white #FFFFFF, Create a New Layer 
over the white background and grab the marquee tool 
, create a selection directally in the middle of the document filling up about 75% and fill it with black #000000 useing the paintbucket tool again (see below):
tip:
Try out the other blurs and see what they do!
Now with the blacklayer selected go to Filter > Blur > Gaussian Blur use these settings:
After that set the layer with the black on it’s opacity to 20-30%
Now we are going to create a highlight of the whole area, create a new layer now grab your marquee tool and select down to almost halfway, then pull out the gradient tool
set your foreground color to white #ffffff, set the gradients style to foreground to transparent (see pic), and drage the gradient tool over almost the whole document.
To come out with:
Now we need to create the button part, first grab the
tip:
press and hold down on the rectangular marquee to select more marquee types, like circular
Circular Marquee tool 
, create a new circle selection that almost fills the whole document (see pic) and fill it, using the paint bucket tool with white #ffffff
tip:
hold down shift while creating the circular marquee to create a perfect circle!
with the layer with the white button on it bring up the layer styles for that layer 
select dropshadow and apply the following settings:
Now we need to make the button have a shadow in it, first create a new layer and press ctrl+g to have that layer mask the layer under it, then select the Circular Marquee tool and create a circular selection in the center of the button circle. Now set your foreground color to Black #000000, and select the gradient tool set the gradient style to black to transparent and drag from the top left of the Circular marquee to almost all the way through it (see pic)
You should end up with something like this:
Set that layers opacity to about 15-20% to dim down the shadow a bit.
Well that’s it for this tutorial, I fooled around a bit more and came out with this.
some type of Music player skin.
Related posts
Tags: photoshop
