In case you haven’t noticed yet, the hand drawn style is one of the hottest design trends. There are several ways to create hand drawn images — you can create it from scratch in Photoshop or you can scan an actual hand drawn sketch. Personally, I like to use a scanned drawing because you get a realistic drawing texture. Here is a quick tutorial to show you how to create a hand drawn design in Photoshop using the blending mode and alpha channel.

1 Create From Scratch in Photoshop

If you have a tablet, you can simply draw the sketch by using the brush tool.

tablet

Don’t Have a Tablet?

If you don’t have a tablet, you can create the artwork in Adobe Illustrator and then imitate a hand drawing effect in Photoshop.

First draw a vector illustration. Then import it in Photoshop. Use a grungy brush and gently erase select parts of the image. Use the Blur tool to create the smug effect.

digg it sketch

2 Scan It

The easiest way scan the drawing and set the layer blending mode to Multiply.

multiply blending mode

Invert Color

If you want to have a white color stroke instead of black go to menu Image > Adjustments > Invert (or press shortcut Cmd+i) and then select Screen blending mode.

screen blending mode

screen blending mode

Step It Up: Create Color Gradients

What if you want more than just a black or white stroke (ie. colors gradients)? Then you will have to extract the drawing from the white background. A simple way to do this is by using alpha channel.

  • Copy (Cmd+C) the drawing.
  • In the Channels palette, create a new channel. Then paste the drawing in the new channel.
  • Invert (Cmd+i) the channel layer.

alpha channel

Go back to the Layers palette, create a new layer. Go to menu Select > Load Selection. In the Load Selection prompt box, select Channel: "Alpha 1" (which is the name of the alpha channel I created earlier).

alpha channel

Shortcut Tip: the shortcut for loading a channel selection is Cmd + Opt + any number key (ie. 1, 2, 3). Learn more Photoshop shortcuts.

Fill Selection

With the channel selection loaded, you can fill it with any color.

color drawing

Using It In The Design

For the purpose of this tutorial, I’m going to show you how to incorporate your hand drawing on a female model (the photo was purchased from iStock).

drawing on a female model

1. First, cut out the model.

cutout model

2. Fill the background with some sort of light glowing gradients.

glowing background

3. Paste the drawing on top of the model. Lock the layer transparency. Play around with the color gradients.

gradient stroke

4. Duplicate the drawing in the background to add more details to the image.

final model image

278 Comments

1 12 13 14
  1. Uçak Bileti
    Jan 11, 2011 @ 3:31 pm

    havaaaa

    Reply

  2. tütüne son
    Jan 29, 2011 @ 4:00 pm

    It’s very nice and i love drawing and thank you

    Reply

  3. altın çilek
    Feb 2, 2011 @ 6:59 am

    Hello!! Great tutorial BUT in CS3 doesn’t work =/ Thank you anyway

    Reply

  4. Ziggy Skobario
    Mar 21, 2011 @ 2:34 am

    I really appreciate the Good Looking has a Designer and I very like that initiative

    Reply

  5. hdwallpapers
    Apr 23, 2011 @ 5:41 am

    Very useful information. Thx!

    Reply

  6. Elois Gomoll
    May 13, 2011 @ 8:49 am

    I’m also commenting to let you know of the excellent discovery my wife’s girl undergone going through your web site. She learned a wide variety of pieces, which include what it’s like to have an amazing giving mindset to get other people smoothly thoroughly grasp a number of very confusing things. You really did more than our expectations. I appreciate you for rendering the important, safe, explanatory not to mention unique tips about this topic to Mary.

    Reply

  7. juan flores
    Aug 21, 2011 @ 2:45 pm

    damn the pandoras box of designers is open .,…he he i love this example … eventually is far good of your real work but it a good start for me as a beginner

    Reply

  8. complex41
    Aug 23, 2011 @ 11:45 am

    And then he handed you the thirty-five 45

    Reply

  9. Nikhil Sapkota
    Nov 21, 2011 @ 11:13 am

    Mind blowing..Great.Awesome..:D loved it

    Reply

  10. pomoc prawna
    Dec 29, 2011 @ 1:31 pm

    Vielen Dank für dieses Blog-es ist toll! Ich mag diese Art von Menschen, die Wissen mit anderen zu teilen.

    Reply

  11. Shaun Mclain
    Jan 6, 2012 @ 10:49 am

    Nice informative collection, thanks for sharing.

    Reply

  12. MIssa
    Feb 4, 2012 @ 8:15 am

    It’s looking so beautiful and good design of this image.

    http://www.fashionlanes.com/

    Reply

  13. smtp hotmail
    Mar 27, 2012 @ 4:23 pm

    Muchas Gracias for showing us.

    Reply

  14. Beylikduzu Bosch
    Mar 28, 2012 @ 2:43 pm

    i use it my ecomerce sites banner.thanks for sharing, very nice.

    Reply

  15. Isis marquez
    Apr 9, 2012 @ 8:11 pm

    I love that page because is cool!

    Reply

  16. bitkisel
    May 2, 2012 @ 1:13 pm

    Thank you Thank you!! This is organized very nicely

    Reply

  17. masum sarker
    May 27, 2012 @ 9:50 am

    how creade a new desin !!!!!!!!!!!!!!!!!!!!!!

    Reply

  18. Anthony
    Sep 24, 2012 @ 4:23 am

    This is was such a great insightful article. This helped me out so much, thanks!

    Reply

1 12 13 14

Leave a Reply