Gamespot Style Website Design in Photoshop Part 3

Gamespot Style Website Design in Photoshop Part 3



This tutorial has been viewed: 236 times

Loading+ Add to Todo List

 
avatar
Added By: PSDesignZone
 

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: ,

Related posts

Tags: ,

  • Can this PSD be made available for download.
  • Sure, if you want it right away, let me know an email to send it too and i'll send it.
  • first part of my email is: sendpsd and the rest will be at: work the rigs . com no spaces of course.

    sorry but i do not know any other way to let you know my email without getting TONS of SPAM
  • Hey Tyler,

    I looked everywhere for the .psd and couldn't find it, this tutorial is about 5 years old so I misplaced it. Sorry about that, i'll be sure to upload future PSD's. :(

    PSDesignZone
  • Luke
    Great, just great
  • Jordan Garn
    Testing out Comments
blog comments powered by Disqus
Categories
  • CSS
  • Features
  • Fireworks
  • Gimp
  • Illustrator
  • Inspiration
  • News
  • Photoshop
  • Sub-Pages
  • Wordpress
  • Affiliates Extreme Studio Pixel2life
    About the Site PSDesignZone was started back in 2004 with the goal of becoming the Best Graphic Design and Web Development Tutorial Website on the Net, There are a bunch of great tutorial websites out there, so I don't know if we acheived that goal. But we hope we can provide some added value and help people on their way to becoming Master Designers.
    Friends