Subscribe Via RSS

0 Subscribers

Subscribe Via RSS
Subscribe Via Twitter


Subscribe Via Twitter
Gaming Layout #2

August 5th, 2008 in Photoshop Tutorials by Richard Carpenter

Gaming Layout #2

1 Star2 Stars3 Stars4 Stars5 Stars16 Votes, Rating: 3.94
Loading ... Loading ...

Create a new document 900×1000 pixels with a black background. Head over to your favourite stock images site and grab yourself a picture of the earth, drag your picture onto your canvas.

Lets make our image more lighter, duplicate your photo and set layer blending mode to screen.

For this next part your going to need some “tech” brushes. Carefully add your tech brushes around your earth image, dont over do it though.

Once you’ve done that select the rectangular marquee tool and add a rectangle at the top of your canvas fill with the color #cfd0d2. Add these layer styles.

Set the opacity of the rectangle to 90%, you should have something similar to this.

With the rounded rectangle tool add 2 buttons. Add these layer styles to your buttons.

Now add some text to your buttons.

Select the rectangular marquee tool and make a selection on the left for your sidebar, fill with the color white, then set layer opacity to 15%. Finally add a layer mask then drag a linear gradient over the bottom of the rectangle.

Control click on your rectangle to load a selection, click your one of your earth image layers then goto “filter > blur > guassian blur” blur by about 3 pixels. Do the same again for the other earth layer. You should have something similar to this.

Now begin to add some sidebar content. Also add your website logo and title.

Select the rounded rectangle tool and create a white content area next to the sidebar.

Now add your main content in the white box.

Finally add your footer.

Layout inspired by “fee3r

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

19 Responses to “Gaming Layout #2”

  1. Arend says:

    Very nice one, really impressive how you did this.

    but you just had to add the “dick” part? xD

  2. Palomino says:

    thanks for your tutor :)

  3. Ahmad .. says:

    Nice ..

    can u make a Culture Club tutorial ..


  4. helpfull hand says:

    Wow, nice one, and the only good rating for Half-Life 2, man i love that game :)

  5. zvonko says:

    WOW…I feel like an alien…

  6. Matt says:

    Wow the Space Channel logo fits well with this design.

  7. Mathew Edison says:

    Thanks, this was very close to what I was looking for! :D

  8. Colin says:

    Cool, but yeah — that’s the logo from the Canadian channel, Space. Should credit them:

  9. ADMIN says:

    hah didnt no that, i just searched google for a space logo

  10. Dylan says:

    Woww…nice tutorial.
    Think you give me the full size of that stock? XDD

  11. Felix F. says:

    yes. nice.
    BUT very smiliar to the idea of this design..

    give me some credits, or write me a note! but this is just brazen


  12. ADMIN says:

    you have already been credited ;)

    link underneath the finished layout image

    “Layout inspired by “fee3r“”

  13. Felix F. says:

    ah okay. sorry, didn’t get it;) not very eye-catching, but it’s ok.

  14. tytanB says:

    Cool tutorial, it’s very helpfull. Can i have that stock?

  15. Sandro says:

    just what i was looking for, thx

  16. Where’d you get the tech brushes from? I’ve been looking for something like that.

  17. ADMIN says:

    brusheazy search google for it

Leave a Reply