Design insights & tutorials.

Impressive Watercolor Splatter Effect Tutorial & Freebie

Turquoise Flag-Tip

This guest post was written by Nick Steimling from HeavyPrints . Many thanks, Nick, for sharing your knowledge with Go MediaZine readers!

I have been working with natural media more recently, and as a result, I have been learning how to bring my natural work onto the digital drawing board. I have shown a few people my “watercolor” technique and it has proven to be wildly popular amongst my peers. It’s not very hard to accomplish, so I figured I’d take a few minutes to share it with you good folk!

For this tutorial I will assume that you have a basic working knowledge of Adobe Photoshop. Everything here should be backwards compatible back to 7.0 at the very least. Without further delay, I present information for you to be having:

By the end of this writing you should be able to achieve a halftone watercolor effect similar to what I have achieved with this:

watercolor effect tutorial

Making The Drips and Splatters

Before we can do anything in Photoshop, we have to have some splatters and washes and drips. I don’t actually use watercolor paints, I make an ink wash. You could just as easily search free stock images such as those at The Stock Exchange, but I prefer to make them myself. If you’d rather not wait for paint to dry, you can snag the free high quality textures at the bottom of the post. It lends greater flexibility to my technique, and a more accurate delivery of the effects. Here are the supplies that I use, your mileage may vary:

Ink Wash Supplies

supplies

The supplies pictured are as follows:

  • A standard Wash Brush used for painting
  • A Canson acrylic sketch pad (185LB Cold Press Paper)
  • Dr. PH Martin’s Bombay Black India Ink
  • a Sauce Cup (be sure that the owner of the sauce cup is okay with ink being put in it..long story…)

Obviously, the supplies you use are up to you. This is just what I have had the greatest success with.

I fill my sauce cup about 1/3 of the way up with water, then I add approximately 3 drops of black ink. You may have to figure out what works best for you, but this mix has worked well for me in the past. Note: I use black ink because the contrast allows for a reasonable file quality even with my cheap scanner.

At this point I lay some paper towels on a counter, hold the paper up with one hand, and proceed to make a mess. There’s really no wrong way with this effect. The sloppier the better. I usually try to stay generally true to whatever shape I’m working with, but keep in mind that the imperfections are what makes it interesting. Also, once I get the drips and wash the way I’d like I lay the paper flat and splatter some of the mix on it. It’s fun – make a mess!

Here’s a video tutorial so you can see exactly how it was done.

Okay, I have made a mess. Now what?

At this point you’ll need to scan your wash into the computer, or take a high quality picture of it to transfer to your computer. Save it somewhere you can find it and open it up in photoshop. I try to scan at nothing less than 300DPI, but it’s not really that important. As long as the file is big enough to resize without getting terribly pixelated, you should be okay. Here’s mine:

splatter-sample

This is my splatter image.

I have already opened up the file that contains the linework for my Mermaze design.

Press Ctrl+A to “select all” on your ink wash file, then click the window with your other artwork and Ctrl+V to paste it into the image.

Resize, rotate, and move your wash to where you want it in the final output. I have placed it behind my lines, personal preference. Here’s where I’ve arrived:

watercolor-placement

Once you are happy with size and placement, you’ll want to be sure that you have the wash layer selected in your laters pallet, then Ctrl+A to select all and Ctrl+X to cut the image.

Making The Halftone

Press Ctrl+N to make a new document, be sure the background is set to white or transparent, and click okay to make the new document. Press Ctrl+V to paste your wash into the new document. Once you have this done, we will prepare the wash to be made into a halftone.

Press D to reset your foreground and background colors. Then click the “Image” menu and select Adjustments>Gradient map. The gradient map dialog will pop up, and you should notice your wash become slightly more black and white.

Click the gradient picture on the dialog so that the Gradient Adjustment Dialog pops up. You will need to move the white tab in towards the middle until you are sure that the white background on your wash is absolutely white. Then you’ll need to adjust the black tab until your wash is as dark as you feel it should be.. Mine looks something like this:

gradient-map

I have placed red arrows pointing to where I have my black and white tabs set. This step is important because if your background is anything other than absolutely white, the halftone will have little dots placed all over it in an attempt to make it look off-white. It will not be attractive. Hit “OK” on both of the dialogs when you are finished setting the tabs.

Tip: A good way to be sure your background is pure white is to click your foreground color so that the color selector comes up, click the background of your image with the eyedropper tool, and make sure the hex code is “FFFFFF”.

Now that your background is white, and everything looks good, it’s time to make the halftone. In the “Image” menu select Mode>Grayscale. Press OK on any questions that pop up about flattening layers, or losing color information.

Now you will open the “Image” menu again and select Mode>Bitmap. When the first Dialog pops up, be sure the Method is set to Halftone Screen:

halftone-screen

When you press OK a second Dialog will pop up. You may want to play with these settings a bit but the important parts to note here are: Halftone type should be “Round” and never set “Lines Per Inch” or “Angle” higher than 45 if you are setting this design up to be screen printed. Any higher and the printer could encounter problems. If at all possible, it’s best to contact the printer first and ask them.

Once that is done hit “OK” and your splatter should now be a halftone. From the “Image” menu select Mode>GrayScale once again. Using the magic wand tool select the white background of your ink wash. Press Ctrl+i to invert your selection. Press Ctrl+X to cut the selection, Select the window with the design you want the watercolor placed in, and press Ctrl+V to paste it in. You will probably need to move your halftone into position.

Finally from the “Layer” menu select Layer Style>Color overlay and pick a color you would like your halftone to be. That’s all of it. Here’s what mine looked like:

final-splatter

That’s all for this tutorial. I’ll have more soon!

Free Ink Wash Splatters

I have a file with some high resolution splatters for you to try out. The image below is a sample of some of the washes, drips, and splatters in the package. They’re all really hi-res, so you’ll be able to get a lot of mileage out of them. Click the link below the image to download the file:

watercolor freebie

About the Author, Adam Wagner

I'm a marketer, designer, armchair singer/songwriter, wannabe theoretical physicist/philosopher and recent college grad trying to pack as much living as possible into each day. Working at Go Media makes this pretty easy. Catch me on Twitter!!
Discover More by Adam Wagner

Discussion

We want to hear what you have to say. Do you agree? Do you have a better way to approach the topic? Let the community know by joining the discussion.

  • http://www.battlemedialab.com Joe

    Thanks again! Gonna have to follow this tut when I get home :)

  • http://www.battlemedialab.com Joe

    Thanks again! Gonna have to follow this tut when I get home :)

  • http://twitter.com/jeff_finley/statuses/1065311972 jeff_finley (Jeff Finley)

    Get hands on – how to use real watercolor effects to compliment your illustrations http://tinyurl.com/4tpna4

  • http://www.gomedia.us Jeff Finley

    Those ink wash textures are nice! Thanks Heavyprints!

  • http://www.gomedia.us Jeff Finley

    Those ink wash textures are nice! Thanks Heavyprints!

  • Pingback: Heavyprints - The Artworks of Nicholas Steimling » Watercolor Tutorial Video!

  • http://twitter.com/Go_Media/statuses/1065359198 Go_Media (Go Media)

    RT @jeff_finley: Get hands on – how to use real watercolor effects to compliment your illustrations http://tinyurl.com/4tpna4

  • http://twitter.com/seanHodge/statuses/1065464440 seanHodge (seanHodge)

    RT @Go_Media: RT @jeff_finley: Get hands on – how to use real watercolor effects to compliment your illustrations http://tinyurl.com/4tpna4

  • collin

    wow thank you so much for this !

    i was looking for this kind of tutorial everywhere and this whole time it was here on my favorite site

  • David

    wellisaythere…thatsaprettydangsweetthing!

  • collin

    wow thank you so much for this !

    i was looking for this kind of tutorial everywhere and this whole time it was here on my favorite site

  • David

    wellisaythere…thatsaprettydangsweetthing!

  • VRizo

    *drool*

    I love that sketch, and the watercolor really brings it out. Imma have to try this soon! Good tut :P

  • VRizo

    *drool*

    I love that sketch, and the watercolor really brings it out. Imma have to try this soon! Good tut :P

  • Daniel Newman

    wow Thats fantastic, also paper is much cheaper then canvas, so this is a great way to do it. Also Corel painter X has some watercolor features if you don’t want to make a mess at all. I knew of the making washes before, but I was missing the getting it digital part, thanks for taking the time to go through the whole process. Great tutorial Nick.

  • Daniel Newman

    wow Thats fantastic, also paper is much cheaper then canvas, so this is a great way to do it. Also Corel painter X has some watercolor features if you don’t want to make a mess at all. I knew of the making washes before, but I was missing the getting it digital part, thanks for taking the time to go through the whole process. Great tutorial Nick.

  • maxdoming

    Great tutorial, quite thorough

  • maxdoming

    Great tutorial, quite thorough

  • http://www.heavyprints.com Nick

    Thanks guys! I’m glad you dig the tutorial. I have a few more videos which will be out soon, I’ll be sure to keep you updated.

  • http://www.heavyprints.com Nick

    Thanks guys! I’m glad you dig the tutorial. I have a few more videos which will be out soon, I’ll be sure to keep you updated.

  • http://easyillustrator.blogspot.com Dan Long

    Really nice tutorial. Thanx for the free downloads! I love free downloads!

  • http://easyillustrator.blogspot.com Dan Long

    Really nice tutorial. Thanx for the free downloads! I love free downloads!

  • http://www.williambiwer.com Bill Biwer

    Where can I get some nice brushed metal sauce cups like that?

  • http://www.williambiwer.com Bill Biwer

    Where can I get some nice brushed metal sauce cups like that?

  • ndough

    wow your a master ,thanks heavyprints that an amazing

  • ndough

    wow your a master ,thanks heavyprints that an amazing

  • Bob

    this is brilliant. thank you. really great artist.

  • Bob

    this is brilliant. thank you. really great artist.

  • Annukka

    Good tutorial and an extra thanks for the freebies, always useful!

  • Annukka

    Good tutorial and an extra thanks for the freebies, always useful!

  • http://tendou86.blogspot.com/ Takumi86

    Like that water splashing color :)

  • http://tendou86.blogspot.com/ Takumi86

    Like that water splashing color :)

  • http://chopperdesigns.blogspot.com Chopper|ChopperDesigns

    thanks they are really good

  • http://chopperdesigns.blogspot.com Chopper|ChopperDesigns

    thanks they are really good

  • http://www.designshard.com Max

    Thats awesome, now to get some ink!

  • http://www.designshard.com Max

    Thats awesome, now to get some ink!

  • http://www.psdnation.info Mike

    Really nice tutorial, big fan of this style.

  • http://www.psdnation.info Mike

    Really nice tutorial, big fan of this style.

  • Pingback: Heads Up Seven Up Blogroll for December 22nd | GrandmasterB dot com

  • Chris Omlor

    Hi Adam, I’ve been using watercolors for awhile now with very similar results. What difference have you noticed comparing the india ink with watercolors? I use the Loew-Cornell watercolor in tubes and a lot of water for the dripping results. I’ll give the india inks a try and see how it works… I’ll keep you posted. Thanks for the great tutorial

  • http://www.gomedia.us Adam Wagner

    from the post’s author Nick:

    @chris
    I don’t honestly know – I don’t have a watercolor set. I paint in acrylics and I’ve been using the ink wash method for this specific effect because it’s what I have around. I like the fact that it’s black because the contrast means it shows up well even with poor scanners(like mine). If you have any information on it, feel free to answer.
    I guess one benefit might be that using a fluid ink means you can get the effect as dark or as light as you want and still be able to create drips. Can’t really think of anything else.

    -Nick

  • http://www.gomedia.us Adam Wagner

    from the post’s author Nick:

    @chris
    I don’t honestly know – I don’t have a watercolor set. I paint in acrylics and I’ve been using the ink wash method for this specific effect because it’s what I have around. I like the fact that it’s black because the contrast means it shows up well even with poor scanners(like mine). If you have any information on it, feel free to answer.
    I guess one benefit might be that using a fluid ink means you can get the effect as dark or as light as you want and still be able to create drips. Can’t really think of anything else.

    -Nick

  • Chris Omlor

    Hi Adam, I’ve been using watercolors for awhile now with very similar results. What difference have you noticed comparing the india ink with watercolors? I use the Loew-Cornell watercolor in tubes and a lot of water for the dripping results. I’ll give the india inks a try and see how it works… I’ll keep you posted. Thanks for the great tutorial

  • http://www.minervity.com Richard Andersson

    Great tutorial! Gonna have a shot at it when I get back home from work. Love the grittyness of it. Good job! Keep it up!

  • http://www.minervity.com Richard Andersson

    Great tutorial! Gonna have a shot at it when I get back home from work. Love the grittyness of it. Good job! Keep it up!

  • Pingback: Blog diseño, publicidad y arquitectura » Blog Archive » Watercolor Tutorial

  • http://twitter.com/chuckzwood/statuses/1086515568 chuckzwood (chuckzwood)

    Free Watorcolor textures and Watercolor Splatter Effect tutorial http://tinyurl.com/4tpna4

  • Pingback: Bookmarks for Diciembre 31st from 03:20 to 04:10 | FACIL TUTORIALES

  • Pingback: Best of the Web - December - PSDTUTS

  • Pingback: Best of the Web - December | zbStudio.net

  • Pingback: Best of the Web - December | Web Hosting and Domains

  • Pingback: Bookmarks for Enero 5th from 08:15 to 09:57 | FACIL TUTORIALES

  • Pingback: Aurigis » Best of the Web - December

  • Pingback: Aurigis.com » Blog Archive » Best of the Web - December

  • Pingback: Bookmarks for Enero 9th from 04:01 to 05:47 | FACIL TUTORIALES

  • Pingback: Heads Up Seven Up Blogroll - December 22 :PbP Tutorials

  • Pingback: Bookmarks for Febrero 2nd from 02:04 to 03:01 | FACIL TUTORIALES

  • http://www.airwalk-design.com/ Daniel Schwarz

    Very hands on! I like!

  • Matt

    Thanks for this nice work!
    dizi izle

  • John

    Great post!
    dizi izle

  • http://www.clippingimages.com/ Clippingimages

    Thanks for sharing buddy…awesome one…

  • http://register-web-domain.in/ Register Domain Name

    Really very much useful to me Thanks for the posting.