Old Photo, Pastel, and Pencil Sketch Pixel Shaders For Silverlight

Feb 18, 2010

EasyPainter has new filters! Source code below! Try them out here

Edit: I'd actually like to improve the pastel shader further - real-life pastel is usually on white background, and the shaders are on black...


Original (http://www.flickr.com/photos/-arpi/4280428638/):


Pastel Drawing:


Old Photo:


Old Photo ("younger"):


Pencil Sketch:


Source Code

Download shader source code and required images

The .zip file contains the old photo shader, and 2 variations of the sketch shader. The first variation uses 2 input images (good for debugging) while the second one uses just one image which contains the information about one stroke in its red channel and the other stroke in its blue channel, effectively compressing 2 black-and-white images into one red-blue image :)

The Old Photo Shader is based on the Old Movie Shader by Rene.

The Sketch shaders are based on this excellent explanation of how to do pencil sketch effect. I made very small modifications to the original shader and also created a "pastel" effect in addition to the pencil sketch effect.

Creating a sketch effect turned out to be easy:

1. make 2 sketches on paper like this (I used real-life pastels from my 3 year old daughter):

pastel1 pastel2

2. Scan the images

3. Create a pixel shader that combines the sketches with the input image, based on the input image's color (e.g. red determines the amount of the first sketch image, blue determines the amount of the second image). This ensures we'll get uneven sketch strokes, similar to an artist.

On the screenshots above you can see that depending on color the orientation of the sketch is either left-to-right, right-to-left or some combination.

Very nice effect – kudos to Shawn Hargreaves who thought it up (see link above) :)

You can extend this easily to do pen, watercolor or potentially other drawings as well.


Last but not least, I made a small modification to Shazzam to support sampler2D and sampler1D parameters. You can add a texture from inside the tool and experiment. I sent the code to Walt (the creator of Shazzam), so hopefully we'll see it out soon! Here's a screenshot:


blog comments powered by Disqus

nokola.com | Terms | Log in


About the author

Happy & enjoying life. Software enthusiast.
The opinions I express here and on nokola.com are mine and not my employeer's (Microsoft).
This is the official blog of nokola.com. You can find Silverlight samples, coding stuff, and hopefully other interesting things here.