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

Business Layout


Create a new document 800x800 pixels with a white background. Double click your background layer and press ok when the new layer box pops up, doing this will unlock the background layer. Add this layer style to your background layer.

image 1

Now select the rounded rectangle tool with a radius of 20pixels.

image 2

Draw out a rectangle in the middle of your canvas, then right click and goto "fill path". Select the pen tool then right click on your canvas and goto "delete path", you should be left with a white box with nice curved edges.

image 3

Add these layer styles to your rectangle.

image 4

image 5

image 6

image 7

Duplicate your content box you just created and make a new layer above it, hide your background layer and your orginal content box layer. Select your new layer and then goto "layer > merge visable". Head over to "filter > blur > guassian blur" blur the content box by 6pixels, change layer opacity to 60% and layer blending mode to screen. You should have something like this.

image 8

Thats our content box done, select the type tool and type your site title and slogan.

image 9

Select the custom shapes tool and select this arrow (see image below).

image 10

Add the arrow by your site title and slogan.

image 11

Whilst holding down the "ALT" key on your keyboard hit the down arrow key then the right arrow key, do this about 10-15 times depending on how thick you want your arrow to look. Everytime you hit the down and right arrow button (not together) a new layer should be created. Once your down merge all your layers together APART FROM THE ORGINAL. Drag the duplicated layer underneath your orginal, then label them top and bottom so you dont get mixed up. Add these layer styles to your bottom layer.

image 12

image 13

Your arrow should look like this.

image 14

Now add these layer styles to your top layer.

image 15

You should have something like this.

image 16

Create a new layer above your top layer select the newly created layer and click on your top layer whilst holding "Ctrl", once the selection has been activated goto "edit > stroke", fill with a white 1 px stroke.

image 17

You should have something like this.

image 18

Ive also added a shine as you can see on the image above, you should no how to do that by now. Select various custom shapes from the custom shapes tool and create your navigation.

image 19

Duplicate Your header elements and transfer them under your content box change the text to suit your footer.

image 20

Now fill your content box with your content.

Business Layout



Author's URL: Hv-Designs.co.uk
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 "Business Layout"

Captcha