I have been living without a TV set for exactly three years and 8 months now. It’s great and I don’t miss a thing. Don’t get me wrong. I loved every awful program, every commercial, every useless newscast, but it was time for me to get on with my life. Like many other people, though, I love vintage appliances and cherish the memories associated with the old TV set we had when I was a kid. To celebrate that I decided to create a fun little icon in Adobe Illustrator.

Final result

Soundtrack

My tutorials usually feature soundtracks. I couldn’t help but select “I’m the slime” by Frank Zappa for this one.

Audio clip: Adobe Flash Player (version 9 or above) is required to play this audio clip. Download the latest version here. You also need to have JavaScript enabled in your browser.

Step 1: Creating the front

Open a blank new document and create a brown rectangle:

Make a copy of it and paste it in front, scaling it down. Fill it with a soft radial gradient:

Now select Effects > Stylize > Inner Glow and use these settings:

Now select both rectangles, hit Ctrl+C then Ctrl+F to copy them and paste the copies in front. Hide the first two rectangles to avoid selecting them. With both new rectangles selected go to the Pathfinder palette (to show it hit Shift+Ctrl+F9) and click on Minus Front (second icon from the left, top row):

Select the frame thus created and add a Drop Shadow from Effect > Stylize. Also use the first rectangle we created as a clipping mask for the frame, so the drop shadow is only visible on the inside:

Step 2: Finishing the case

Our icon is shown in frontal perspective so draw a trapezoidal shape to represent the set’s depth:

Draw light yellow lines across the top and bottom edges, applying a tapered calligraphic brush. Set the Blending Mode to Overlay and Opacity to 70%:

Add an Outer Glow effect to both lines:

Step 3: Drawing the control panel

Draw a gold yellow rectangle and add a left Drop Shadow:

Next create an irregular shape like in the next image:

Make a copy of the panel, remove the drop shadow then subtract the irregular shape from it. Reduce the Opacity to 40% and choose the Screen blending mode. The panel now has a reflection:

Step 4: Creating the screen

Draw a rectangle and add a gray-green radial gradient:

Go to Effect > Stylize > Round Corners:

Go to Object > Expand then add a 3px white stroke, aligned with the outside:

Expand again and ungroup the object. Select the white outline, give it a soft vertical gradient from light gray to white, then add an Outer Glow effect:

Step 5: Adding reflections to the screen

Draw a white ellipse on top of the screen. Move it up so it roughly covers its top half. Clip it with a copy of the screen. Set it to Soft Light, 65% Opacity:

Let’s add a couple of blurry highlights. Draw a white circle on the top right corner of the screen, go to Effect > Blur > Gaussian Blur and choose a high value. Then copy it to the bottom left corner, squash it vertically, rotate it about 45 degrees. Set both highlights to Overlay mode and play with the opacity until you find a suitable value:

Step 6: Adding a wood texture to the top

On a new layer draw some horizontal fiber-like shapes. Give them a brown fill darker than the top of the TV set. If necessary duplicate them. Reduce their opacity to 50%:

Squash the fibers vertically to fit them over the top of the TV then use a copy of the top panel as a clipping mask:

To finish off the top let’s add a reflection. Draw a wedge shape on top of the fibers, set it to Screen mode and reduce its opacity to 25%:

Step 7: Creating the legs

Our TV sits on two short legs. Start with two ellipses placed on top of each other, slightly apart. With the Direct Selection Tool (A) select the top anchor points and delete them. Finally connect the two curves with vertical lines:

Place the leg beneath the case and add a golden gradient. To simulate the shadow cast by the TV box, copy the leg and paste it in front. Give it a vertical, dark brown-to-transparent gradient and set it to Multiply, the standard blending mode for shadows. Group the two objects and duplicate them to the other side. The legs are done:

Step 8: Creating the knobs

Old TVs have two knobs: one for turning it on and off and setting the volume, one for selecting the channel. Let’s create two knobs with simple circles.
Draw a circle on a new layer, on top of the control panel. Add a gray radial gradient to simulate metal:

All knobs must be shiny! Draw two symmetrical triangles and group them. Make a copy of the circle, making sure it’s placed under the triangles in the layer stack. Now subtract from it the triangles with the Minus Front command explained before. Apply a solid white fill to the resulting shape and add a 10px Gaussian Blur effect:

To complete the knob make a couple of copies of the bottom circle, scaling them down and adjusting the gradients. Add a drop shadow to the bottom circle. Group all objects and place a copy below. Don’t you love things with two knobs on them?

Step 9: Creating the speaker grille

What would a vintage TV set be without crackling sounds coming from a dingy speaker grille?
On a new layer draw a pale yellow rectangle directly below the knobs. Go to Effect > Stylize > Round Corners and choose the value that best suits your design:

Now let’s precision-drill a bunch of holes in the grille plate.
Start by drawing a dark brown circle smack in the top left corner. Copy it over to the other corner. Select both circles and make a blend with 4 steps. Go to Object > Expand to turn the blend into a regular group. Copy it to the bottom of the plate. With both groups selected make another blend, this time specify 6 steps. Expand again and the grill is done:

Step 10: Finishing touches

The TV set is just about done. Just add a shadow below it to make it sit better, maybe a bit of depth to the speaker grille and of course personalize the screen with your custom graphics. I put my logo in with some cool lines. Isn’t it a perfect icon for your website?

I hope you enjoyed making this icon as much as me. If you liked this tutorial share it with the world, ok? Thanks and if you have any questions just comment!