How To Make a Glossy Vista-style button in Photoshop

Hi all, so now, what we're gonna make is another button that is Vista-style. The color scheme on this button is what you'll usually see on a button in Window's Vista Operating system, as shown below.

So let's get started. For this tutorial, we'll use photoshop, although other graphics editing softwares are equally capable of accomplishing this button too.

Choose the Rounded Rectangle tool as shown. We'll make an almost oblong shape by increasing the rounded corner radius.

In this example, we set the corner radius to 30 px, which in this example make both ends of the Rounded Rectangle seem like ends of an oblong shape.

Now, click and hold, then drag a shape on the canvass or the workarea and you should get a shape similar to the one above. After releasing the mouse button, right click on the shape and "Make New Selection" on it.

After that, choose the "Gradient" tool as shown above. If a "Paint Bucket Tool" is shown instead, click and hold your mouse over that tool and it will show a submenu showing the Gradient tool.

Choose "Color black" then the first gradient option from the upper left portion as shown above. You should have "Black to White Gradient".

Apply the gradient to your selection from Bottom to Top so you will have the effect as shown above. 

Now, we will have to select another selection to make the glossy parts of the button now. But before doing so, choose the "Selection Tool" or press its shortcut key of "M". Then choose the selection option of "Intersect" as shown on the image above. 

After doing so, make a rectangular selection on the upper half of the button. Because we have selected "Intersect", the points of intersection of the old selection and our rectangle selection will be our "New" selection.

This is our new selection. 

Now choose color "White" from the color palette. Then choose the "Gradient" tool with the second gradient option shown above, which is in this case, is "White to transparent".

Apply the gradient to the new selection, this time, from Top to Bottom to get the desired effect as shown.

You can add a blending option such as "Stroke" with a color similar to the color scheme of the button, you decide.

After adding some text, we finally got the Vista-style button.

I hope you enjoy this tutorial! Write me a feedback! Thanks!