Video icon 64
Upgrade your design skills with practical video courses from Tuts+. Start your free trial today.
Advertisement

How To Draw a Vintage Polaroid Camera Icon

by
Student iconAre you a student? Get a yearly Tuts+ subscription for $45 →

In this tutorial, we will create a Polaroid camera icon. We will use lots of layer styles and draw manually with the brush tool to achieve a realistic appearance. Let's get started!


Step 1: Upper Body

Create new file, with size 600x700 px. Start by creating a rounded rectangle with color: #dbd3co.


Step 2

Hit Command/Ctrl + T to perform transformation. Right click and choose Perspective. Pull lower corner outward.


Step 3

Add following layer styles.


Step 4

Command/Ctrl-click layer to get a selection based on its shape. Nudge selection 1 px up by pressing up arrow. Hold Command/Ctrl + Alt then click layer again to subtract the selection. This process will give you a 1 px selection on top of the shape.


Step 5

Create new layer and fill selection with white. Reduce layer opacity to 60%. Below, you can see the subtle difference before and after adding a 1 px line.


Step 6

Repeat previous step, this time for bottom of the shape. Fill selection with black.


Step 7: Middle Body

Use pen tool to create this shape. Use #dbd3co for its color. Add Layer Style Inner Glow and Gradient Overlay.


Step 8

Duplicate the shape we have just created. Place it behind the original. Use arrow tool to move the topmost points up. Change shape color to #908a7a.


Step 9

The shape is still too light. We need to darken it again to add more depth. Create new layer. Convert layer to Clipping Mask by pressing Command/Ctrl + Alt + G. Paint black on top of the shape.


Step 10

Create new layer. Activate brush tool, in the Option Bar set brush hardness to 0%. Draw a soft white line.


Step 11

Again, paint another soft white lines on indicated areas.


Step 12

Create new layer. Command/Ctrl-click shape. Use soft brush to paint white on each edge. Reduce layer opacity to 9%.


Step 13: Camera Face

Draw a rounded rectangle for front face of the camera. Use #24201d for its color. Add Layer Style Gradient Overlay.


Step 14

Inside previous shape, draw smaller rounded rectangle with color #131611. Add following Layer Styles.


Step 15

Add a small rounded rectangle with color #4a4847 and place it in the middle of the previous shape.


Step 16

Duplicate shape, move it up 1 px. Change its color to #2c2a29.


Step 17

Create a new layer and convert it to Clipping Mask by pressing Command/Ctrl + Alt + G. Draw shadow on top of the shape.


Step 18

Duplicate the shapes by dragging it while holding the Alt key.


Step 19

Draw a black rounded rectangle. See picture below to see its position.


Step 20

Hit Command/Ctrl + T, right click and choose Skew.


Step 21

Pull lower right corner up. Add Gradient Overlay.


Step 22

Duplicate shape. Move it to the opposite side. Hit Command/Ctrl + T to perform transformation. Right click and choose Flip Horizontal.


Step 23

Draw a rounded covering both shapes we have just created. Add Layer Styles.


Step 24

Use type tool to add camera name. Add a subtle Drop Shadow to give it three-dimensional appearance.


Step 25: Lens

Draw a circle to be used as a camera lens. Add Gradient Overlay.


Step 26

Select circle path. Hit Command/Ctrl + C then Command/Ctrl + V to duplicate it. Perform transformation (Command/Ctrl + T) and make it smaller. See picture below to reference.


Step 27

From the option bar, set path mode to subtract.


Step 28

Create new layer then convert it to Clipping Mask by pressing Command/Ctrl + Alt + G. Draw highlight on top of the lens.


Step 29

Create new layer and put it behind shape we have just created. Create circular selection and fill it with black. Soften it by adding Gaussian Blur (Filter > Blur > Gaussian Blur).


Step 30

Draw a circle shape with color #212121. Duplicate shape then move it 5 px up. Set path mode to Subtract.


Step 31

Next, create a ring shape. To create this shape, start with a regular circle shape, duplicate the path and transform it to smaller size. Set path mode to Subtract. Add Bevel and Emboss and Gradient Overlay.


Step 32

We will start drawing inner part of the lens. First, I want you to know that they are just simply lots of circle shapes combined with layer style. Draw a circle shape inside the lens.


Step 33

Again, draw smaller circle shape. Add Bevel and Emboss and Gradient Overlay.


Step 34

Duplicate shape we have just created. Resize it to 98%. Delete all its layer styles and add Gradient Overlay with this setting.


Step 35

Duplicate two circle shapes that we have created in Step 32 - Step 34. Resize them to a smaller size.


Step 36

Draw a bigger circle shape from the same origin. Place it behind other circle shapes. Set Blend Mode layer to Screen, reduce its Opacity to 2%, and add Stroke.


Step 35

Duplicate and resize shape a few times to create more lines. Remember that the Opacity of these shapes is only 2%, very subtle.


Step 36

Draw a circle shape with color #515151 covering the lens. Add Gradient Overlay and reduce its Opacity to 38%.


Step 37

Let's add highlight and shadow to make it more realistic. Create a circular selection covering the lens. Create new group then click Add Layer Mask icon.


Step 38

Create new layer and make sure it is inside the group we have just created. Fill layer with black. Click Filter > Render > Lens Flare. Change blend mode to Screen and reduce Opacity to 15%.


Step 39

Create new layer and paint highlights on the lens. Reduce layer Opacity to 10%.


Step 40

Use smaller brush to draw some lines on the lens. Change layer blend mode to Screen and reduce Opacity to 15%.


Step 41

Draw another layer and draw a small highlight and shadow.


Step 42: Viewfinder

Draw a rounded rectangle with color #1b1614. Add following Layer Styles.


Step 43

Draw smaller rounded rectangle. Add following Layer Styles.


Step 44

Duplicate circle shapes from lens and resize it until it fit inside the viewfinder. Create a new layer on top of the circle and draw some subtle highlights.


Step 45: Button

Draw a green circle shape. Add following Layer Styles.


Step 46

Duplicate the green circle shape. Place it behind the original shape. Resize it to 102%.


Step 47

Draw a ring shape with color #c9c2b1. Add following layer styles.


Step 48

Draw a black circle and put it behind the ring shape. This will add depth onto the ring and make it seems like a hole.


Step 49

Create new layer and place it behind all other button shapes. Draw a soft shadow.


Step 50

Draw a circle shape. Add Layer Styles Outer Glow.


Step 51: Knob

Let's continue with the second button. Draw another circle, this time use #383838 as its color. Add following Layer Styles.


Step 52

Create new layer on top of the circle. Hit Command/Ctrl + Alt + G to convert it to Clipping Mask. Draw lots of 1 px black vertical lines.


Step 53

Draw a darker circle on top of the previous circle. Add following Layer Styles.


Step 54

Draw a ring shape behind the knob and add following layer styles.


Step 55

Draw a black circle behind the ring shape.


Step 56

Use soft brush to draw soft shadow under the button.


Step 57

Draw a circle shape behind the ring. Add Outer Glow.


Step 58: Flash

Draw a rounded rectangle. Add these layer styles.


Step 59

Draw smaller rounded rectangle. Add following Layer Styles.


Step 60

Duplicate shape we have just created. Remove all Layer Styles used. Set Fill layer to 0% then add Layer Style Bevel and Emboss.


Step 61

Draw a smaller rounded rectangle, color: #c6c6c6. Add Inner Glow and Bevel and Emboss.


Step 62

Command/Ctrl-click rounded rectangle layer. Create new layer. Use soft brush to draw some highlights and shadows. See picture below for reference.


Step 63

Draw smaller rounded rectangle. Add Stroke. Change layer's Opacity to 16% and Fill to 0%.


Step 64

Use soft brush to draw more highlights on center of the flash.


Step 65

Create new layer. Draw 1 px black lines. Reduce layer Opacity to 13%.


Step 66

Draw more shadows on top bottom of the flash surface.


Step 67

Create new layer and place it under the flash. Use soft brush to draw flash shadow.


Step 68: Rear Part

Draw a rounded rectangle. Place it behind all shapes.


Step 69

Duplicate shape. Add smaller rounded rectangle and from the option bar set it to Intersect. See picture below for its placement. Add following Layer Styles.


Step 70: AF Light

Draw a circle under the flash. Add Inner Shadow and Outer Glow.


Step 71

Draw smaller circle shape inside previous shape with color #4d4b43. Add Inner Shadow.


Step 72: Camera Label

Draw a rounded rectangle on lower left of the camera. Add Inner Glow and Bevel and Emboss. Add camera name inside the rounded rectangle.


Step 73: Selector

Draw a rounded rectangle on the opposite side. Add Inner Glow and Bevel and Emboss.


Step 74

Draw a rectangle in the middle of the shape. Add Gradient Overlay and Drop Shadow.


Step 75

Activate pen tool. Click lower side of the rectangle to add new point. Use Direct Selection Tool to pull it down.


Step 76

Draw a dark triangle shape.


Step 77

On top of the shape we have just created, draw a dark rounded rectangle. Add Layer Style Stroke.


Step 78

Draw circles and triangle for knob indicator.


Step 79: Colorful Ribbon

Our next step is drawing colorful ribbon across upper part of the camera body. Temporarily, hide flash. First, draw a tall red rectangle. Add Gradient Overlay to avoid flat color and Bevel and Emboss to give it three-dimensional appearance.


Step 80

Duplicate rectangle by Alt-dragging it. Change their color.


Step 81

Group all lines by selecting all line layers and hit Command/Ctrl + G. Command/Ctrl-click rounded rectangle shape that forms upper part of the camera. Click Add Layer Mask icon. Now, the ribbon is inside upper part of the camera.


Step 82

Repeat previous steps to add another ribbon on middle part of the camera.


Step 83

Duplicate shapes and put them on lower part of the camera.


Step 84

For these ribbons, change their Gradient Overlay mode from Screen to Multiply.


Step 85

Select the ribbon group. Hit Command/Ctrl + T to perform transformation. Right click and choose Perspective. Pull lower corner. See picture below for reference.


Step 86

Select lower part of the ribbon. Invert selection by pressing Command/Ctrl + Shift + I then click Add Layer Mask icon.


Step 87

Duplicate colorful ribbon group, resize it, and place it under the previous ribbon. Paint soft white line on some part of the ribbon to give it three-dimentional appearance.


Step 88

Create new layer above the ribbon. Paint black using soft brush with low Opacity to add depth onto the ribbon.


Step 89: Photo

Create new group for the photo. See picture below for reference on its position. Draw rectangular selection in front of the camera. Click Add Layer Mask icon.


Step 90

Use pen tool to draw basic shape of a photo. Add Gradient Overlay to avoid flat color and Stroke to add photo border, which is the characteristic of a Polaroid photo.


Step 91

Grab an image for the photo. I used a photo from sxc.hu. Place the image right above the photo shape. Convert layer to Clipping Mask by pressing Command/Ctrl + Alt + G. The image will automatically goes inside the photo.


Step 92

Command/Ctrl-click photo shape. Create new layer above the image. Draw shadow on the photo.


Step 93

Create new layer and put it under the photo shape. Use soft brush tool to draw photo shadow on the floor.


Step 94: Camera Strap

Use pen tool to draw this shape. Put it behind the camera.


Step 95

Next, draw a big rounded rectangle. Pull two points on lower side up. Add a rectangle path and set it to Subtract mode.


Step 96: Shadows

Create new layer and place it under all layers. Draw a rectangular selection under the camera. Click Select > Modify > Feather, set radius to 35 pixels. Fill selection with black.


Step 97

Use brush tool to draw darker shadow right under the camera.


Final Image

Finally, we have reached the end. Here's the final polaroid camera icon we have just created. I hope you enjoy this tutorial and learn some new techniques.

Advertisement