Subscribe Via RSS

3927 Subscribers

Subscribe Via RSS
Subscribe Via Twitter

Followers

Subscribe Via Twitter
Tutorial Layout Tutorial

October 9th, 2007 in Photoshop Tutorials by Richard Carpenter

Tutorial Layout Tutorial

1 Star2 Stars3 Stars4 Stars5 Stars7 Votes, Rating: 3.86
Loading ... Loading ...

Create a new document 900×900 pixels, Select 2 shade of dark grey as your background/forground, select the “rectangular marquee tool” and draw out a rectangle at the top of your canvas, fill it with a linear gradient draging from the top to the bottom. Now add these layer styles to your rectangle.

Heres how it looks so far.

CLICK HERE FOR THE RESULT

Select your type tool and type out your sites title and slogan.

Add this layer style to your “title”.

CLICK HERE FOR THE RESULT

Select the “rounded rectangle” tool and draw a small rectangle underneath your header.

Add these layer styles to your little rectangle.

Your little rectangle should now look like a nice button.

Duplicate this button as many time as needed and place along side the bottom of your header, you might also want to label your buttons.

CLICK HERE FOR THE RESULT

Duplicate your header then goto “edit > free transform > flip vertical” and postion the duplicated layer at the bottom of your canvas this shall be the footer. Select the type tool and add your footer information.

CLICK HERE FOR THE RESULT

Now lets create a our content boxes. Select the “rectangle marquee tool” and draw out 2 seperate boxes.

Add these layer styles to both boxes.

Position the boxes on top of one another. You should have something like this.

Now duplicate both boxes and create individual content boxes. (see link below)

CLICK HERE TO SEE THE RESULT

Label all your content boxes.

CLICK HERE TO SEE THE RESULT

Thats it all done, and with some content it shall look similar to this.

About The Author

About The Author: Richard Carpenter

Hi im Richard Carpenter and im a freelance web and graphics designer from England. I am also a regular Blogger, Tutorial Writer, and owner of Photoshop Plus. You can follow me on twitter HERE. You may also view my portfolio HERE.

 

Richard Carpenter has written 364 posts.

Be Part Of The Community!

Become part of the hv-designs community.

Subscribe Via RSS or Follow Us On Twitter.

Subscribe Via RSS Follow Us On Twitter

4 Responses to “Tutorial Layout Tutorial”

  1. used cars says:

    Realy liked it. nice design

Leave a Reply