Vectorials
Flash Perfection
3D Lessons
Tutorialkit
Markup Tutorials
Learn PHP
network
adv banner
Photoshop  Home Photoshop Drawing Techniques Button with Lights
rss

Button with Lights

Author: amitk More by this author


Open a new document in photoshop

Size should be 300 x 300 pixels

Background color: #151515

Select Rounded rectangle Tool ( set the radius to 3 pixels ), and make a small shape

image 1

Then Rasterize this layer ( to rasterize the layer go to Layer > Rasterize > Shape

The next step is to create another rounded rectangle

This time set the radius to 10 pixels. We don't need this layer, and i will delete after a few steps

image 2

Now hold down the Ctrl key and with the left mouse button press on the Red thumbnail from the layer palette. You can notice that a selection will be visible around the red button. this is what we need - the selection

image 3

image 4

Now delete the red shape.

You can notice that the selection is still in that place

image 5

Now press Delete Key from your keyboard > this is the result

image 6

Press Ctrl+D to deselect. the selection will disappear.

image 7

Then add the following layer styles

image 8

image 9

image 10

This is the result

image 11

Now we will add details

Zoom the document to 300 %

image 12

Select Line Tool. Set the weight to 1 pixel and make 4 small lines like in the following image

image 13

Now change the layer opacity for the lines like in the following image

image 14

Now select the blue shape and load the selection ( To load the selection go to Select > Load selection

image 15

Select Elliptical Marquee Tool and use the following settings

image 16

Then make the following selection

image 17

When you release the mouse button you will have the following selection

image 18

Create a new layer ( press Ctrl+Alt+Shift+N ) , be sure you have this layer above the blue shape layer

Grab Paint Bucket Tool and fill the selection with white

image 19

Press Ctrl+D to deselect , then press on the "add Layer mask" button from the bottom of the layer palette

Select Gradient Tool , and draw a line from the left to the right ( follow my green arrow )

image 20

Now change the opacity layer to 30 %

This is the result

image 21

Now create a small rectangle with Rectangle Tool

image 22

Then add the following layer styles

image 23

image 24

image 25

image 26

image 27

This is the result

image 28

Now drag the layer under above the background layer

image 29

Now press one more time on " Add layer mask button "

Select Gradient Tool, and use the following settings

image 30

Then make a line from the middle of the rectangle to the exterior ( follow the red arrow )

image 31

Now add some text and you are ready

This is my final result

Button with Lights Tutorial: Final Result

I hope you will find this tutorial useful



Author's URL: www.talk-mania.com

Rate this Material: Bad 1 2 3 4 5 Excellent
print this page tell a friend subscribe to newsletter subscribe to rss

Add comments to "Button with Lights"