Creating a watercolor effect

In this tutorial, the amazing Aliaksandr Stsiazhyn (aka ‘Spotblind’ on iStockphoto.com) is here to teach us the secret behind his lovely watercolor style vectors. Check out more of his work on his website, www.spotvector.com, and his iStock portfolio, www.istockphoto.com/spotblind.

Tip: If you’ve never played with watercolors, it may be a good idea to pick up a cheap set and experiment. Try adding more color and more water. Seeing how real watercolors look will be very helpful when recreating the look with vectors!

Getting Started

To start, you will need a line drawing. The more detailed it is the better. For this tutorial we’ll use a floral drawing. I use a Wacom tablet for these kinds of drawings because you don’t want the lines to be too perfect (this takes away from the style!). Here is our flower sketch on a white background:

Flower 1

Our next step is to fill in the drawing with really light washes. We’ll start out with drawing some scraggly edged shapes under our sketch, one shape for each area we want to color. In real life, watercolors ‘bleed’ a lot, you don’t need to worry about coloring outside of your sketch!

Coloring and Gradients

Now we’ll start to color each shape with a gradient that blends into white:

Flower 2

Here is how the shape would look if it had an outline. Note that the edges don’t have to be perfectly smooth:

Flower 3

Adding Shading

Here comes the tricky part. When you paint with watercolors, to make an area darker you’ll go over the area with another color, after it’s had some time to dry. Blues and greens work particularly well, so let’s add these shades to our pinkish flowers and pale green leaves. Draw new ‘scraggly’ shapes for your shading, and color them darker blue/purple for flowers, and blue/green for the leaves. We’ll manipulate these gradients so it looks like they blend into each other:

Flower 4

Flower 5

Finishing Touches

After all the shades are drawn, it’s a good idea to add some “accidental” bleeds that supposedly happened while you were painting. This makes the vector seem more “alive”:

Flower 6

Here is our final illustration!

Flower 7

> Purchase this file on iStockphoto.com

© Aliaksandr Stsiazhyn, 2009

7 thoughts on “Creating a watercolor effect

  1. rusty says:

    I followed the link from http://www.illustrationinfo.com and came to your side. You have useful info here! I’m following your blog! :)

  2. Jules says:

    Thank you so much for these tutorials – they are the best I have seen and perfect for a beginner like me :)

  3. wow, fantastic tutorial!! Have to try this out!

  4. [...] in Illustrator, and I finally got off my butt to do it recently. After searching the net, I found this tutorial. It had a good way to make a faux look, so go check it [...]

  5. Very Useful! Keep them coming!!!

  6. Pierdelune says:

    I love watercolor . I tried before with vector but really don’t succeed very well. I will try your way.

    Thanks a lot

  7. Nishan Sothilingam says:

    Excellent

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: