Design a Sleek Navigation Interface in Photoshop--tutorial.jcwcn.com

In this tutorial you will learn how to design a Design a Sleek Navigation Interface using photoshop.

Preview:

Sleek Navigation Interface.

Step 1:

Let’s start out by creating a new file. I used a 1000×200 pixels canvas set at 72dpi, and I filled my background with white color. Now create a new layer then draw a long gray rectangle with #D7D7D7 color shade and 950 x40 px dimensions.

Step 2:

Under Layer Style(Layer > Layer Style) add a Gradient Overlay blending option to the long gray rectangle layer.

Result:

Step 3:

Create a new layer, using your Polygonal Lasso Tool draw the gray rectangle like shape shown below.

Step 4:

Now grab the Eraser Tool and create a smooth curve on your gray rectangle shape.

Step 5:

Create a new layer, below the gradient a new layer draw a long rectangle with #00273E color shade and 950×26 px dimensions.

Step 6:

Under Layer Style(Layer > Layer Style) add a Drop Shadow, Inner Shadow and Gradient Overlay blending options to the long rectangle with #00273E color shade layer.

Result:

Step 7:

Now add a white search box on the left end of the interface. Then in a new text layer type ‘Looking for something?’ on the search box, use font Arial, bold, 11 pt, none and #989898 color shade.

Step 8:

In a new layer draw a small orange rectangle with #E92700 color shade and 56 x 21 px dimensions, this will be your search button.

Step 9:

Under Layer Style(Layer > Layer Style) add an Inner Glow and Gradient Overlay blending options to your search button layer.

Result:

Step 10:

Select the Horizontal Type Tool then set the font family to Arial Black, regular, 90 pt, strong and white color. In a new text layer type your name on the center of the canvas.