a quickie to celebrate holidays!
to stipple (verb) to paint, engrave, or draw by means of dots or small touches.
here’s why english is a beautiful language. stippling is a graphic way of rendering masses. I must admit I’m obsessed with stippling for years now, I wanted to give it a try for a while and never found time to do so.
to mimic a stippling, we’ll need dots – obviously – and one approach would be to randomly distribute dots over a surface, retrieve the greyscale value of a picture’s pixel, normalize it, then index the size of the dot on this value. that’s how the final render works (somehow). but there’s a more elegant way to distribute dots over a surface called the Poisson Disc distribution. I chose to use it for the graphic quality of the ouput but also because Poisson means fish in french which I find extremely funny. a good explanation & example of what Poisson distribution is can be found on Mike Bostock’s amazing page.
I ported the code found here & pushed an example on codepen (click to reset):
See the Pen Honhonhon le poisson! by nicolas barradeau (@nicoptere) on CodePen.
stippling is used to spare some ink when printing large posters, I did a variation on the render with 3 colors & a subtractive blendmode. I collected a series of portraits from Google images and applied the process to the 204² px pictures. here are some results:
lovely ain’t it ?
and here’s the live demo ( click to load next picture, might freeze your computer )
tracing things – Youpi !
[…] exactly but you get the idea). there are techniques I’d like to explore, the first is the stippling, the second is the dithering, both can lead to better dots distributions and allow optical […]