Professional Design Studio Web Layout (Part 3)

Next step includes drawing a scrolling bar, colored in #01477B. The instrument we need to pick up for this operation is Rounded Rectangle Tool (U).

The layer's parameters:

Blending Options>Stroke

Next try to represent the button inside the scrolling bar, selecting the last instrument too.

The layer's parameters:

Blending Options>Bevel and Emboss

Blending Options>Gradient Overlay

Gradient's parameters:

Now we shall represent the navigating button, applying the Ellipse Tool (U).

The layer's parameters:

Blending Options>Gradient Overlay

Gradient's parameters:

Blending Options>Stroke

Gradient's parameters:

Applying the last instrument, it's possible to draw a flare on the previous button.

The layer's parameters:

Fill 0% on the layers.

Blending Options>Gradient Overlay

Gradient's parameters:

For the convenience, we need to combine in a group all the layers composing the recently made button. Press on the Ctrl button to mark out the necessary layers and then hold on the left mouse's button to take the layers downside on Create a new group option. Make six copies of the made group and apply the Free Transform option to make the copies smaller if necessary and place the copies exactly the way it is demonstrated below.

We need to draw a pointer of white color on our button, choosing the Custom Shape Tool (U) and turn it over with the Free Transform option.

The layer's parameters:

Blending Options>Outer Glow

Make six copies of the new made layer and choose again the Free Transform option to turn the copies over if that is necessary or make them smaller. Place them the same way it is shown on the picture below. We need also to move off the effect from the copies on the upper buttons.

Add by one white small stripe near the pointers on the lowest buttons, taking the Rectangle Tool (U).

The layer's parameters are the same.

Blending Options>Outer Glow