Digital media player design

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

This tutorial walks you through the steps of creating a really cool looking video player using Adobe Photoshop CS3. It is illustrated along the way for clarity.

Start working by creating a new file (File>New) with 478×600 px and 72 dpi.

Create Digital media player design in Photoshop CS3

Using the Rectangle Tool (U), it’s possible to represent the background of the picture to be.

Create Digital media player design in Photoshop CS3

Set the next parameters on the made layer by clicking on this layer on the layers’ palette.
Blending Options>Gradient Overlay

Create Digital media player design in Photoshop CS3

Gradient’s parameters:

Create Digital media player design in Photoshop CS3 

Create Digital media player design in Photoshop CS3

Next we must download out of Internet a kind of picture, like the one from below:

Create Digital media player design in Photoshop CS3

Insert the picture on the made background by a new layer:

Create Digital media player design in Photoshop CS3

Select the next shown parameters for the picture’s layer: Fill 55%
Blending mode-Soft Light

Create Digital media player design in Photoshop CS3

Now we shall create the primary layer of the media player’s screen, choosing for this operation the Rounded Rectangle Tool (U) with a radius of 5 px.

Create Digital media player design in Photoshop CS3

The layer’s parameters: Fill 0%
Blending Options>Gradient Overlay

Create Digital media player design in Photoshop CS3

Gradient’s parameters:

Create Digital media player design in Photoshop CS3

  •  

  •    
  •  

 

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?

  • miss Jay... Gabz.. Botswana

    22/10/2010

    you only tried to do the interface of which is not convincing i nid a media player of action script 2.0. thanks

  • Duma

    25/07/2011

    iv got a C# code for an MP3 player…. i just need to design the interface… now on this tutaorial.. how do i make everything to be an object? like button to be clickable, etc.. email prodkm.soka@gmail.com