Stencil_Art

Create Photoshop Stencil Art – Psd Premium Tutorial

By: Mark Mayers

Urban art has fast become the de-facto graphic style for practically all things associated with youth culture; extreme sports, such as skateboarding, clothing and music industries have all been heavily influenced by its gritty, low-brow appeal. So in today's tutorial, I'll show you how to re-create a popular style of stencil graffiti art without getting your hands messy or winding up in jail!

Final Image Preview

Let's take a look at the image we'll be creating.

Tutorial Details

• Program: Adobe Photoshop CS2+
• Difficulty: Intermediate
• Estimated Completion Time: 2 Hours

Resources

You'll find some files in the "source" folder. You'll also need the following stock photography to complete this tutorial.

• The medium version of the rap artist
• The medium version of the DJ
• The medium version of the disco girl
• Speaker
• The medium version of the girl DJ
• Grunge wall one
• Grunge wall two
• Grunge wall three
• Grunge wall four

Step 1

Open the rap artist photo. Because the image has a plain background, it's going to be a relatively simple task to isolate the figure.

Grab the Magic Wand Tool (W) and select the Add to selection in the Options bar, then set the Tolerance to 30 and also check the Anti-alias and Contiguous buttons. Now click on the background to make an initial selection, then continue clicking the remaining background areas to add to the selection.

Step 2

Hit Shift + Command/Ctrl + I to Inverse the selection, then Command/Ctrl + J to copy the selection as a new layer. Now disable the visibility of the "Background" layer to view the image in isolation and save, preserving the layers to a convenient location.

Step 3

The DJ image also has a plain background, but because of the overexposed areas around his arms; and the fact want don't want the cable around his neck, paths are the only option to accurately isolate the figure.

Set the Pen Tool (P) to Paths, then check the Add to path area in the Options bar. Now draw closed path around the figure as indicated in red, excluding the protruding cables around the upper neck. Next, select the Subtract from path area option to plot the inner sub-path for the left arm.

Remember, you can fine-tune your path at any time by holding the Command/Ctrl key to access the Direct Selection Tool to adjust individual direction/anchor points as required.

Step 4

Command/Ctrl-click your path thumbnail to generate a selection, copy as a new layer and disable the visibility of the "Background" layer as before. Add an empty layer at the top, then Command/Ctrl-click the middle layer thumbnail (or path) to generate a selection.
Next, set the Clone Tool (S) to Current & Below and remove the upper cable using a medium, soft-edged brush. Don't sweat over perfection here, because any fine detail will be lost when the stencil effect is applied later. Now hit Command/Ctrl + E to Merge Down the retouch layer, then save, preserving layers to your preferred location.

Step 5

Next, we'll use a combination of techniques to extract the disco girl. First, go to Select > Color Range, click anywhere on the yellow background with the eyedropper, set the Fussiness slider to 150, check the Invert button and hit OK.

Step 6

Switch to your Channels tab and click the Create new channel icon at the foot of the palette. Press D to set the foreground/background colors to their default black/white setting, then hit delete to fill the active selection with white on the new channel.

Step 7

Press X to swap the foreground color to white, then select the Brush Tool (B) and use a medium, hard-edged tip on the new channel to remove the remaining black areas within the figure.

Step 8

Next, we'll increase the contrast of the channel to ensure an accurate selection for the next step; press Command/Ctrl + L to access the Levels dialogue box and change the black point and mid point Input sliders as shown.

Step 9

Command/Ctrl-click the channel mask's icon to load white as a selection, then target the top RGB composite channel. Switch back to your Layers tab, copy as a new layer, disable the visibility of the original layer and save, preserving layers as before.

Step 10

Use the same technique to extract the speaker as you did in Step 1 and save, preserving layers again.

Step 11

We'll use a similar path/channel extraction technique as earlier for the girl DJ. Draw a closed path around the figure, keeping well inside the strands of hair as indicated in red. Now create the inner sub-paths for the headphones.

Step 12

Switch to the Channels tab and cycle through each channel to determine which holds the most contrast for the hair – in this instance it's the blue channel. Drag its thumbnail over the Create new channel icon to duplicate it. Next, apply a Levels adjustment to the duplicate channel and set all three Input sliders as shown.

Step 13

Generate a path-based selection and fill with black on the duplicate channel.

Step 14

Hit Shift + Command/Ctrl + I to Inverse the selection, ensure the foreground color is set as white, then use a large, hard-edged brush to paint over the top and bottom grey areas, but be careful to leave the hair intact.

Step 15

Invert the channel to convert the figure pixels to white. Now activate the visibility of the top RGB composite channel to check the channel mask. At this point you can still modify the channel by painting with either white (to reveal), or black (to hide) as required.

Step 16

Once you're happy, load the channel mask as a selection and switch off its visibility. Target the top RGB composite channel and switch to your Layers tab. Copy the selection to a new layer, turn off the original layer and save, preserving layers to your chosen destination.

Step 17

With all our source files now extracted and saved, let's move on to assembling the composition. Create a new portrait canvas 2008 px x 2835 px in RGB Mode with the Background Content set to Transparent. Next, drag the DJ in as a new layer, label it "Figure 1" and position top centre.

Step 18

Add the disco girl as a new layer and label it "Figure 2", then add the speaker and name it "Speaker 1". Next, hit Command/Ctrl + T to re size and position as below.

Step 19

Place girl DJ as a new layer and label it "Figure 3". Duplicate "Speaker 1", hit Command/Ctrl + T, then hold Control (right-click) to select Flip Horizontal and Shift-drag to the opposite side of the canvas and rename it "Speaker 2". Now place the rap artist as a new layer and label it "Figure 4".

Re size/transform your layers as required, then eliminate any excess, such as the base of "Figure 2" by drawing a rectangular selection and hitting delete.

Step 20

We now need to convert these layers to monotone and also unify their tonal range. The most flexible way to achieve this is to modify each layer non-destructively, rather than using a single overall adjustment.

Target your initial layer ("Figure 1"), hold the Option key and select Black & White from the Create new fill or adjustment layer icon situated at the foot of the Layers palette. Check the clipping mask option in the next window, then select the Green Filter from the Preset drop-down menu in the next dialogue box.

Repeat the process to clip a Levels adjustment layer, then set all three Input sliders as below.

Step 21

Clip the same adjustment layers to "Figure 2", but use the Infrared Black & White Preset and set the Input Levels as shown.

Step 22

Clip a Neutral Density Black & White Preset to both "Speaker" layers, then a clip a Levels adjustment using the same settings to these layers as well.

Step 23

Clip an Infrared Black & White Preset to "Figure 3", then clip a Levels adjustment and copy the settings as below.

Step 24

Finally, clip a Neutral Density Black & White Preset to "Figure 4", then clip a Levels adjustment and copy these settings.

Step 25

Use the Polygonal Lasso Tool (L) to draw a selection around the base of "Figure 4" and hit delete to reveal more of the speakers.

Step 26

Add an empty layer at the top of the stack and name it "Merged", then choose Image > Apply Image and hit OK in the next window to transform the layer into composite image.

Step 27

To keep things organized, target the top "Levels 6" thumbnail, then Shift-click the bottom "Figure 1" thumbnail (this also highlights the sandwiched layers). Now choose New Group from Layers in the fly-out menu situated top right on the Layers tab, then in the next window label it "ORIGINAL FIGURES". You can now delete the empty default layer.
Next, target the "Merged" layer, select Image > Adjust > Posterize and set the Levels value to three – this limits the tonal range and gives us the three solid areas of black, white and grey, which we'll use as a basis for the stencil effect.

Step 28

For a more authentic hand-cut stencil look, we need to simplify the edge detail; go to Filter > Artistic > Cutout and apply the following settings. Feel free to experiment with this filter to produce less or more detail as required.

Step 29

Now apply a further Levels adjustment directly to the "Merged" layer to intensify the contrast.

Step 30

Now select the white areas with the Magic Wand (W) – you may need to choose Select > Similar if you're not successful at first. Now copy the selection to a new layer (Command/Ctrl + J) and label it "White".

Next, temporarily turn off this layer's visibility, then generate a selection from the grays within the "Merged" layer. Add a new uppermost layer called "Blue" and fill the active selection with # 0497bb.

Step 31

The stencil effect still needs further work, but for now we'll start adding some background textures. Add grunge wall one as a new layer below the "Merged" layer and label it "Paper 1". Enlarge to cover your canvas, then use a large, soft-edged Clone (S) brush, set to Current Layer and remove the facial details within the poster.

Step 32

Open grunge wall two and choose Image > Rotate Canvas 90 degrees CCW. Add as a new layer above the previous one and name it "Paper 2". Enlarge to cover your canvas, then change the Blend Mode to Soft Light.

Step 33

Place grunge wall three as a new layer above the previous one and label it "Paper 3". Position top left, reduce in size and change its Opacity to 81%. Add a mask and use a variety of grunge brushes to blend the hard edges into the underlying textures. Now keep things organized and place the three paper layers into a group folder called "PAPER".

Step 34

Temporally disable the visibility of the "Blue" and "White" stencil layers. Target the "Merged" layer and rename it "Black". Select Image > Adjustments > Threshold and enter a value of 128. Now change the Blend Mode to Multiply to eliminate the white areas.

Step 35

Move the "Black" layer to the top of the layer hierarchy. Now change the "Blue" layer's Blend Mode to Linear Burn to reveal the underlying textures.

Step 36

Expand the "PAPER" group folder, duplicate the "Paper 2" layer and position it below the "Blue" layer. Change its Blend Mode to Multiply, then Command/Ctrl-click the "Black" layer thumbnail to load it as content selection, ensure "Paper 2 copy" is the target layer and choose Layer > Layer Mask > Reveal Selection.
Now modify the mask by using a selection of spray brushes to reveal white from the underlying layer – for best results, paint over the key features within the composition.

Step 37

Add a mask to the "White" layer and hide the majority by filling a selection with black using the Lasso Tool (L), then reinstate areas using a variety of spray brushes. Now clone directly on the "Paper 2 copy" layer to make the more interesting textures visible through the transparent parts of the stencil.

Step 38

At this point I wanted some extra canvas at the base to place more textures – this is a straightforward process and can be carried out at any stage during the image creation process. Press Option + Shift + C to access the Canvas Size dialogue box, change the Height to 26 cm, set the Anchor position to the top and click OK. Now place the "Black", "Blue", "Paper 2 copy" and "White layers into a group folder called "GRAFFITI 3".

Step 39

Add grunge wall four as a new layer below the "GRAFFITI 3" folder and enlarge/position to cover the bottom left of the canvas. Duplicate, then move right and up to overlap the original. Now use grab the Eraser Tool (E) and use a selection of grunge brushes to blend the seam. Merge the duplicate and name the resulting layer "Wall".
Next, Add a mask, then use the same brushes to erase the upper portion, place this layer within a new group folder called "GRAFFITI 1".

Step 40

Now let's incorporate some photos of street graffiti from the "source" folder for added grit. Place "Graffiti_1.jpg" as a new layer within the "GRAFFITI 1" folder and label it "Writing 1". Change the Blend Mode to Multiply, then apply a Levels adjustment directly to the layer as shown.

To blend the lighter a areas a little better, double-click the layer thumbnail to access the advanced blending dialogue box. Hold down Option and click the top right Blend If slider (to split it) and pull to the left.

Step 41

Place "Graffiti_2.jpg" within the same folder, change the Blend Mode to Multiply, then add a Levels adjustment as below.

Now apply the same advanced blending technique as the previous step.

Step 42

We'll need to extract "Graffiti_3.jpg" from its background before adding to the working file. Go to Select > Color Range, then in the next window click on the darkest blue area. Set the Fuzziness slider to 155, hit OK, then copy the selection to the clipboard.

Step 43

Paste within the same folder and name it "Writing 3", then change the Blend Mode to Multiply.

Step 44

Add "Graffiti_4.jpg" within the same folder, change the Blend Mode to Linear Burn and name it "Writing 4".

Step 45

Use the Color Range method again to select the red paint from "Graffiti_5.jpg" and copy.

Step 46

Paste as a new layer within the same folder, change the Blend Mode to Multiply and name it "Writing 5".

Step 47

Add a new group folder above "GRAFFITI 1" and name it "GRAFFITI 2". Drop a new layer within this folder called "Yellow overspray 1", then use an assortment of spray brushes sparingly over the composition using # cfd443. Repeat on a new layer called "Blue overspray", but use # 19bfdd.

Step 48

Add another layer called "Black overspray" and use a selection of black spray brushes around the outer edges of the figures and speakers – concentrate your brushwork around the base of the central figure, whilst keeping it fairly subtle elsewhere. Now set the layer to Multiply, add a mask, then use a combination of spray and grunge brushes to reduce the effect.

Step 49

Expand the "GRAFFITI 3" folder and add a new layer called "Yellow overspray 2" at the top. Create a layer-based selection from the "Blue" layer, then use some spray brushes to paint some random marks using # fff06e.

Note: If you find the "marching ants" annoying, hit Command/Ctrl + H to hide the visibility of the selection – just remember to deselect when you're done.


Deselect, then place another layer within the same folder and label it "White overspray". Now paint some smaller subtle white highlight sprays.

Step 50

All that remains is to add a "stencilized" logo. This is most effective with logos designed with bold, flat colors. Hit Command/Ctrl + O, then navigate to the "PSD_logo.ai" from the "source" folder to open the Import window. Set the Height to 2 cm, check Constrain Proportions, set the Resolution to 300, the Mode to Grayscale and click OK.

Step 51

Go to Image > Adjustments > Posterize and enter a value of 3.

Use the Magic Wand (W) to select the central grey bar and fill it with white. Now we need to create some "bridges" over the holes or "islands". Use the left arrow on your keyboard to nudge the selection over the "d" and fill with black. Repeat this for the "p".

Step 52

Select Filter > Noise > Median and enter a Radius of 2px to remove the hard corners.

Next, select Image > Adjustments > Threshold and enter 1 to eliminates any grays.

Step 53

Now add the logo as a new layer above the "GRAPHICS 3" folder and position bottom right. This will act as a temporary layer to create the spray paint, so don't bother to name it.

Step 54

Use the Magic Wand (W) to load the white logo areas as a selection, then go to Select > Modify > Expand by 1 px. Switch off the layer visibility, then add a new layer called "White".

Step 55

Now paint using an assortment of small, white spray brushes within the selection. Use the same technique to load the black logo areas, add another layer called "Red" and paint within the selection using # b11b15.

Step 56

Add another layer at the top and paint some red overspray areas – don't worry about obliterating the white areas, we'll fix that in the next step.

Step 57

Use the Eraser (E), again with the spray brushes to remove any unwanted red paint, then hit Command/Ctrl + E to Merge Down. Now add masks to both layers and use the brushes to hide/reveal paint as required. To keep the file tidy, delete the logo template layer and place the two remaining layers into a group folder called "LOGO".

Conclusion and Scope

If you prefer a more hands-on approach, this workflow can be used to create your own stencils for spray painting, or even applying designs to t-shirts using fabric dyes and a paint roller. The next step briefly outlines how to create a three-color stencil using channels. Remember, you'll be cutting these out with a knife, so bear in mind the output size and adjust the Cutout filter accordingly to simplify the outlines.

Once your design is finalized, store each color as black within separate channels – in this case I've used white, blue and black and stacked them in the correct spraying order. You'll also need to add registration marks on each channel (to pencil mark the surface to be sprayed), then label each channel with its corresponding color. This screen grab shows the white channel.

Here's the blue.

And here's the black.

To get an indication of how they sit together, enable the visibility of all three channels.

Now you need to create separate files for each channel. First, target the "White" channel and choose Duplicate Channel from the fly-out menu. Now set its Destination to New and label it clearly. Repeat this for the two remaining colors and print them out on the thickest card your printer will allow (for extra durability get them laminated too).
Finally, use an Exacto knife to cut out the black areas including the registration marks. When all three stencils are cut, you're ready to go – but remember, keep it legal and always use a designated area where graffiti is permitted.