Showcase and discover digital art at yex

Follow Design Stacks

Subscribe to our free newsletter to get all our latest tutorials and articles delivered directly to your inbox!

MP3 Player Interface

Make a copy of the layer and make it smaller:

Create MP3 Player Interface in Photoshop CS3

Apply the gradient also:

Create MP3 Player Interface in Photoshop CS3 

Create MP3 Player Interface in Photoshop CS3 

Create MP3 Player Interface in Photoshop CS3

Next select the Blending Options>Inner Shadow:

Create MP3 Player Interface in Photoshop CS3 

Create MP3 Player Interface in Photoshop CS3

Blending Options>Drop Shadow:

Create MP3 Player Interface in Photoshop CS3 

Create MP3 Player Interface in Photoshop CS3Blending Options>Stroke:

Create MP3 Player Interface in Photoshop CS3 

Create MP3 Player Interface in Photoshop CS3

The button is finished. We have to make the flare now. Make a copy of this layer and turn it over the way it is represented next image:

Create MP3 Player Interface in Photoshop CS3

Apply the gradient:

Create MP3 Player Interface in Photoshop CS3 

Create MP3 Player Interface in Photoshop CS3 

Create MP3 Player Interface in Photoshop CS3

Make a copy of our button:

Create MP3 Player Interface in Photoshop CS3

Make several copies now of the button and turn them over. Press on Free Transform option and select the Flip Horizontal:

Create MP3 Player Interface in Photoshop CS3

Insert the figures on the buttons now (the color’s code is #9ED1E4)

Create MP3 Player Interface in Photoshop CS3

Represent now a small stripe under the buttons with the Rectangle Tool (U)

Create MP3 Player Interface in Photoshop CS3

Enter the Blending Options>Gradient Overlay and set the parameters from next table:

Create MP3 Player Interface in Photoshop CS3 

Create MP3 Player Interface in Photoshop CS3 

Create MP3 Player Interface in Photoshop CS3Make a copy of the stripe and place the copy under the neighboring buttons row:

Create MP3 Player Interface in Photoshop CS3

The Ellipse Tool (U) will be helpful in making roundness between the buttons’ rows with the same gradient’s parameters the stripes have:

Create MP3 Player Interface in Photoshop CS3

Using the Rounded Rectangle Tool (U) with 30 px, try to make one more button:

Create MP3 Player Interface in Photoshop CS3

Blending Options>Gradient Overlay:

Create MP3 Player Interface in Photoshop CS3 

Create MP3 Player Interface in Photoshop CS3 

Create MP3 Player Interface in Photoshop CS3

Represent one more button inside:

Create MP3 Player Interface in Photoshop CS3

Blending Options>Gradient Overlay:

Create MP3 Player Interface in Photoshop CS3 

Create MP3 Player Interface in Photoshop CS3 

Create MP3 Player Interface in Photoshop CS3

Page: 1 2 3 4 5

Comments