Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos.  Home Photoshop Web Layout Portfolio Web Layout (Part 1)

Portfolio Web Layout (Part 1)

Browse Pages: 2  3  > >>

Select File>New option with 800x720 px and 72 dpi. Select the Rectangle Tool (U) to represent the background of the site to be next:

image 1

Make the necessary adjustments on the layer's parameters in the layers' panel:

Blending Options>Gradient Overlay

image 2

Gradient's parameters:

image 3

Using the Rounded Rectangle Tool (U), try to represent the primary layer reserved for the site's panel:

image 4

The layer's parameters:

Blending Options>Gradient Overlay

image 5

Gradient's parameters:

image 6

Blending Options>Stroke

image 7

Choosing the same Rounded Rectangle Tool (U), we have to represent a button on the menu's panel on the site's header which needs to be turned over with Free Transform option. The button's color must be C92130.

image 8

The layer's parameters:

Blending Options>Stroke

image 9

Make four copies of the new made button's layer and change each button's color:

image 10

Select the Ellipse Tool (U) to draw the necessary element for the menu's buttons:

image 11

Apply the next parameters on the layers' panel:

Fill 0%

Blending Options>Gradient Overlay

image 12

Gradient's parameters:

image 13

Blending Options>Stroke

image 14

Using the same instrument, try to make a small circle on the lowest part of the site's panel:

image 15

The layer's parameters:

Blending Options>Drop Shadow

image 16

Blending Options>Inner Glow

image 17

Blending Options>Stroke

image 18

Selecting the previous instrument, it's possible to draw several more circles on the lowest part of the site's panel:

image 19

The layer's parameters:

Blending Options>Gradient Overlay

image 20

Gradient's parameters:

Portfolio Web Layout (Part 1)



Author's URL: Adobetutorialz.com
Browse Pages: 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 "Portfolio Web Layout (Part 1)"

Captcha