Windows Media Player style buttons 1

468

Joey Durham

743

11236

01-11-2008

Description

Windows Media Player style glossy buttons for user interfaces.

Tutorial

1. Getting the shape

Draw out 2 circles with a dark fill: #555555. One circle being larger than the second. Then add a shape filled with black to connect the 2 circles. See Figure 1.



Figure 1: Background

2. Pen Tool

Add 2 anchor points to the shape with your Pen Tool then adjusting the control handles to get a curved shape.



Figure 2: Background

3. Copy the shape

Copy (or Clone)the black shape and flip vertically and align it. Now we have the shape of a key hole.



Figure 3: Background

4. Union

Select all 4 shapes and go to: Modify> Combine Paths> Union



Figure 4: Background

5. Shrink

Shrink to size, add a solid color and inner shaddows like below. Add some button shapes.



Figure 5: Background

6. Final Result

Add a bar.



Figure 6: Background