Create a new document 900 x 1130, fill the background with the color #343436. Now your going to need an image of a car of some sort, ive chose a vector that i found on google. (IMAGE NOW REMOVED DUE TO COPYRIGHT) Best to find one with a simple background. Copy/Paste your car image onto your canvas, resize down to fit into the top right hand corner of the canvas.

Select the first few pixels of the car image using the rectangle marquee tool.

Now press “ctrl + T” and drag the middle anchor point on the left right the way across the canvas.

Now select the rounded rectangle tool, draw out a number plate type shape, press ctrl+t and rotate it slightly like the image below.

Now add these layer styles to match mine.



On a new layer above your number plate shape select the circle tool and create a selection like the image below.

Fill with the color white and set layer opacity to 10%, Now while the white circle layer is selected press ctrl and click on the number plate layer to make a selection of the number plate, now goto “select > inverse” and hit the delete key. You should be left with this.

Do the same again only this time change the white circle to.

Set the 2nd white circle layers opacity to 7%, you should end up with something like this.

Now on your number plate shape add your website title and slogan, also create 4 really small circles for each corner of the number plate and add these layer styles.


You should have something like this.

Now underneath your header create a rectangle the width of your canvas, this will be our navigation bar.

Add these layer styles to your navigation.




Now add your navigation text, and add a shine in the same way you did before on the number plate only this time use a rectangle the width of the navigation. Your navigation should now look like this.

Draw a box using the rounded rectangle tool underneath your navigation, leaving a gap inbetween the two items. Right click your navigtion and goto “copy layer styles” now right click your content box and goto “paste layer styles” you should have a navigation box like this.

Create a small circle inside your content box this will be our little orb icon, copy and paste your navigation layer styles to your circle, and add 2 shines to it like we did on the number plate in the header. Goto your photoshop custom shapes and select a shape to go into your orb.

Now add your content box title and some content.

Now follow the steps above to create more content boxes.

Now finally duplicate all your naviagtion elements, drag to the bottom of your canvas, change the naviagtion text items to your copyright information. Your layout should look like this.








11 Responses to “Car Sales/Club Layout”
D. Carreira Says:
Nice tutorial!
And now, why not create the HTML/CSS template? :P
David Carreira
ADMIN Says:
i am doing :p still doing the portfolio #6 css template. just been a very busy man :(
LP Says:
wow! xD
alonsh26 Says:
great work man
CaPoNe Says:
Wow , really nice ! Thanks for the tutorial man , good job !
LYMS Says:
THIS WEBSITE IS AWESOME, EXCELLENT TUTORIALS!!!!!!!!!!!!!
Xphunt3r Says:
Really awesome perfect man
mj Says:
thanks a lot!
great!!
ADMIN Says:
CSS TEMPLATE NOW ADDED
Steven Says:
Awsome..
i love it here is the psd file available for download???
steven
Leave a Reply
Trackbacks
search
Learn more about advertising with us.
write for us
Intrested in publishing some articles, tutorials or freebies on hv-designs.? We welcome anyone who is intrested, we'll even return the favour by sending you aload of goodies. Learn More
Learn more about advertising with us.
Recent Comments
copyright
The effects and techniques demonstrated in tutorials on hv-designs.co.uk can be used in whatever manner you wish without attribution. The text, images and tutorials themselves are all copyright © hv-designs.
usage
You cannot copy whole tutorials, either in English or translated to another language unless permission is given by the tutorial author.
friends online