Car Layout #3

Create a new document 850 x 1000 pixels, fill your background layer with the color #1e1e1e. Select the rectangular marquee tool and create a rectangle the width of your canvas, place the rectangle at the top of your canvas, fill using the gradient tool, using the radial gradient and a light shade of grey. You should have something like this.

With the polgonal lasso tool create a shape like this.

Fill with the color white, but leave the selection still selected. While its still selected head over to the channels pallette and click save selection as channel.

Once you have clicked the save selection as channel button you should have a another layer called “alpha1” select it, press ctrl + D to deselect the selection, then goto filter > blur > guassian blur, blur by 10 pixels. You should be left with this.

Press CTRL + L to open the levels panel, drag the 3 trianglar points into the middle, you will notice the blured shape sharpens and becomes more rounded.

Click your “alpha1” layer whilst holding down the ctrl key on the keyboard to load a new selection. Click back to your layers pallette, create a new layer then fill the selection with the color white. Delete your other layer you created previously with the polygonal lasso tool. Add these layer styles to your new shape.

You should have something that looks like this.

With the rectangle marquee tool add a small rectangle over the top of your shape, fill with the color white and set layer opacity to 5%.

Add some navigational text either side of your shape.

Now with the rectangle marquee tool, or the pencil tool add two 1 pixel lines side by side to create a divider, place the divider inbetween your navigation text.

For this step your going to need a seperate image of a car of your choice, im using an image from digimods (full credit going to the author “norder”). Remove the background from your car image, scale it down with the transform tool and place in the middle of your navigation.

Duplicate your car image and flip it vertically, align the image below the orginal, then add a lyer mask, drag a linear gradient over the top to produce a reflection. Lower the opacity to suit yourself.

Add some additional text, logo and website title to complete the header.

Using the same method as we did for the navigation create a further 2 boxes either side under our navigation. Dont forget to blur by 10pixels and move the levels.

Add these layer styles to your 2 content boxes.

At the top of your content boxes where the tab is, add your content box title text and a logo of your choice, im using the arrow from the

custom shapes libary within photoshop.

Create a selection like in the image below, fill with the color white and lower the opacity.

Fill your content boxes with your content, and place a divider underneath your content box titles, the dividers are the same as the ones created in the navigation.

Create a further two boxes underneath your main boxes, add a simple stroke to each box to give it some detail.

Add your footer content by duplicating your header text and logo. Add some content to fill your other content box.

To create the buttons select the rounded rectangle tool, draw out a black rounded rectangle then add these layer styles.


23 thoughts on “Car Layout #3”

Leave a Reply

Your email address will not be published. Required fields are marked *