Windows 7 Photoshop to create Web site navigation

mainly to introduce the situation with Photoshop to make a Windows 7-style navigation menu. Have a look at the last outcome:


last outcomes

creation history:

1, a brand new file, the measurement of custom made, this can be 600 * 400 instance. Set foreground coloring: # 1592d7, history shade: # 136da2, choose the Radial Gradient Device. Drag in the middle get the subsequent outcomes:


Figure one

2, add the scattered light provisions. Make a new layer, select the left toolbar - Rounded Rectangle button - Custom made shape button. Find the following forms, if not you possibly can click on the little arrow to the right, extra styles.

Figure 2

pick and drag the layer possess the following results:


Figure 3

foreground coloring to white (# ffffff), pick the pen device, right-click the route - the path stuffed. Get the next figure:


Figure four

Right Path - Get rid of route. Pick the Click Ok. Mix mode to Opacity of 30%.

Figure 5



generating navigation history

1, add the Windows seven phrases and emblem. A new layer named Pulled out a black rectangle. Peak based on their wants.

Figure 6

2, filled with the following: 10%. A new layer, generate edges. 1px draw two lines with a black leading, transparency 50%, following a white.

Figure seven

three, copy the leading line, transfer towards the bottom:


Figure 8

creation Navigation button

one, a new layer, make the subsequent selection, shell out interest to upper and decrease edges:


Figure nine

2, fill it with black opaque set
Figure 11

Gradient Overlay,Windows 7 Professional, coloration from white to transparent. Stroke:


Figure twelve

are as follows:


Figure thirteen

4, making the decrease proper corner superior light border:


Figure 14

5, add a layer mask, black background white foreground. Drag acquire the subsequent results:


Figure fifteen

the last result:


Figure 16