Subscribe to RSS
Email Alert
Design a Sleek Vertical Navigation in Photoshop
2-18-08
Filed under Designing & Photoshop Tutorials
Step 1:
Let’s start out by creating a new file. I used a 400×400 pixels canvas set at 72dpi, and I filled my background with a white color. Now select the Rounded Rectangle Tool and above your screen under the options palette choose Fill Pixels, set the radius to 12 px and check anti-aliased. Create a new layer and draw a rounded rectangle with #F4F4F4 color shade and 290×250 px dimensions.
Step 2:
Under Layer Style(Layer > Layer Style) add an Inner Shadow and Stroke blending options to your light gray rounded rectangle.
Step 3:
Create a new layer and using the Rectangle Tool draw a white rectangle with 230×45 px dimensions.
Step 4:
Under Layer Style(Layer > Layer Style) add a Drop Shadow, Inner Shadow and Gradient Overlay blending option to your white rectangle layer.
Step 5:
Select your Horizontal Type Tool and above your screen under the options palette set the font family to Arial, bold, 14 pt, none and #00E4FF color shade. In a new text layer type your first navigation title on the rectangle design.
Step 6:
Create a new layer and using the Ellipse Tool draw a circle with #00E4FF color shade and 16×16 px dimensions. Then under Layer Style(Layer > Layer Style) add a Stroke blending option.
Step 7:
Select your Horizontal Type Tool and above your screen under the options palette set the font family to Wingdings, regular, 15 pt, strong and white for color. In a new text layer type ‘4′ on your keyboard which should turn into an arrow icon. Place it inside the circle.
Step 8:
Add the rest of your navigation by stacking them.
Step 9:
That’s it your done.
on a daily basis so why not Subscribe to our RSS Feed?
February 18th, 2008 at 3:19 pm
[…] Thomas_EyeDesign wrote an interesting post today onHere’s a quick excerptThis photoshop tutorial will teach you how to create a sleek vertical navigation similar from nintendos official website. (more…) ShareThis. […]