website promotion banner
eturnkeys
Your Ad Here
Photoshop  Home Photoshop Web Layout Tech Navigation Bar
rss

Tech Navigation Bar

Author: Hv-Designs.co.uk More by this author


Create a new document 600x150 with black as your background. Select the "rounded rectangle tool" and draw out a rectangle fill it with the color black also, now add these layer styles.

image 1

image 2

You should now have something like this.

Click to enlarge
Click to enlarge

Now create a new layer above your rectangle then select the pen tool and create a box like this.

Click to enlarge
Click to enlarge

Right click and goto make a selection. Then fill with the color white.

Click to enlarge
Click to enlarge

Select your rectangle layer whilst holding the "ctrl" key on the keyboard now click your white box layer that you created in the last step. Goto "select > inverse" then hit the "delete" key on the keyboard, you should be left with this.

Click to enlarge
Click to enlarge

Add this layer style to your white box and set layer opacity to 65%.

image 7

You should now have this.

Click to enlarge
Click to enlarge

Select the type tool personilze your navigation with the sections you require. The colors ive used are #ffffff & #d9ff3f.

Click to enlarge
Click to enlarge

Select the type tool once again and just type out some dashes ( --- ), Now goto "edit > transform > rotate 90 cw" place one of these next to your text.

Click to enlarge
Click to enlarge

Now draw a small white box above your text.

Click to enlarge
Click to enlarge

Now add a number inside you white box.

Click to enlarge
Click to enlarge

Now select the type tool again and whilst holding shift press "¬" key, on my keyboard its under the "esc" key and above the 2tab" key. Add this symbol to the right of your text.

Tech Navigation Bar Tutorial: Final Result (Click to enlarge)
Click to enlarge

All done.



Author's URL: www.hv-designs.co.uk

Rate this Material: Bad 1 2 3 4 5 Excellent
print this page tell a friend subscribe to newsletter subscribe to rss

Add comments to "Tech Navigation Bar"