Personal Layout « Web « Photoshop Tutorials

Home
Photoshop Tutorials
1.3D
2.Animal Creature
3.Animation
4.Background Cover
5.Color
6.Design
7.Effect
8.Hardware
9.Holiday Event
10.Human
11.Image Format
12.Logo
13.Nature
14.Object
15.photography
16.Shapes
17.Text
18.Textures
19.Tools
20.UI Controls
21.Web
Maya Tutorials
3ds-Max Tutorials
Illustrator Tutorials
GIMP Tutorials
Photoshop Tutorials » Web » Personal Layout 

Once you have the graphic elements available I will open a new image with a very nice girl, and I will place this image on layout

Add your website title and slogan inside the box. Now select the rounded rectangle tool and create a your navigation under your header, make sure the two shapes align nicely on the sides. Add these layer styles to your rectangle.

In a similar way to the sidebox, add a dark box inside of the template and lower the opacity to about 15%.

Select the Line Tool (U) to draw a dividing line on the menu's panel situated as we said on the site's header:

Select again the Rounded Rectangle Tool (U) to create a new layer, reserved for the site's name, on the left upper site's part, erasing one top with the Delete Anchior Point Tool.

Thanks Tutorials007.com - I left a link for you in the footer as a thanks. Will keep checking here for new tutorials :] Keep ownin'!

Now we should represent the primary layer of the site's header, applying the Rounded Rectangle Tool (U) and then press the Alt button to cut out the lowest part, selecting the Rectangle Tool (U) also.

Create a new document 850�790 pixels, fill your background layer with the color #080808. Create a rounded rectangle by using the rounded rectangle tool, make it slighly smaller than 850 pixels so its fits nicely on the canvas. Place the rectangle at the very top.

Create new document 900 x 870 pixels, set forground color to #4d92b9 and background color to #8bbfd9. Select the gradient tool with a linear gradient. Start from the top of the document and drag downwards to apply the gradient. Were looking to archieve something like the image below.

w___w_w__.j_a_v__a__2s._c__o___m | Contact Us
Copyright 2009 - 12 Demo Source and Support. All rights reserved.
All other trademarks are property of their respective owners.