Published 2026-08-22

The 3D Living Brain: Rendering an Agent Fleet as Anatomy
In the last post I argued that a roster is not a router — that the way you visualize an agent fleet shapes how you think about it. A flat list makes agents feel interchangeable. A graph makes them feel like a pipeline. Neither captures what actually happens when nine agents are running, delegating, escalating, and quietly humming at different rhythms.
So I built the thing I wanted to look at: an orbitable 3D brain where each agent is a region, and the regions pulse with live telemetry. This is the engineering log of how it works.
The Mapping
Nine agents, nine regions. Not a metaphor stretched until it snaps — a loose structural correspondence that's useful precisely because it's wrong in the right ways. The main agent handles planning and top-level dispatch, so it sits in the dorsolateral prefrontal cortex (dlPFC) — the part of the brain that does executive function. The coder agents handle language and syntax, so they land in left inferior frontal gyrus (L-IFG) and pre-premotor dorsal (pre-PMd). And so on:
| AgentRegion(s)Role | ||
| main | dlPFC | Executive control, dispatch |
| coder | L-IFG | Syntax, code generation |
| coder-light | pre-PMd | Lighter syntax processing |
| creative | rTPJ + rFP | Divergent thinking, social context |
| whatsapp-guest | rSTS + rIFG | Conversation, guest-facing language |
| researcher | Hipp + EC | Memory retrieval, knowledge routing |
| ops | Basal Ganglia | Habit loops, infrastructure automation |
| diagnostician | aIns + aACC | Interoception, error detection |
| diagnostician-light | pIns | Lighter interoception |
The Geometry
Each region is a procedurally generated blob. I started from a subdivided icosahedron and applied 3-octave fractal Brownian motion (fbm) to the vertex positions — a Perlin-ish displacement that gives each region an organic, slightly lumpy silhouette instead of a perfect sphere. The displacement amplitude is driven by telemetry, so a busy region literally swells and quivers more than an idle one.
The whole brain sits inside a glass shell. This is where three.js r128 bit me. I wanted a real physical glass material with transmission — the property that makes light bend through a surface. But MeshPhysicalMaterial.transmission landed in r144. In r128, the closest approximation is transparent: true with low opacity, clearcoat for the specular pop, and side: DoubleSide so you see the back of the shell through the front. The shell runs at opacity 0.14 and clearcoat 0.6. It's not physically correct. It looks right, which matters more.
three.js is vendored locally — no CDN. The whole library is served from /vendor/* routes on the dashboard. This avoids dependency on a third-party host and keeps the dashboard self-contained.
OrbitControls gives you damping, a distance clamp of [2, 20], and a polar angle clamp so you can't flip under the brain and get lost. Click a region and the camera tweens over 700ms to frame it, every other region dims to 10% opacity, and a glassmorphism detail panel slides in showing the model chain, live stats, and an override dropdown. Click away and it all restores.
Telemetry → Motion
The dashboard polls /api/state every 500ms. That JSON drives everything visual: emissive intensity on each region, vertex displacement amplitude, particle sparks at hot zones, and pulses along connection lines.
The key decision was giving each region a motion signature — a different rhythmic feel so you can tell agents apart at a glance without reading labels:
- main — gamma flicker at 40Hz. Fast, dominant, the thing your eye lands on first.
- coder — beta wave at 20Hz. Steady, mechanical.
- coder-light — 12Hz. A gentler version of the coder's rhythm.
- diagnostician — salience burst at 60Hz using
pow(sin(t), 8). Sharp spikes, not a smooth wave. Looks like attention snapping into focus. - diagnostician-light — 100Hz ripple. Very fast, almost a shimmer.
- researcher — theta-gamma nesting: a 3Hz carrier modulated by a 40Hz gamma envelope. This one is my favorite. It looks like deep slow waves with fast flicker riding on top, which is literally what theta-gamma coupling looks like in real hippocampal recordings.
- creative — breathing at 1.5Hz with occasional particle sparks. Slow, expansive, a little dreamy.
- ops — low-frequency hum at 1.2Hz. The background heartbeat you feel more than see.
- whatsapp-guest — 2Hz. Conversational pace.
Connection lines are CatmullRomCurve3 arcs between regions, fired on delegation and escalation events. When main hands a task to coder, an arc lights up between dlPFC and L-IFG, pulses once, and fades. The arcs aren't decorative — they're the routing log rendered as anatomy.
The Apostrophe
Here's the bug that took the longest to find.
The dashboard serves a dashboard page whose HTML is built server-side from a template. One line in that template contained the word brain's — with an apostrophe. The template engine rendered it fine. The browser received it fine. But the string was embedded inside a <script> block as part of a JavaScript string literal, and the apostrophe terminated the string early. The rest of the script block — the entire three.js initialization, the telemetry loop, the OrbitControls setup — became a syntax error. Silent. No 3D brain. No error in the network tab. Just a blank canvas and a console error buried under framework noise.
The fix was one word: reworded the string to avoid the apostrophe entirely. No escaping, no entity encoding — just reworded it. Which is the kind of fix that feels like a defeat until you realize it's the fix that ships.
This bug had been silently breaking the original flat dashboard's client JS too. The 3D brain didn't introduce it — it just made the breakage visible, because suddenly there was a canvas that should have had something in it and didn't.
Fallback and Accessibility
Two fallback paths. If WebGL is unavailable — headless browsers, old machines, locked-down corporate laptops — the 3D view is replaced by a .brain3d-fallback note explaining what you're missing and pointing to the flat dashboard. No broken canvas, no error spam.
If the user has prefers-reduced-motion set, vertex displacement and particle sparks are disabled. The regions still light up with telemetry — emissive intensity is fine, motion is the problem — but the brain doesn't breathe or quiver. Connection-line pulses still fire because they're informational, not decorative, but they're short and don't loop.
What I'm Taking Away
The 3D brain is not a better dashboard than the flat list. It's a different one. The flat list answers "what is each agent doing right now?" The brain answers "how does the fleet feel while it's working?" Those are different questions, and both are worth being able to ask.
The thing that surprised me most was the motion signatures. I expected the geometry and the glass shell to be the hard part. They weren't. The hard part was making nine things pulse in ways that felt distinguishable without being chaotic. Theta-gamma nesting for the researcher was the breakthrough — once I had one region that felt categorically different from the others, the rest fell into place as a spectrum from "fast and sharp" (diagnostician) to "slow and breathing" (creative).
The apostrophe bug was the lesson I keep relearning: when something is broken and you can't find the cause, look for the character that's doing two jobs. In a template, an apostrophe is English. In a script block, it's a delimiter. When the same byte plays both roles, one of them loses.