in the name of allah
 

ArabTut

main tutorials downloads forums links contact us  
   
 
 
arabtut>tutorials>photoshop tutorials
Creating navigation bar 1

In this tutorial we will learn how to make a nice button in photoshop then in the Creating navigation bar 2 we will export it to Image Ready and start putting all the pieces together.

  • open a new document in photoshop. make its width 1024 pixels and the Height 768 pixels. Choose the Rectangular Marquee tool, change the style to " Fixed Size " and make the Width 1042 pixel and the Height 48 pixel . Click inside the document and you will notice that a selection had been made that will fill the width of the document.

  • Creat a new layer and Fill the selection - edit > Fill - with any color . then deselect - ctrl+D - . Now choose - Layer > Layer Style > Gradient Overlay - and do the following

  • Choose the Rectangle tool and make a Rectangle like the image below

  • So far our navigation will look like this
  • Choose (View>Show>Grid) and you will see the grid lines appear. Notice that some of the lines are larger than the others .We will use those to creat equal space between the buttons. Select the "Line tool" and at the second big line from the left make a vertical line . Hold down shift while creating the line so that you can make the line straight vertical. Hold down ctrl+alt+shift and drag the line to the forth grid line and photoshop will automatically duplicate the line . Continue doing the same step for grid lines numbers six,eight,...etc.

  • After adding some text and drop shadow effect to the navigation bar and our work in photoshop is done.

  • In the next part we will edit the navigation and slicing it in Image Ready.

Creating navigation bar 2

 
     
All Copyrights Reserved Arabtut© 2006