Web page often compact button--plastic Press (二)

Buttons | Page Fifth: Plastic button (二)

This is another form of plastic button, which is more lively and more suitable for easy Web sites than the several types we described earlier. This method is suitable for making all kinds of irregular buttons.

1. The previous steps of the process and a few rounded corners of the production process similar, new document, new Layer 1, with the rectangular marquee tool to select a rectangular shape, new channel 1, fill white, deselect.

Gaussian blur channel, adjust the color order, make the rectangle rounded (the specific values can refer to the above examples), load the selection, back to the RGB channel, select as the button color foreground color, fill in Layer 1 selection, deselect, and then use the deformation tool to transform the rounded corners of the rectangle. (Figure 22)

Figure 22

2. Here we make the high light portion of the button. Unlike the previous examples, this time we'll hand-create the high light of the button. Select the Free Pen tool, outline a path to the top of the button, and then convert to a selection, create a new layer, fill the selection with white, and deselect. (Figure 23)

Figure 23

3. Of course, this will not be our high light, this white area, just as the high light part of the constituency base. Now load the opaque area channel of Layer 1, select the Shrink command from the Modify command Group of the Select menu, shrink the selection by 1 pixels, and then deselect it to delete the selection image in Layer 2. Load the opaque area of Layer 2, now this is the high light constituency we really need. (Figure 24)

Figure 24

4. Next, we want to clear the white in the selection, press the DELETE key 4 times, so that the pixels in the selection are removed almost. Set the foreground color to white, select the linear Gradient tool, set the gradient to the previous color to transparent, make the gradient from the top of the selection to the bottom, and deselect. You may need to try a few more times to make the gradient ideal. (Figure 25)

Figure 25

5. After the high light is finished, we will make a darkened tone. Like just now, first select the darkened area with the free Pen tool and convert to a selection, create a new layer 3, set the foreground color to black, and fill the selection with black.

Load the opacity area of layer 1, shrink the selection by 1 pixels, and remove the extra black. Load the opaque channel of Layer 3 and delete it several times until the black pixels in the selection are basically cleared. (Figure 26)

Figure 26

6. After filling the selection of Layer 3 with a black to transparent gradient, deselect. Gaussian blur, with a radius of 3 pixels, and then reduce the opacity of the layer to 46%. Load the selection of layer 1, deselect it, delete the extra soft pixels in Layer 3, cancel the selection.

Now, let's add a little projection effect to layer 1. We've used a lot of layer styles in the previous examples, and most of the button effects are done by hand, which adds a little cosmetic effect. Opens the projection style, reducing the opacity to 50%, the angle is 90 degrees, the distance and the size are 2 pixels, expand to 0%. (Figure 27)

Figure 27

7. Finally, we add text for the button. After you add a text layer in black, move it above layer 1 so that the high light can affect it. Copy the text layer, the bottom of the text layer to fill the same color as the button, layer blending mode for color Dodge, with a radius of 1.0 pixel Gaussian filter slightly blurred, and then reduce the opacity of the layer to 60%. (Figure 28)

Figure 28

In this way, the button's shape is no longer limited to a circle or a square, and you can create buttons of all shapes.