1. First thing we want to do is create a new document with the dimensions of 900×365.



2. Next thing we want to do is change the background color to #005b9e by using our paint bucket tool to fill our background layer.

3. Now using your rectangle marquee tool, or your rectangle tool make a rectangle similar to the following and fill it with #FFFFFF



4. Now insert the folllowing blending options onto its layer.




5. your document will now look something like this



6. Next thing we want to do is to use our rounded rectangle tool with a radius of 15px to create a rectangle similar to the following. Make sure your foreground is set to #639ebd



7. Next, insert the following blending options onto your rounded rectangles layer







8. Your document will now look like the following



9. Using your rectangle marquee tool with a feather set to 15px make a selection similar to the following and fill it with #FFFFFF. Then set it under your rounded rectangle tool.



10. Now, just adjust your opacity to 50% and change the blending mode to Soft light and your document will look like the following



11. The next step is optional if you want to add a little more to your background. I used a Starburst effect set to overlay and the opacity set to 8%. You can download the starburst effect here



12. Using your rounded rectangle tool with a foreground set to #FFFFFF and the radius set to 5px make a box similar to the following



13. Next lets use our rounded rectangle tool to make the back of our button. Set the radius to 5px, and make something similar to this



14. Now use these blending options on your button layer






15. Next lets add a shine to our buttons layer. CTRL+CLICK your layer to select it. Create a new layer and fill it with #FFFFFF. Delete the bottom half of it and you should have something that looks like this



16. Change the blend mode to overlay and the opacity to 35%. Then just add some text and it will look like this



17. Now just repeat steps 13-16 as many times as you’d like and you should have something that looks like this



18. We want to symbolize what it will be like for an active link. So using your polygonal lasso tool make a triangle similar to the following and fill it with #FFFFFF



19. The last step is adding your content and you should have something that looks like the following





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