PixelPerfect #105: Bert recreates an iPod from scratch, making 2-D art look 3-dimensional

Posted in Graphics, Mobile, Podcasts on December 19, 2008

This week, Bert creates an iPod using various elements in Photoshop.

First to create the main body of the iPod, Bert uses the rounded rectangle tool and adjusts the radius control for a more rounded edge. Then, he adds tones by locking the transparency, adding a radio gradient. To give the body texture, Bert uses the texturizer filter in sandstone mode and adds a little noise. Bert then adds curvature of the iPod with a bevel/emboss layer style.

To create the screen of the ipod, Bert uses the rectangle path tool, adjusting the radius, filling it with a black color.

For the center menu button, Bert uses the circle path tool and fills it with black, adding texture with bevel/emboss layer style. To create the smaller center button, Bert uses the circle path tool and clips it to the main body layer to add color/effects. Bert then adds an indentation by adding a layer on top of the button, using a black to white linear gradient. Finally, he clip them together and brings down the opacity. To add text on the menu button, Bert uses the the text tool. He then adds the play/stop controls with the pen tool.

Bert then adds an image of Pixel Perfect on the iPod screen by dragging the image onto the file, and clipping it with the screen layer, then resizing the image to fit.

As a final touch, Bert creates a ground for the iPod in the background layer, by simply adding a linear gradient. To create a shadow of the iPod, Bert clips together all the elements of the iPod, copies/pastes, flips the new layer vertically, drags it to the ground and adjusts the opacity, adding a layer mask.



Watch Video Watch Video Watch Video on External Site

Tags: Photoshop, Design, ipod, Revision3, PixelPerfect