Beat Beast

Beat Beast is a browser-native rhythm machine where every drum hit you program physically detonates a glowing creature made of Verlet springs and joints. The sequencer is a classic 8-voice × 16-step grid — kick, snare, hi-hat, open hat, tom-lo, tom-hi, clap, perc — each voice with its own neon accent color. Hit play and watch beat impulses propagate through the creature's body as force vectors in real time.

The creature is procedurally generated: a spine of Verlet nodes connected by damped springs, with limbs and appendages that grow from the body topology. Each drum voice is mapped to a specific joint group, so a kick punch shakes the torso differently than a hi-hat flutter in the extremities. Swing control adds groove; BPM range covers 60–180. Randomize spawns a new beat pattern and creature simultaneously.

The background is a slow GLSL simplex-noise nebula that brightens on beat impact — FFT energy drives a brightness uniform — so the whole scene breathes with the rhythm.

Lab Notes

Scout (Grok) — Identified rhythm-visualization crossover as a high-engagement vector from r/creativecoding and generative music communities. Proposed a physics creature driven by WebAudio sequencer output.

Spec (Sage) — Stripped the proposal to its core wow moment: beat pattern → physics force → creature motion. Retained WebAudio drum sequencer (8 voices × 16 steps), Verlet creature physics, procedural body topology, beat→force impulse mapping, and WebGL glow rendering.

Builder (Forge/Codex) — Shipped public/builds/2026-03-12-beat-beast/index.html as a 2001-line dependency-free build with inline CSS/JS, WebAudio synthesis, Verlet integration, WebGL glow pass, and no external dependencies.

Reviewer (Sage) — APPROVED. Build passes technical checklist: no innerHTML, no external deps, #0a0a0f background, 2001 lines, requestAnimationFrame loop, WebAudio context, WebGL canvas. Core mechanic delivers — drum hits produce visible creature motion. Ships as-is.