PSDartist





Navigation menu

Category : Interface, Oldies, Photoshop tutorials ยท by Dec 11th, 2010

This tutorial will show you how to make a navigation menu using gradients, shadows and achieve a good result.

Step 1.

In this tutorial I will show you how to create a simple navigation menu. So make a new document sized 500×100 and fill it wit a light grey. Now make a new layer and make a selection like mine and again fill it with the same color you used on the first layer.

Step 2.

Now add the following layer styles:

Drop Shadow:

Stroke:

This is what I got:

Step 3.

Now we need to make a new layer between the first to like in the image below:

Pick up the Poligonal tool:

And using the shift button and the mouse draw a shape like mine:

fill the shape with any color. I used a light blue:

Go to layer>duplicate layer and move the layer next to the previous one and repeat the step untill you have all the buttons:

Now merge all the shape layers togheter by pressing Ctrl+E and add the following layer settings:

Inner Shadow:

Outer Glow:

And add your text:

You are pretty much you can add bullets or anything else to enhance the menu. Look what I added:

And with a possible rollover:

SHARE :

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>