Digital media player design

May 7th, 2008 by ART-D Posted in Adobe Photoshop, Designing

Make a copy of the top part of the media player’s panel.

Create Digital media player design in Photoshop CS3

Create a new layer above the made copy and mark out both layers. Then press the combination of buttons CTRL+E. Using the Free Transform solution, try to turn around the copy and place it the way demonstrated next image:

Create Digital media player design in Photoshop CS3

Make copies of the layers containing the pointers and then choose again the Free Transform solution for positioning the copies the same way from below:

Create Digital media player design in Photoshop CS3

Using the Pen Tool (P), try to represent the pointers indicating the play list’s rolling. The layer has the color #36373C

Create Digital media player design in Photoshop CS3

Make a copy of the close button and select the Free Transform option to place the copy the same way demonstrated below:

Create Digital media player design in Photoshop CS3

Insert the tracks’ titles and their duration.

Create Digital media player design in Photoshop CS3

movie 01

Create Digital media player design in Photoshop CS3

the titles for the rest of the tracks.

Create Digital media player design in Photoshop CS3

On the last stage we should introduce the name of the play list’s panel, applying the next shown demands:

Create Digital media player design in Photoshop CS3 

Create Digital media player design in Photoshop CS3 

Create Digital media player design in Photoshop CS3

The media player is finished!

View full size here.

Post Pages: 1 2 3 4 5 6 7 8

  • k0lpaz

    30/09/2009

    after you design this player in CS3 my question is, how you can give it “life”, how can you create from this a 100% working player?

    if i use java can i insert this skin to work with?

  • Steven

    30/10/2009

    Now that I have created my music player using PS, how do I apply the working functions i.e. songs, stop, play, scroll, etc

  • Omar

    09/12/2009

    Guys, you have to “give it life” with a programming language, Java, ActionScript, C#, C++.. much more. This is simply a tutorial on how to design one.

  • anna marie

    15/01/2010

    where can i get the picture from above?