Gamespot Style Website Design in Photoshop Part 3

Jan 7, 2009 Photoshop, Web Layouts

This tutorial has been viewed: 2617 times

Page prev 1 2 3

Next Create a New layer right above the maincontent layer (the one with the light grey background) and press ctrl+g to mask that layer, then pull out the Rounded Rectangle tool and set the foreground color to #2E6A8F, draw a shape like below and apply the following layer style settings

Next create a new layer, and draw a rounded rectangle over top of the blue area, fill the rounded rectangle with #BDBEC0, select the bottom half of the rounded rectangle and press delete.

Next make a selection near the top of the new header and pull out the gradient tool, set the colors from white to transparent, and use the gradient tool like so:

Do the same thing again, except this time make a selection of the bottom half, set the colors from Black to Transparent and do it from the bottom for the shadow.

For the bottom portion, make a new layer, set the foreground color to #626469, then pull out the marquee tool and select the very bottom of the page leaving a little bit of the bottom out of it, fill the marquee with #626469 and stroke that layer one pixel with #40BDE8, And that’s about it for the layout you should have the following so far

Zoom

Add some text and a logo and your all set! Here is what I came out with

Zoom

Page prev 1 2 3

Tags: Logo, photoshop