Preparing a Scanned Drawing for the Web
In this tutorial I will show you one of the many methods of editing a scanned drawing.
First, let’s draw something and scan it. I might not be Picasso, but this will work:
I’ve scanned this picture as a A4 paper, with 300dpi, resulting in a 1349×2040 image. It’s a lot for web-use, so we need to change that.
Let’s open this in Photoshop and try to give it a more web-friendly size. Go to Image -> Image Size (CTRL+ALT+I) and decrease the size and resolution of the picture (modifying the Resolution from 300 to 72 will do the trick):
So, here is the image after the resize:
Now, let’s do some basic tweaking for the picture. Duplicate the layer (Layer -> Duplicate layer). Name it Multiply. Grab the Magic Wand tool (not the best option in the world, but it will do the job), and click outside the character to select the white background. Hit the Delete key. Select the blend mode to Multiply. Basically, here we just made the character be more intense in color and the background to stay the same.
With the selection still active, select the Background layer, and play with the Levels option (Mode -> Adjustments -> Levels or CTRL+L) so the white will be even more intense.
To do things more interesting, duplicate the Multiply layer (Layer->Duplicate Layer) and name it Linear Burn (also, change the blend mode to Linear Burn) and downscale the opacity to a convenient value (in this case, around 50%). You don`t want the cartoon to be too intense in black.
Now, the final touches. First, save the project as a JPEG (File -> Save As -> JPEG or CTRL+SHIFT+S). We will leave Photoshop aside for a while, and do a alternative and modern way to correct the imperfections of the image. Go to http://www.reshade.com, and login / signup (free). Select Online Image Resizer. Upload your JPEG with the drawing and press the Submit button to upload the image. You may wonder why I do not just use Photoshop. The answer is really simple: I want to see the image directly in the browser so I can have a idea of how it will look on the Internet, and this application is faster and easier than Photoshop, with the same results.
First, select the size you want. Be sure you select a bigger size, so the effects will work. Check the Denoise button, select a Soft denoise (the Hard selection will result in a crisp image, which is not the case in our example). Also, check the Smooth button, with the Strong option selected (the Soft option is a good alternative, but I get better results with the Strong option in this case).
When you’re done, press the RESIZE button and you will end up with your clear drawing edited for further use (crop, incorporate in other designs, etc):
Wow, so nice and simple method ! I used just Levels menu, but this gives much more interested result
Comment by Pimpa — April 23, 2009 @ 9:58 am
Santino Reimer
I am so grateful for your article post.Thanks Again. Much obliged.
Trackback by Santino Reimer — February 2, 2012 @ 11:26 am