I have a 7-color e-ink screen arriving tomorrow, so I'm experimenting with custom color dithering techniques. Here is Subscapes #39 reduced to a 7-color, 600x448px paletted image.
One thing that is worth more exploration is an error diffusion technique that isn't based on a simple scanline. On the left is left-to-right scanline, on the right first I run through with random jumps, and then apply a second pass with left-to-right, to avoid dither patterns.
Notice the very top is problematic in both. On the left, it repeats noticeably until it 'fixes' itself. On the right, the first scanline hasn't yet received any error diffuse, so it doesn't match the rest.
Something that blows my mind with dithering is that this image is just 7 colors, but putting certain colors near each other tricks our brains into seeing more than the reduced palette.
Screen arrived! Easy setup and pretty nice quality. Here is Subscapes #042 and #039 realized on the surface. The former uses just 2 colors, the latter uses all 7.
Notice in the second photo it is unplugged—the image will persist indefinitely, which is the beauty of e-ink!
The update loop is *slow* and chaotic though, around 30 seconds because of all the colors. Perhaps there's some room to improve it if I dive into their Python driver a little.
• • •
Missing some Tweet in this thread? You can try to
force a refresh
Speculative design for a new creative coding toolkit.
You layer together "Components", each is just a single script that exposes some attributes and/or UI props.
Now that I've coded the LinearGradient and NoiseLines components, I could easily re-use them in other projects, or even publish them online for other users of the tool to bring into their own designs.
I added a few more details and the code for those 3 components in the following gist:
Linear interpolation (sometimes called 'lerp' or 'mix') is a really handy function for creative coding, gamedev and generative art.
The function interpolates within the range [start..end] based on a 't' parameter, where 't' is typically within a [0..1] range.
A thread...
For example, divide 'loop time' by 'loop duration' and you get a 't' value between 0..1.
Now you can map this 't' value to a new range, such as `lerp(20, 50, t)` to gradually increase a circle's radius, or `lerp(20, 10, t)` to gradually decrease its line thickness.
Another example: you can use linear interpolation to smoothly animate from one coordinate to another. Define a start point (x1, y1) and end point (x2, y2), then interpolate the 'x' and 'y' dimensions separately to find the computed point in between.
So many of my sketches begin with the same function: producing a uniform distribution of values along an array, between [0..1] range. Here's how it looks in JavaScript.
I'm calling it "arcs" (for arc lengths) but perhaps there is a proper name for this sort of thing?
I use this for all sorts of things, like generating an N-sided polygon: