Generative Art

Dithering Experiments

May 25, 2023

Error diffusion

I started with Floyd-Steinberg dithering via this Coding Train video. The process (error diffusion) is actually pretty simple:

  • Start with he first pixel in the image

  • Snap a gray pixel to either black or white

  • Take the difference between the black/white pixel and the original gray pixel, spread this “error” to the neighboring pixels ( in this case, east, south east, south, south west).

    • e.g. if a gray pixel gets snapped to white, you need to darken the surrounding pixels, and vice versa

There are other ways to do error diffusion. After working out the Floyd-Steinberg dithering, it’s no trouble at all modifying the sketch to do Atkinson Dithering, which looks better IMO

Floyd-Steinberg dithering

Atkinson dithering

Custom stuff later?

There are any number ways to divide and distribute the error. I didn’t get try any custom stuff because I wanted to move on to Ordered Dithering.


Ordered dithering

This method leads to more artifacts, but also more interesting results

Ordered dithering’s a similarly straightforward process.

  • Create a “dithering matrix”, which is an entirely too complicated phrase for “grid of numbers”

  • Use the matrix to darken or lighten the pixels in the image, making them more or less likely to flip black (or white). Higher numbers lighten, lower numbers darken.

  • Tile the matrix over the image and repeat the process.

The default matrix

The distribution of numbers in the matrix is what gives an image its texture and its artifacts. In the default dither matrix the numbers are distributed as evenly as possible (higher numbers are surrounded by lower numbers and vice versa) to get a nice even texture.

Custom matrices

We can change the distribution to get different textures and artifacts

Ordered Dithering Tool

Lastly, I made a little web app for making/editing dither matrices and previewing their output