Her

Home Photoshop Tutorials Web Layout Extreme Layout

Extreme Layout

Author: CoolJeba.com Author's URL: www.cooljeba.com More by this author

Step 1: Fire up photoshop and start a new document of size 680x700. Select the background color as #525252.

Step 2: Create a new layer and Select the Rectangular Marquee tool and draw a rectangle and fill it with #2C2C2C. Here is the preview.

image 1
Click to enlarge

Create a new layer and draw another similiar rectangle and fill it with #5B5B5B. Make the width of this rectangle smaller than the previous one.

Step 3: Now select the previous rectangle i.e the layer that contains the first rectangle that we drew. Now go to Filter>Blur> Gaussian Blur and select the Radius as 8 pixels. This is what you get.

image 2
Click to enlarge

Here you can see our background is ready. Next we will add a header.

Step 4: Create another new layer select the rectangle marquee tool and fill it with the gradient. You should get this

image 3
Click to enlarge

Let us add some banner logo and text there. Now this part depends on individuals creativity.

image 4
Click to enlarge

What I have done here is created some layers and drew some basic shapes like circle etc and filled it with black + back ground colour gradient.

Step 5: Now that our header is ready let's make the menu. Create a new layer and draw a rectange and fill it with the gradient as showing in the screenshot.

image 5
Click to enlarge

Rather than the usual menu i.e with bullets I have tried to add it with text itself like this Homepage >> About Us >> Portfolio >> Tutorials >> Wallpapers >> Affiliates the font that I have used is simple Arial Black. You can select any font depending on the font the layout's appeal may change. Here is what I got

image 6
Click to enlarge

Step 6: Now out header and menu is done. Now we need to make a place where we can put out body. Create a new layer and select the rounded rectangle shape and draw it below the menu. This is what I got. This is also an important step. You can make the layout darker or lighter. This is what I did.

Extreme Layout
Click to enlarge

That is is we are done. Our layout is done. I would like to keep it simple. You can add some more boxes in the content area. I Hope you found this tutorial useful.