View Cart

How to turn casual photos into artistic watercolor masterpieces in Photoshop

As the title says, this tutorial will help you change your casual family photos and stock images into really cool watercolor designs, which you can use them as cover for albums, Facebook timeline covers, for a creative wedding invitation… you name it!
If you’re familiar with drawing simple shapes with the Path Tool or using brushes at a basic level, this tutorial will feel like a walk in the park. It’s not nearly as hard as it looks, just pay a bit of attention to some details.

Difficulty: Beginner, Intermediate
Completion time: 2 hours
Tools: Photoshop CS3

Resources:

Final Image Preview

Pretty cool, huh? Let’s see how it’s done!

First, start with the composition idea: we’re going to create a watercolor-ish composition with a girl wearing a hat. This means we’ll need to adjust the pose a bit to be in a relaxed state, preferably laid back.
The current position (slightly bent over in front) suggests implication and a desire to act. A simple solution to this matter is to just tilt the image to the left.

STEP 1
Go to File > Open (CTRL+O), select the image and hit OK. Hit CTRL+J to duplicate the layer.

STEP 2
Go to Edit > Free Transform (CTRL+T), rotate the image and hit Enter.

[hidepost=1]

STEP 3
Go to Layer > New > Layer (CTRL+SHIFT+N) to create a new layer and place it between the “background” and “background copy” layers. Hit D to reset the foreground color, then hit CTRL+Backspace to fill the layer with white.

STEP 4
Reduce the opacity of the “background copy” layer to 40% and create a new layer (CTRL+SHIFT+N). Name it “guidelines”. Grab the Brush Tool (B), set the shape to a 2 or 3 px size and start building up a basic outline.

STEP 5
For now, we don’t need the “background copy” layer, you can turn off its visibility. With that out of the way, we can build whatever we want without being influenced by the base picture. The sketch look good so far.

Don’t try to add details to the sketch, it will chew up too much of your time.

STEP 6
Reduce the “guidelines” layer opacity, we’ll be using dark colors and it’s visually difficult to draw over it.

STEP 7
Grab the Path Tool (P) and set it on Shapes. Now we can start drawing the basic shapes, starting with the face outline. Try drawing shapes similar to the ones below.

To make sharp anchor points, ALT+click the point after you’ve placed it. To revert it to rounded, SHIFT+click it.

STEP 8
Continue adding wavy shapes for the hair.



STEP 9
The colors tones are similar and don’t really stand out much, we need something to make each element pop out. In this case, a white Stroke will do just nicely.

Click the “fx” button in the Layers palette and select “Blending Options…”. Check the Stroke setting, set it to white (#000000) and “Inside”. Hit OK.

STEP 10

Hold the ALT key and click-drag the “fx” icon near the layer thumb onto the other shape layers.
This will create a copy of this effect and apply it to the target layers.

STEP 11
Draw more shapes in more blue tones (3 or 4 should do nicely) until the hair is completely covered. If you don’t have experience with drawing hair, don’t hesitate to use a reference image.

 

STEP 12

Draw even more wavy shapes, while varying the blue tones. To change a shape’s color, double-click its layer thumb and click on a color to copy it. Use CTRL+[ and CTRL+] to set them above or below other layers.

 

STEP 13
Repeat this process for the other side of the hair.

 

STEP 14
At this point, it looks flat and boring, let’s add some texture to these shapes!
Double-click the .ABR file to load the brushes into the Brushes palette and hit F5 to toggle it.

 

STEP 15
Grab the Selection Tool (V) and CTRL+click a shape to make it the current layer, then go to Layer > New > Layer (CTRL+SHIFT+N). ALT+click between the layers to create a clipping mask.

 

STEP 16
Grab the Brush Tool (B), select a brush from the Brushes palette (F5), press [ multiple times to reduce its size and click over the shape you’ve selected. Use a bright color, preferably white.

 

STEP 17

Repeat STEPS 15 and 16 for the rest of the hair.

 

STEP 18
Grab the Path Tool (P) again and trace the hat. Build it from two shapes. Also, draw two simple shapes over the eyes. The dark tones will make the eyes stand out more.


 

STEP 19
Now we have some cool, textured shapes, but we still want the girl’s face in the composition. Remember that “background copy” we turned off? Turn its visibility back on, duplicate it, select it and hit CTRL+SHIFT+U to desaturate it (Image > Adjustments > Desaturate) and the Opacity back to 100%.

 

STEP 20
Hit CTRL+L to open the Levels window. Use the settings below. Remember we’re only interested in showing the eyes, the nose and the lips, that’s why we need such a strong contrast.


 

STEP 21
In the Layers palette, click the “Add Vector Mask” button. Grab the Brush Tool (B), set the shape to a soft round brush and paint over the areas shown below.


 

STEP 22
Select the layer labeled “Guidelines” and duplicate it (CTRL+J). Set the Opacity back to 100% and erase the sketched areas for the hair and face outline using the Eraser Tool (E).

 

STEP 23
Grab the Brush Tool (B), set the shape to a soft round brush of 2 px at 60% Opacity and draw soft strokes around the eyes, nose tip and lips, just enough to enhance them.

 

 

 

STEP 24
Let’s make the eyes stand out a bit!
Grab the Selection Tool (V), CTRL+click the one of the shapes over the eyes and go to Layer > Layer Mask > Reveal All. Grab the Brush Tool (B) and paint with white over the eye.
Repeat this step for the other shape.

 

STEP 25
Create a new layer (Layer > New > Layer) and set its Blending mode to “Color”. Now grab the Brush Tool (B) and paint over the iris with a bright blue. Rename this layer to “Eye color”.

 

STEP 26
Create another layer and draw a few transparent blue and white strokes, then line the top eyelid with a strong black.


 

STEP 27
Open the watercolor texture. Hit CTRL+A to select the entire canvas, copy it (CTRL+C), hit CTRL+Tab to switch to our document and paste it in. Resize it and hit Enter.

Set its Blending mode to Soft Light at 50% Opacity. Also add a layer mask (Layer > Layer Mask > Reveal All).

 

STEP 28
With the layer mask selected, paint with black over the entire face (we don’t need texture on it).
The difference will hardly be noticeable, but it will be there.

 

STEP 29
Select the “background copy” layer and hit CTRL+SHIFT+] to make it the top-most layer. Set its Blending mode to Overlay at 70% Opacity and add a layer mask (Layer > Layer Mask > Reveal All).

 

STEP 30
Grab the Brush Tool (B), set the shape to a soft brush with 60% Opacity and paint over the areas shown below.

 

STEP 31
Select the layer above the “background” layer and create a new layer (Layer > New > Layer). Grab the Brush Tool (B), set the Opacity to 10%, Flow to 30% and Hardness to 100% and add tones of yellow, orange, green, purple and blue, like below.

Use yellow and orange for lights and blue and green for shadows. For the face and eyeballs, try using light pink tones and really soft orange ones.

[/hidepost]

STEP 32

Add a paper texture in the background, just like you did with the watercolor texture.
Now select the top-most layer and go to Layer > New Adjustment Layer > Gradient Map, Brightness/Contrast and Hue/Saturation.

 

STEP 33
With the Hue/Saturation layer selected, hit CTRL+ALT+SHIFT+E, then go to Filter > Other > High Pass. Set it to 1 px, hit OK and set the layer Blending mode to Overlay.

Done!

0saves
If you enjoyed this post, please consider leaving a comment or subscribing to the RSS feed to have future articles delivered to your feed reader.

You might be interested in the follwing:

8 Responses

Jerry

LOL! “Technical naivety” is a great way to debrsice it Alan! As I was painting this thing, I considered going online to reference some actual tanks, but it really wasn’t meant to be anything but a fun diversion, so I didn’t really see the point. Then I had the brilliant idea to pretend it was some sort of cliche post-apocalyptic scene and that someone had tricked out an old tank with random video screens and inexplicable undercarriage lights. :)Thanks though for the comments about the lighting and textures. The main reason I do these things is to work on stuff like that.

Photoshop VIP ☞ Photoshopマジック、すごいチュートリアル、使い方20個まとめ 2012年7月度

[…] Photoshopでイメージ写真を水彩画風に加工する方法  […]

Stacey

I didn’t get the brushes in the download. 🙁

Carlie

I don’t know how to register for this site… I bought the tutorial but it doesn’t come with actual instructions or brushes. Freakin’ rip off in my opinion.

Melaine

Thank you for another excellent post. The place else may just anyone get that type of info in such an ideal way of writing? I have a presentation subsequent week, and I’m on the search for such info.

Clipping Path

thanks for google who send me to your site and your great post. This is a nice blog.

Designline

great lesson 🙂

پرده برقی

It was very good thank you

Leave a Comment

Your name:
Your email:
Comment:

PRICE: $10
buy-now
 
File details
  Date:
Jun.22, 2012
  Filesize:
[download id='191' format='filesize']
  Type:
PSD
  Items:
1
  License:
Royalty-free
  Category:
Photoshop
  Downloads:
[download id='191' format='hits']

Tags: , , ,