Vista Button Tutorial

In this tutorial you will learn how to create a vista button like the ones that appear on the Vista Log-on page!

Step 1: Create a new image 128 x 28



Step 2: Create a new layer and name it base.



Step 3: Select > All then Select > Shrink 2 Pixels then Select > Rounded Rectangle 10%



Step 4: Fill this selection with Vista Gradient 1. Go from top to bottom when dragging the gradient.



Step 5: Select > Grow by 1 pixel, add a new layer, move this layer under the base layer and fill in the same way as step 4 with Vista Gradient 2.



Step 6: Select > Grow by 1 pixel, add a new layer, move this below the layer we created in step 5 and fill with black. Then set the layer opacity to 70 %



Step 7: Choose the brush tool and pick Circle 19 and set the scale to 3X



Step 8: Alpha to selection the base layer by right clicking it and selecting alpha to selection create a new layer, move it to the top, then use your brush and make a spot like the one shown below.



Step 9: Filter > Blur > Gaussian Blur, and set the radius to 50 Pixels



Step 10: Using the rectangle select tool, select the top half of the button and delete. Then set the layer mode to overlay.



Thats it youve created a button just like the one used to switch user on the vista login page. Please comment and tell me your suggestions, comments and outcomes of this tutorial. Thanks!



Note: If you want to fill it with text I suggest you use Sans Bold with a font size of 16




Your Name
Your Email Address
Message