Hello

This is the Tutorial number 49 from the 100 Marathon Tutorial
As i have told you i will try to add a tutorial each day.

Today we will make a MP3 player. or you can use it as a mp3 myspace player of course after you will transform into a flash player



Open a new document in photoshop with a black background #333333
The size of the document can be 500X500 pixels

Create a new layer ( press Ctrl+SHIFT+ALT+N )
Grab the Elliptical Marquee Tool and make a selection



Select Rectangular Marquee Tool ( press on Subtract from selection ) and delete the top and the bottom selection from this circle



Select Paint Bucket Tool and fill this selection with White then add the following layer styles





Duplicate the layer and resize it with a few pixels
Then add the following layer styles







Then Select one more time Elliptical Marquee Tool and draw another selection



Create a new layer ( Press CTRL+SHIFT+ALT+N ) And fill one more time the selection with white with the Paint Bucket Tool
Press CTRL+D to deselect



Add the same layer styles as above





Then duplicate this oval shape and make it a little smaller
basically you will repeat the steps from above but for this time we will use
another shapes



We will add some player buttons
This buttons are very simple and you can do this alone . Just use rectangle Tool and Polygon tool and i am sure you can create some basic mp3 player buttons



Create another selection like in the next image



Create a new layer ( press CTRL+SHIFT+ALT+N )
And after that With The Paint Bucket Tool Fill the selection with White

The go to Filter > Render > Difference Clouds



Now go to Filter > Sketch > Chrome
Set the detail to 7 and smoothness also to 7 and press OK
Change the Layer blending mode to Overlay



Now we will add some other details. For example i will add a shape under player controls, then i will add the following layer styles







This is my result



Now add some text



Then Create a Spectrum Analyzer . this is very simple job. Grab Rectangle Tool and make a small rectangle and after that duplicate this rectangle and place it like in the following image



Make another selection



Create a new layer ( press CTRL+SHIFT+ALT+N )
Then Fill the selection with the following pattern
( more about patterns you can find here : http://www.talk-mania.com/showthread.php?t=37 )



Then change the opacity for this layer with pattern to 20 %



We will create a Equalizer

This is also very simple. Choose Line tool ( set the weight to 3 pixels )
and make some line like in the next image

Add the following layer styles for this lines









this is my result



With rounded rectangle tool i will create some other buttons for equalizer



This is my final result



I hope you will like this tutorial. To be honest i don't like it to much, but i am very tiered and i don't want to start another tutorial

Labels: Custom web design, Web Design And Maintenance, web site design