|
Interface Tutorial : 3D Gradient Bar 02
|
|
This is another version of the gradient bar using a double gradient but in a
different way. Another gradient is used to create for the buttons placed on the bar making
it similar to using a triple gradient.
For this bar I choose red as the color so I set my foreground color
to light red and my background color to dark red. Then I need a bar with rounded corners
on a layer. Then I
load a selection
on the bar(fig. 1) and apply a vertical gradient(fig. 2). Set your gradient
type to linear and the gradient from foreground to background.
Do not lose the selection yet.
Figure 01
Figure 02
With the selection still loaded, I
contracted the selection by 3 pixels then make a new layer then apply a vertical gradient
using the same colors but this time going the other direction.
Figure 03
Then you create 4 button shaped patterns on a different layer and position them accordingly on the
bar(fig. 4).
Load a selection on the patterns(fig. 5).
Figure 04
Figure 05
Using the same gradient settings, apply a vertical gradient to the patterns but this
time having it go the same direction as the first gradient(fig. 6).
Apply a drop shadow to the buttons then place the text to complete the bar(fig. 7).
Figure 06
Figure 07
|