1. The first thing we need to do is create a new document with the dimensions of 810×800. You can make it larger if you wish.
2. Next we want to us our paint bucket tool to fill our background with #000000.
3. Now, we want to go ahead and create the box that will house our content. Lets go to our tools pallet and choose our rounded rectangle tool and set the radius to 15px and make a rectangle like the following
4. The next thing we want to do is to create a little navigation panel for our box. To do so, use your rounded rectangle tool to make a rectangle similar to the following
5. Make sure you have that rectangle below your content area in the layers pallet and then input the following blending options onto its layer
6. You should now have something that looks like this
7. Next we want to make a heading for our navigation panel. To do so we want to use the rounded rectangle with the radius set to 15px yet again and make a rectangle similar to the following
8. Now insert the following blending options onto its layer
9. You should now have something that looks like this
10. Now we want to add a shine to our rounded rectangle. To do so, CTRL+CLICK on your heading layer to select it
11. On its own layer, fill it with #FFFFFF and then use your rectangle marquee tool to clear out the bottom half of it
12. Go ahead and set its blending options to Overlay, and then lower the opacity to 20%
13. Now just name your header and your done with that. Then use a font like Helvetica to add some links. By each link I made a square using my rectangle marquee tool filled with #0c6aa2
14. Now all you need to do is repeat the same steps for the right side and add some content and you’ll have something that looks like this
Get a commercial/public use licence for this PSD (More info)
Remember if you have any questions or comments about this tutorial to leave your responses in the comments below and we will get back to you very quickly.
If you enjoyed this tutorial please take a moment to visit one of our sponsors
Loading...
10 Responses
Sergio Tapia
Thanks for the great tutorials. If only I could follow them. :’(
Would you do me a favor and let me know what is the best place to start adventuring into Photoshop? I mean, I know what layers are, I know what the Pen is (I don’t know how to use it), and I can learn quickly, it’s just that I don’t know where to begin!
Most tutorials on the web assume you know most of the things in Photoshop when in fact, you don’t know.
Thanks for the answers
Matthew Heidenreich
@Sergio
Try looking at: http://www.pixel2life.com/
You can browse different categories, and try and find tutorials aimed more at beginners. I think you might want to look into ‘text’ effects and that first as those would probably be the easiest ways to start learning tools. Knowing what each tool on the tools palette does helps a lot as well. Just by googling I found this guide on what each tool does
http://www.psdtop.com/blog/basic/adobe-photoshop-cs3-tools-palette-with-keyboard-shortcuts/
Hope this helps you out
Sergio Tapia
Thanks a bunch Matthew.
Once I learn the basics I’ll be sure to try out all your tutorials.
All the best,
Sergio
Alex Rogahn
Looks pretty good! but that gloss looks a bit flat imo, treat it to a gradient
MRcrispy
nice :p
ghawyy
i love that effects so much and i applay alot of examples
but that colors u choose really great thank you so much
Ethan
Thanks! Great tutorials. I really would like to use this design for my next site. Awesome!
psaddict
Added to http://www.psaddict.com
yosry sabry
cool .. thanks
Business Cards
Always the site to go to for some of the best tutorials. This is another addition to your growing list of really good tutorials. Excellent job! Keep it up!