Ant Colony War
Two pheromone armies wage a Lanchester war on a glowing earth — supply lines visible, queens fall, fronts collapse.
What this is
A dark earth lit by two glowing pheromone rivers — orange for one colony, blue for the other. A thousand chevron ants flow along those rivers: foragers carry green crumbs home, soldiers patrol the front, queens pulse at the back of each base with HP bars. When fronts collide, sparks burst and the camera eases in for a close-up. When a queen dies, the war ends and the world resets.
Why this is mind-blowing
You're not watching a scripted battle — you're watching a stigmergic swarm. Every ant is following a chemical gradient. Supply lines self-organize. Fronts shift as one side overruns the other. The losing colony actually collapses according to Lanchester's square law: once you fall behind, your line breaks faster than it should. The drama-cam catches the moment.
Build a single-file HTML page that runs a war between two ant colonies on a
pheromone-laden earth. Foragers gradient-follow their colony's trail,
soldiers follow the danger pheromone toward enemy contact, workers idle by
the queen and auto-promote based on role shortages. Pheromone fields diffuse
and decay. Queens have HP and can die. Drama-cam zooms in on the densest
battle. Auto-reset on queen kill. No user input — autoplay forever.Paste this into Claude, Cursor, or Copilot. Change one thing that matters to you.
What I learned shipping it
- Float32Array pheromone fields with a 3×3 box-blur diffuser plus multiplicative decay every other frame is the cheapest way to get glowing supply lines.
- A 28px spatial hash makes 1000-ant combat O(neighbors); without it the war devolves into a slideshow.
- Role auto-promotion (workers → foragers / soldiers based on shortage) makes Lanchester's square law emerge for free — losing colonies actually collapse, not just shrink linearly.