Although there are probably a few uses for designing this from scratch, my hope in writing this tutorial is to show a few techniques so you can design your own objects from scratch. For what? You tell me. But I see them all over the internet. Tutorial tip: as always, create a new layer for each part.

Step 1
Create a rounded rectangle (under the Shapes tool-category) with a radius of around 4px and dark gray (#282828). The radius is a measure of how rounded the corners will be. Rasterize this layer (Right Click >> Rasterize Layer) so that you can edit it more easily. Rasterizing is going to be a pretty important part of this tutorial so keep that in mind.

Step 2

Next you’re going to grab your Dodge Tool (it’s in the same tool-category as Burn and Sponge). Set your brush to around 200px, 20% exposure, and range to Highlights. Now, to your liking, create a light difference (this is the light reflection and makes it look like shiny plastic).

Step 3

Now draw your TV area. It will, of course, be inside of the plastic TV frame…but by how much is up to you. Keep in mind that there is usually a black outline around the lit-up display area..so account for that in your selection. So, three things on this step. 1: Draw the screen area. 2: Stroke the selection (Double Click to access Layer Properties >> Stroke) with around 8px, inside (so that the corners are ‘right’ and not rounded), and black. 3: Add an outer glow to make the outside plastic part look beveled (3d).  Play with the glow to get it how you want it but I would suggest using the Overlay blending method and a white glow.

Step 4

Now on to the speakers. The instructions for this stepare… 1: Duplicate the plastic tv outline layer. 2: Drag the new layer so that it is below the plastic tv outline layer (in the layer menu). 3: Move it so that it is actually below the tv (on the canvas). 4: Change the color (Layer Properties >> Color Overlay) to #c6bdbd. 5: Rasterize the new speaker layer.

Step 5

1: Add an inner glow of around 4px (play with it). 2: Add a stroke (2px, position: inside, and #bab0b0). 3: Create a new layer and draw a vertical white line in the center of the speakers (using a 1px pencil). If you’re worried about finding the center, grab the ruler (Control + R) and use some math (mind or paper depending on your math-giftedness) to find the exact location.

Step 6

If there is a hard part to this tutorial this is it – simply because it’s all feel. Youre going to be using a combination of your Dodge and Burn tools to create the shiny, 3d look that the vizio speakers have. Use a photograph as a reference.

Step 7

Now we create the shadow below the tv onto the speakers. 1: Grab your Elliptical Marquee Tool (in the different selection shape tool menu) and draw a wide ellipse, the opposite of which you would like the shadow to be. 2: Once you have this selection, invert the selection (Control + Shift + I), and fill in with black/gray (on a new layer). 3: Select to the right of the white line and delete.

Step 8

Delete everything that makes sense to delete, duplicate and mirror your current half-shadow, and lower the opacity of these layers until you’re happy with your shadow.

Step 9

This is sort of like the tricky speaker step, but way less difficult. The first stand is simply a black square. The second (and lower) stand is another rounded rectangle which has been Dodged in the middle (large 250px brush) and on the edges (small 30px brush) and then Burnt on the top and bottom with a very small brush (10px). Of course you must rasterize the shape before you can edit it.

And that’s it. You can add whatever you’d like to the screen and could add a logo if you want. Thanks for reading