Submit Your Article
Home Articles News Tutorials Videos Add An Article
Topics: Design Photoshop Programming PHP CSS Java Database Web Development Javascript Ajax
– Close + Open

Find Out More About DevWebPro!

Sign up for the newsletter


» Terms & Conditions

Welcome to the New DevWebPro!

DevWebPro Includes:
  Hundreds Of Tutorials   Developer News
  Unique Gadget Videos   Tons of Topics to Discuss
  Expert Advice   We Will Publish Your Articles

Create An Online Radio

Friday, February 20th, 2009
Text: Decrease Font Size Increase Font Size | Print Print Article | Share: Delicious Digg StumbleUpon Post to Twitter Post to Facebook

1. Create a document that’s 300×150, and all of the standard Photoshop settings. Create a black background. Click on the Rounded Rectangle Tool Rounded Rectangle Tool, and set the radius to 30px.Create an image like the one below. Fill it with white, then delete the outline.

Radio Picture 1

2. Then, create a Gradient Overlay, with the settings below:

Radio Picture 1

3. Next, we’re going to create the speakers. First, select your Rounded Rectangle Tool again Rounded Rectangle Tool. Only this time, set the radius to 10px. Fill the rectangle, with this color #7A7A7A. Then, add an Inner Shadow blend, with the settings below:

Radio Picture 3

Now, we’re going to give the speaker some texture. Select the brush tool, and then go to the brushes options, and put in the following settings:

Radio Picture 4

Radio Picture 5

Radio Picture 6

Radio Picture 7

Ok, now create a new layer. Select the line tool Line Tool and make a selection like the one below.

Radio Picture 8

Then right click on the selection, and click Stroke path. In the drop down menu, select “Brush”. Now, delete the path. Take the layer that the brush strokes are on and duplicate, and spread them out evenly across the speaker. It should look like this:

Radio Picture 9

Then, to create the speaker on the left, merge all of your speaker layers down. Then move it to the left side.

Radio Picture 10

4. This step, you’re going to have to some drawing of your own. Grab your pen tool, and create a shape like this, which will be your boombox’s handle:

Radio Picture 11

Fill it with the color of the background. Then add the blending options, from below:

Radio Picture 12

Radio Picture 13

5. Next, we’re going to create the CD player. Grab your Rounded Rectangle Tool Rounded Rectangle Tool again, set your radius to 10px. Make a shape like the picture below, fill it with #5A5A5A. Then create a smaller rectangle inside that one, and fill it with 1D1D1D.

It should look like this:

Radio Picture 14

6. Beyond here it’s up to you how detailed you want to make your jukebox. If you’re using it for site, then what you have should be enough. Here’s what I added to mine, which could still go up on a site as well.

Radio Picture 15

Topics: , ,

Leave a Comment

DevWebPro is an iEntry Network ® publication - © 1998-2010 All Rights Reserved