Flow Fields

Particles tracing invisible currents

Drag on the canvas to pour particles.

Step 0. The address of the page keeps the field, to share it.

Arrows everywhere

Imagine an arrow pinned to every point of the canvas. Drop a particle anywhere, let it take a small step in the direction of the arrow under it, then another, and another. Thousands of particles doing this, each leaving a faint line, draw the shape of the invisible field: currents, eddies and combed strands, like wind maps, iron filings or the grain of wood.

The arrows come from Perlin noise, which Ken Perlin invented in 1983 for the film Tron to give computer images a natural roughness, and which earned him an Academy Award. It is random, but smooth: two nearby points get nearly the same value, so neighboring arrows lean the same way. Zoom sets how quickly the noise changes across the canvas, and Twist how many turns a value of the noise is worth.

Curl noise uses the spin of the noise instead of its value (Robert Bridson, 2007). Like water, that flow cannot pile up or empty out, so the lines stay evenly spread. The other fields are plain formulas: whirlpools, a spiral, waves, and angles snapped to eight directions for a woven, circuit-board look. Tick Let the field drift to slide through time in the noise and watch the currents change while they are drawn.