Preview: Photoshop Tutorial Stylish Wooden Navigation Interface Design. Step 1: Let’s start out by creating a new file. I used a 900×500 pixels canvas set at 72dpi, and with a black background. In a new layer draw a long brown rectangle with #6B381D color shade and 745 x 78 px dimensions. Step 2: Under Layer Style(Layer > Layer Style) add an Inner Shadow, Satin and Pattern Overlay blending options to the long brown rectangle layer. Result: Step 3: In a new layer draw a long white rectangle with 745 x 29 px dimensions. Position the white rectangle on the bottom side of the brown rectangle design as shown below. Step 4: Under Layer Style(Layer > Layer Style) add an Inner Shadow and Gradient Overlay blending options to long white rectangle layer. Then set the layer's blending mode to Darken. Result: Step 5: In a new layer draw a small brown rounded rectangle with #CD510E color shade and 89 x 34 px dimensions. Then cut the bottom half of the rounded rectangle to form a tab. Step 6: Under Layer Style(Layer > Layer Style) add a Drop Shadow, Inner Shadow, Inner Glow and Gradient Overlay blending options to the brown tab layer. Result: Step 7: Select the Horizontal Type Tool then set the font family to Arial, Bold, 13 pt, smooth and white color shade. In a new text layer type one of your navigation links on the tab design. Step 8: Add more tab designs for the rest of your links, position them on the center so you can add the search box on the left end side of the navigation interface. Step 9: Now add a simple search box design made up of a white rectangle and a small black rectangle for the search button. Also add three small tabs above it for your twitter, rss and facebook link or whatever links you want to use. Step 10: Select the Horizontal Type Tool then set the font family to Arial, regular, 12 pt, none and #FFF000 color shade. In a new text layer type your sub navigation links next to the search box. Add a bar key with #850000 color shade for spacers. Results: Stylish Wooden Navigation Interface Design.