Her

Home Photoshop Tutorials Web Layout Creating a 3D Button Bar with Distorted Edges

Creating a 3D Button Bar with Distorted Edges

Author: PhotoshopForFun.com Author's URL: http://photoshopforfun.com More by this author
Added:Oct 01, 2007 Rating:   Level: Experienced Software: Photoshop  

Create a rectangle using rectangular shape tool.

image 1

Double click the layer to open layer style window. Apply layer style with the settings shown.

image 2

image 3

Create a rectangle using rectangular shape tool.

image 4

Double click the layer to open layer style window. Apply settings as shown.

image 5

image 6

Create a rectangular selection using rectangular marquee tool. Create a new layer. Apply white to transparent gradient.

image 7

Double click the layer to open layer style window. Apply settings as shown.

image 8

image 9

Duplicate the layer several times to create more buttons.

image 10

Select and merge all the layers. Duplicate the layer. From "Filter" menu select "Texture>>Mosaic Tiles". Apply settings as shown.

image 11

Change the layer mode to "Linear Dodge".

image 12

Select and merge all the layers. Ctrl+Click the layer thumbnail to get the selection. Press Q to enable quick mask.

image 13

From "Filter" menu select "Distort>>Ocean Ripple ". Apply settings as shown.

image 14

Press Q again to disable quick mask. Press Ctrl+Shift+I to inverse the selection. Press Delete.

image 15

Ctrl+Click the layer thumbnail to get the selection. From select menu select modify>>contract. Contract the selection by 4 pixel.

image 16

Press Ctrl+J to copy paste the selection in a new layer. Double click the layer to open layer style window. Apply settings as shown.

image 17

image 18

Select and merge both the layers. Duplicate the layer and change the layer mode to "Overlay".

image 19

Type link names over the white rectangles.

Creating a 3D Button Bar with Distorted Edges
Click to enlarge