Introduction…

In this tutorial you will learn how to create a colorful design studio header layout. If you have any questions about this tutorial be sure to ask in the comments and i’ll be happy to answer any questions. Also, remember with all the tutorials, the psd is available for download.



Download the PSD…

Don’t have time to do the tutorial, but would like to see the results? The PSD is available to anybody who would like to use it.



Lets get started…

1. First thing we want to do is to create a new document. So lets open up photoshop and create a new document with the size of 1000×275.



2. First thing we want to do is create the back to our navigation. Using the marquee tool, make a similar selection to the one below, and fill it with any color:



3. On that layer, input the following blending options (right click then choose blending options)




4. Next, make a selection again similar to the following and fill it with any color:



5. Now input the following blending options into that layer you’ve just created




6. Your document should look something like this by this point



7. Next we want to go ahead and make our buttons. Using your rounded rectangle tool, with the radius set to 35px, make a rectangle similar in size to the following:



8. Rasterize the layer (right click > rasterize), and then input the following blending options





9. Copy your buttons layer, and the copy will be used as a reflection. move it directly under your button and use your marquee tool with a feature to make your reflection, and play around with the opacity a bit and it will look something like this:



*note, if you need a detailed description of creating a reflection i’ll add one in.

10. Then you can just add some text and you’ll have something that looks like the following



11. Now we want to repeat steps 7-9 to create more buttons.



12. I chose to create what an ‘active’ link would look like. Everything is the same except instead of using step 8s gradient, we will use the following




13. Next grab a simple font of your choice that will be your logo. I chose to use GE Centurion, with the following blending options:




14. It will look something like this:



15. The last thing I did was to use some line art and some soft brush strokes to add a little more in the header, and this is my final result:



**If you have any problems, or have any questions about this tutorial, please leave your comments and I will get back to you. Also, remember the PSD to this tutorial is available for download.

If you enjoyed this tutorial, why not check out our other Adobe Photoshop Tutorials?