Draw the iPod Nano

Draw the iPod Nano
Im going to show you how to draw the iPod Nano in Photoshop in a few easy steps. You'll need to click some of the preview images below to view them full size.
Below you can see the finished product.

draw an ipod nano Sigsource

1) The Shape
Take the rectangular marquee tool and draw out a rectangle the same shape as the one below and fill it with the colour; 13181E

Next we need to chop off the two top right angled corners as the new Nano isn't totally rectangular in shape.
To do this grab the Pen Tool and mark out a selection similar to that below. To get the dotted selection, after tracing your path with the pen, right click and choose make selection. Once you've drawn out the shape, hit backspace to delete it from our black rectangle. Do this for both sides. It may take a few attempts to get both sides as symetrical as you can but its worth the patience.

Once you've done that your rectangle will look like the one below. Its not much yet, but bear with me!

2) The Lighting
Onto creating that realistic lighting! To give the Nano that 3d look grab theRectangular Marquee tool again and draw out a selection down the entire side of the Nano. Click the image below to view.

Now fill this selection with white, and then head to Filter > Blur > Gaussian Blur and set it to 2.2px. This forms the basis of the 3d look.

Duplicate this layer (right click it on the layers palette and click duplicate) and drag it over to the other side of the Nano. Play with the opacity till it looks something like below.

Now we need to add a nice little touch. Hold Ctrl and click on your first black rectangle layer, a selection will appear around it. Create a new layer, press G(gradient) on your keyboard and select the color 21272E Drag diagonally in the direction/area shown below

3) The Screen
Use this screenshot of the Nano's screen and paste it into your document. Name it 'screen'.

Postition it over the Nano your making and press Ctrl + T. Scale the screen down to the right size by holding Shift + Alt, this ensures the screen scales down in proportion. Finally position it in the correct place.

We now need to draw a slightly rounded grey layer behind this screen to make it stand out. Make a new layer behind your layer titled 'screen' and drag out a selection the same width from the edge of the screen as shown below.

Now go to Select > Modify > Smooth and choose 2px. Fill this with the color; 46474B

4) The Wheel
Time to create that all important wheel. Click and hold on the Rectangular Marquee tool and choose the circular option.

Hold shift and drag out a circular marquee, make it of similar size to the one below. If you hover inside the selection you should be able to click and drag to reposition the circle into the correct position over the Nano.

Fill this selection with the colour 2A2E37.

Now click the 'Add a new layer style' button (shown below) on the bottom of the layers palette making sure your circular layer is selected and choose 'Gradient Overlay'. Apply the following settings (second image below).

We now need to create the button in the middle of the wheel. This time create a smaller circle, remembering to hold shift to make it symetrical. and fill it with the color 111418. You should now have something like this;

It looks pretty flat at the moment so to make it more button like add aGradient Overlay with the following settings.

5) The Icons
For the play/stop, skip forwards, backwards, and menu icon use these images. The font that closest matches the one Apple use for 'Menu' is Delicious. You can find it here.

Copy and paste them into Photoshop and press Ctrl + T, then hold Shift + Altto scale them down proportionally. Position them in the correct place on the wheel. You may need to use the eraser tool to cut out parts of the background colour that don't match. It should now look something like the one below.

6) The Reflection
For the classic Apple reflection:
• go to Layer > Merge Visible at the top of your screen.
• Right click the merged layer and choose duplicate
• Press Ctrl+T
• Right click and choose 'Flip Vertical'
• Postion the flipped Nano directly under the original (shown below).

Select the Rectangular Marquee tool and give it a feather of 20px.

Drag out a selection like the one below over the flipped Nano

Now press backspace (a number of times) to blend and create the reflection. You may need to reposition your selection to get an even blend. Lower the flipped Nano layer opacity to between 3% and 10% and there you have it! This Nano could be used on your site, or even scaled down and used as a nifty forum avatar!