Note 10 · Water Ink

Water Ink

Play drums near the laptop and every hit drops ink that swirls and bleeds on paper — a different colour per drum. Sumi-e by way of a kick drum.

Born on a drum kit

This one didn't start in the browser. It began as a TouchDesigner network on a real kit: two drum mics into an audio interface, a fluid simulation on the GPU, ink dropping with every hit. The browser version is a port of that network — the two shaders translate almost line for line once TouchDesigner's names are swapped out, and its Feedback operator becomes a pair of float textures that take turns being read and written. Same ink, new pond.

The simulation

The ink lives in an off-screen float texture: colour in three channels, coverage in the fourth. Each frame it does three things. It advects — every pixel looks slightly upstream along a slowly evolving curl-noise flow field and takes its value from there, which is what makes the ink swirl like it's sitting on moving water. It diffuses — blending toward the average of its neighbours, so edges soften and bleed. And it dries — multiplied by a number just under one, so old ink fades over a minute rather than a second. A hit injects a soft Gaussian blob of pigment somewhere on the sheet, and the water does the rest.

Rendering the paper

A second pass draws the field onto warm paper with faint grain. The trick that makes it read as watercolour rather than fog is edge darkening: the render measures how steeply ink coverage changes at each pixel and darkens the steep parts, which is where real pigment collects as a wash dries. Flat pools stay translucent; the creeping front carries a dark rim.

Telling drums apart with one microphone

The TouchDesigner rig had a mic per drum; a laptop has one, so drums are separated by frequency instead. Five bands — kick down low, toms above it, snare in the mids plus its crack up around three kilohertz, hats and cymbals at the top — each tracked against their own running average, so a hit is "suddenly louder than this band's recent normal" rather than an absolute volume. The kick bleeds into everything, so a slice of its energy is subtracted from the higher bands before deciding. Whichever drum fired hardest that frame drops one blob in its own ink: indigo for the kick, teal for the snare, slate for the hats, rust for toms, sage for cymbals. Little dots in the panel flash as each drum is recognised, which doubles as a tuning meter.

No drums handy

Any sound works — the bands don't care whether the kick is a kick or a hand slapping the desk — and tapping the paper drops ink directly, so the toy is playable in a quiet office. The sheet can be saved as an image, which is the closest this site gets to a souvenir shop.

Back to the build log, or open the app. This flow replaced the earlier Watercolour experiment.