How a handful of simple rules create the illusion of a living school of fish.
In 1986, computer scientist Craig Reynolds published a paper describing a program he called Boids — short for "bird-oids." The idea was deceptively simple: instead of choreographing a flock by hand, give each individual agent a few local rules and let collective behavior emerge on its own.
No agent knows the shape of the flock. No agent has a global plan. Each one only looks at its immediate neighbors and adjusts its velocity accordingly. The result looks organic because it is organic — the same process drives real schools of fish, flocks of starlings, and swarms of insects.
If another boid gets too close, steer away from it. This prevents fish from colliding and keeps the school from collapsing into a single point.
Average the velocities of nearby boids and nudge your own velocity toward that average. This is what makes a school move together in a coherent direction.
Find the average position of your neighbors and gently turn toward it. This pulls the school back together whenever individuals start to drift apart.
The playground simulates Blue Tang boids using all three rules, plus a solo Orangestripe Triggerfish that roams on a Bezier path — showing how a non-schooling fish moves differently even in the same environment.
The playground exposes eleven sliders and a set of visualization toggles. Drag a slider and the simulation responds immediately — no reload needed. Click the ? button in the panel header to show inline descriptions for every parameter.
| Parameter | What it does |
|---|---|
| SIM_SPEED | Simulation speed — a time-scale multiplier. All forces, velocities, and movements scale together, so the behavioral dynamics stay the same — they just happen faster. Useful for quickly seeing the effect of parameter changes. |
| Parameter | What it does |
|---|---|
| SEP_R | Separation radius — fish closer than this distance push each other away. Raise it and fish give each other a wider berth. |
| ALI_R | Alignment radius — fish within this distance try to match each other's heading. Larger values mean each fish listens to a bigger slice of the school. |
| COH_R | Cohesion radius — fish within this distance steer toward the group center. A large value pulls distant stragglers back into the school. |
| W_SEP | Separation strength — how hard fish push away from close neighbors. Turn this up and the school spreads out; turn it down and fish tolerate being packed together. |
| W_ALI | Alignment strength — how strongly fish match their neighbors' direction. High values produce a tight, disciplined school moving in lockstep. |
| W_COH | Cohesion strength — how hard fish pull toward the group center. Raise this and the school clusters tightly; lower it and fish are free to wander. |
| Parameter | What it does |
|---|---|
| TURN_TANG | Tang turn rate — how quickly a Blue Tang rotates toward its target heading (radians per second). Higher = snappier turns; lower = fish drift lazily around corners. |
| TURN_TF | Triggerfish turn rate — same idea for the solo Triggerfish on its Bezier path. Higher values keep it hugging the curve more tightly. |
| DAMP_Y | Vertical damping — reduces the vertical component of boid acceleration. Lower values let fish bob up and down freely; higher values flatten the school into a more horizontal plane. |
| DAMP_Z | Distance damping — reduces acceleration along the depth axis (toward/away from the camera). Lower values scatter fish through the full depth of the scene; higher values keep them in a shallower layer. |
Below the sliders, three checkboxes let you peel back the presentation layer and see what the algorithm is actually doing.
Enabled by default. Uncheck it and the 3D fish models are replaced by small arrowheads pointing in each boid's travel direction — the same markers used in the How Boids Work diagrams. This strips away visual clutter and makes it easier to track individual agents, especially when combined with the distance lines below.
This toggle draws color-coded lines between every pair of fish that are close enough to interact, plus wireframe spheres around each tang whose color and size match one of the three boid rules. Use the radio buttons to choose which rule's radius to visualize:
The distance lines use the same color logic:
Try adjusting a radius slider while viewing its matching sphere type — the spheres and line colors update in real time, making it easy to see exactly how each radius shapes the school's behavior.
Toggles the 3D "Boids Playground" title text on or off, giving a cleaner view of the school.
There are quite a few boids simulations on the web. One I particularly like is Daniel Huang's elegant and beautiful Boids Simulation. It's a 2D world with up to 5,000 boids that does a wonderful job of highlighting emergent patterns of behavior. I particularly like his toggle to "show vision areas," which are analogous to our spheres, and which create beautiful heatmaps — particularly when "change hues to indicate speed" is selected. And which help to show what's going on internally.
For this playground, I began with the schooling fish simulation on my homepage, and then layered in the vision areas — as spheres, vs. circles, in my 3D Playground. I am particularly interested in how the hard-limit (in or out) radius settings lead to "soft" and emergent behaviors as the individual fish cross in and out of each others' spheres, as indicated by the connection lines that switch on and off when the "Radius spheres & distances" box is checked. I also wanted to dig into how the three different radii (separation, alignment, and cohesion) operate individually and collectively, which the playgrond supports.
Following the Playground, I also developed a How it Works page that walks through the individual forces as well as their collective effects on individual boids, with embedded interactive demos for each.
In short: for larger-scale emergent behaviors, I highly recommend Daniel Huang's work. For a more granular "under-the-hood" view, I think this playground does a good job. I hope you enjoy it. And regardless, I hope you find the boids algorithm as fascinating as I do!
The 3D fish models are paid assets by Nyi Nyi Tun on Fab.com: