In this tutorial i will show you how to create a web 2.0 web layout.

Register for a VIP account and you will be able to download this PSD layered layout.

Notice that a iMac vector (file format : .eps) is also included with the PSD layout.

I hope that you will like the explanations and the final result.

Don’t hesitate to post a comment at the bottom of the tutorial and also to talk about this tutorial with your friends. It would be really nice from you.

As usual we will need to create a new document in Photoshop. The easy way is to press on CTRL+N. For this layout i will create a document with the following size 1200 x 1100 pixels.

With Rectangle Tool i will crete a shape on top of the layout

As you can see i have used a dark color there. After that with the same tool i will create another shape and i will place it like in the following image

For this layer i have used the following layer styles

This is my result so far. On this shape we will place the logo with Grafpedia and the menu later in this tutorial.

The i will create another shape under this shape another one

And as always i will use some layer styles

If you register for a VIP account you will be able to download a Photoshop Brush with a Bokeh effect. Load the brush inside Photoshop, and then create a new layer. On this new layer we will add the brush. Set the foreground color to white and then with Brush Tool i will add some nice lights

With Rectangle Tool i will create another shape like in the following image

The layer styles settings are in the following images

Also in the .zip file from the bottom of the tutorial you will find also a vector file with a iMac. Open the eps file and copy the vector computer to your layout

On your header add text to the left side right under the logo

With Horizontal Type Tool i will create also the navigation area. here i will add some simple text buttons

I will add some indented lines. These lines are made with Line Tool. There you need to create two lines, one with white color and the other one with black color. Select both layers in your layer palette, and press on CTRL+E to merge both layers into a single layer. Then you need to select Eraser Tool and with a smooth round tip delete the top part and the bottom part of the lines. This small trick will make the lines indented.

I will add now some icons. You can download them from here

As you can see from the link from above the icons are with colors. The easy way to change the icons to black white icons you need to desaturate them. Select each icon and go to Image > Adjustments > Desaturate

On the right side i will create some round shapes with Rounded Rectangle Tool

Here are the layer styles i have used for these round shapes

On the bottom of the page i will create another shape

Here I will add some icons which are available here

My last step is to add a shape in the footer

This is my final result. i hope you like it

If you wish to get certified with 70-270 certification then take advantage of our latest and most recent pass4sure 642-436 dumps as well as 70-686 test demos and pass real exam on first try.