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

Web Design Layout #2


Create a new document 800x800 with a black background, select the color #01afee and create a rectangle. Once you have your rectangle press "CTRL + T", now rotate your rectangle like this.

image 1

Now for this part you need some "splatter brushes" EITHER search yahoo or goto a site like brush easy and download a set, once you have them make some random splatters over your canvas, using the colors blue and black.

image 2

Select the type tool and add your site title and slogan.

image 3

Now if you have used two colors like mine above for your title then select one of the colors and add a splatter. If you have used white then you can just use a white splatter, you should have something like this.

image 4

Select the type tool again and add your navigation, use free transform (CTRL + T) to rotate the text.

image 5

Now I'm going add 3 sections to my main page which will be "news & updates", "tutorials" & "latest work", by the side of each of these 3 sections I'm going have a different icon, ALL of which are chosen from adobes custom shapes menu.

image 6

Now under each section I'm going to add some content.

image 7

image 8

image 9

image 10

Once you have your content in place, select a different color, I'm going to use the same color green i used for my title and add a big splatter at the bottom of the page.

image 11

Here i shall add my footer information.

image 12

Now last but not least, add some more black splatters around your content.

image 13

When your finished you should have something like this.

Web Design Layout #2
Click to enlarge


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 "Web Design Layout #2"

Captcha