How Flow Turns Randomness Into Current

Thousands of particles sample the same changing field, so the sketch reads less like random motion than like a current revealing its own path.

A web search for Ken Perlin 1985 An Image Synthesizer flow noise particles surfaces three landmarks behind this sketch: Ken Perlin's 1985 paper "An Image Synthesizer", the Book of Shaders chapter on noise, and the SIGGRAPH history note on flow noise by Perlin and Neyret. The shared idea is simple and still powerful. Randomness becomes useful when neighboring values resemble each other closely enough to create continuity. Once that continuity exists, a field can steer motion without ever looking mechanical.

The Flow artifact keeps that logic stripped down. Particles reveal the field. Each particle samples noise at its current position, turns that sample into an angle, nudges its velocity in that direction, and leaves a short luminous trace behind. Because every particle reads from the same field, the screen gradually fills with streaks that make coherence visible. The field was already there in the math. The particles give it a body.

update() {
  const angle = perlin.noise(this.x * scale, this.y * scale + time * 0.0001) * Math.PI * 4;
  this.vx += Math.cos(angle) * 0.1;
  this.vy += Math.sin(angle) * 0.1;
  const speed = Math.sqrt(this.vx * this.vx + this.vy * this.vy);
  if (speed > this.maxSpeed) {
    this.vx = (this.vx / speed) * this.maxSpeed;
    this.vy = (this.vy / speed) * this.maxSpeed;
  }
  this.x += this.vx;
  this.y += this.vy;
}

That snippet from the gallery source does almost all the conceptual work. The noise call produces a smoothly varying value. The code converts it into an angle, pushes velocity a little farther along that direction, caps the resulting speed, and advances the particle. Repetition and accumulation create the richness. Three thousand particles running the same local rule can make a whole canvas feel like wind, smoke, or current without having to name any one of those things outright.

A faint black wash leaves enough residue for motion to persist briefly instead of clearing the canvas completely. The wash turns position into history, so you see where a particle is and where the field has been carrying it. Open the full artifact page or jump straight to the gallery sketch.