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

Personal Site Layout (Part 1)

Browse Pages: << < 1  2 

Now we have to fill the site's sections with the necessary text, keeping again the demands inserted below:

image 1

(Sed diam nonummy)

image 2

(the orange accentuated one)

image 3

(the dark text, also accentuated)

image 4

(04.10.2007:)

image 5

Create a new layer of 21õ21px with 72dpi to represent a kind of primary elements reserved for the cliché's texture, colored in white, choosing the known Rectangle Tool (U) and turning it over with Free Transform option:

image 6

Save it!

image 7

Click now on the Create a new layer option in the layers' panel and select the next:

image 8

image 9

Adjust the layer's parameters and change the Blending Mode - Normal to Soft Light.

Fill 40% on the layers:

image 10

Create a new layer. Take the Pencil Tool (B) of big size and represent a vertical panel situated on the left side, colored in 9E80E1, erasing the unnecessary elements with the usual instrument applied in these cases – Eraser Tool (E)

image 11

Change the Blending Mode - Normal to Overlay in the layers' panel:

image 12

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.

image 13

image 14

The layer's parameters:

Fill 0%

Blending Options>Gradient Overlay

image 15

Gradient's parameters:

image 16

Make a copy of the new made layer and apply the previous tool (Delete Anchior Point Tool) to erase by top from each corner on the right side. Select the Free Transform option to move a little the right side to the left one:

image 17

image 18

The layer's parameters:

Fill 0%

Blending Options>Gradient Overlay

image 19

Gradient's parameters:

image 20

Blending Options>Stroke

image 21

All we have to do now is to write the site's name:

image 22

(Incline a little by using the Free Transform option)

The layer's parameters:

Blending Options>Outer Glow

image 23

Personal Site Layout Tutorial: Final Result (Click to enlarge)
Click to enlarge

The site is finished!



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

Captcha