01 November 2011

Create Shiny Button

As a web developer or a web designer
you certainly need for your links a lot of buttons.
Today we are about creating a shiny button using Photoshop CS 3.

So let's get started...
#1 - Open new File on Photoshop by pressing CTRL+N , or Go to File>New> .
In this tutorial we need the layer a little bet large so we going to put :



Width : 600px
Height : 360px

#2 - Create a rectangle or a rounded one using the rounded rectangle tool and put the background to #777777

#3 - Right click on your layer then click blending Options


#4 - And now we need to add some Options.
-Drop Shadow
-Inner Shadow
-Gradient Overly
-Storke


#5-Drop Shadow

#6- Inner Shadow

#7- Gradient Overly

#8- Storke

#9- The next step is add the text layer.
To that, use the type tool and don't forget to put the background to white.
In this tutorial i typed the word ( Download ).


#10 - Now let's add the shadow into this layer.
To do that Click on blending Options then Drop Shadow, and put the options just like it shows in this picture.



The result for now , should be like this


#11 - Now let's add a new white layer so the button looks a little bet shiny.
To do that Create a new layer then use the rectangle tool to draw rectangle all above our layer


#12 -finally click on blending options for the layer we just create then make:
Opacity to 54%
Fill Opacity to 27%


#13 - The final touch
At the same lyer Drop shadow and make the options just like it shows in this picture.



FINAL RESULT


1 comments:

This is what I have been searching in many websites and I finally found it here. Amazing article. I am so impressed. Could never think of such a thing is possible with it...I think you have a great knowledge especially while dealings with such subjects.

Post a Comment







Get the latest posts to your email box.