Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos.  Home Photoshop Web Layout Professional Design Studio Web Template

Professional Design Studio Web Template

Browse Pages: << < 1  2  3  > >>

The layer's parameters:

Blending Options>Outer Glow

image 1

Blending Options>Gradient Overlay

image 2

Gradient's parameters:

image 3

Blending Options>Stroke

image 4

Make two copies of the recently made layer and select the Free Transform option to stretch the copy out if necessary, placing it the way it is shown on the next picture.

image 5

The next stage includes creating the lateral menu's panel reserved for the auxiliary buttons. We'll use two instruments: firstly - Rounded Rectangle Tool (U) and then click on the Alt button to cut out circles form the right side, applying the Ellipse Tool (U).

image 6

The layer's parameters:

Blending Options>Outer Glow

image 7

Blending Options>Inner Glow

image 8

Blending Options>Gradient Overlay

image 9

Gradient's parameters:

image 10

Blending Options>Pattern Overlay (the texture Blue Textured from Color Paper)

image 11

Blending Options>Stroke

image 12

Make a copy of the new made layer, changing the layer's parameters.

Fill 0% on the layers.

Blending Options>Stroke

image 13

Gradient's parameters:

image 14

image 15

Next we'll select again the Ellipse Tool (U) to represent the primary layer reserved for navigating buttons situated on the right side.

image 16

image 17

The layer's parameters:

Blending Options>Outer Glow

image 18

Blending Options>Inner Glow

image 19

Blending Options>Gradient Overlay

image 20

Gradient's parameters:

image 21

Blending Options>Stroke

image 22

The next step includes creating a new layer reserved for a button, choosing the same Rounded Rectangle Tool (U)

image 23

image 24

The layer's parameters:

Opacity 70%

Blending Options>Inner Glow

image 25

Blending Options>Gradient Overlay

image 26

Gradient's parameters:

image 27

Blending Options>Stroke

image 28



Author's URL: Adobetutorialz.com
Browse Pages: << < 1  2  3  > >>
Final results of our readers
New!
Passed through all the steps? Share your result!
Your result will be premoderated.
Please make sure you choose the right image.
 
 



Captcha

*Required fileds
Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos. More Web Layout Tutorials: Featured Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

No comments yet...
Add comments to "Professional Design Studio Web Template"

Captcha