Drum machine · glm-5.3
Build a 16-step drum machine with a clickable grid for kick, snare, hi-hat, and clap, all sounds synthesized with the Web Audio API, plus play/stop and an adjustable BPM.
transcript · 4 messages
Build a 16-step drum machine with a clickable grid for kick, snare, hi-hat, and clap, all sounds synthesized with the Web Audio API, plus play/stop and an adjustable BPM.
index.html (10004 bytes)Successfully wrote 10004 bytes to index.html
Done — `index.html` contains a complete self-contained 16-step drum machine: - **Tracks**: Kick, Snare, Hi-Hat, Clap (color-coded rows), with a preset groove pre-loaded - **Synthesized sounds** via Web Audio API: kick (pitch-swept sine), snare (triangle tone + filtered noise), hi-hat (band/high-passed noise), clap (multi-burst noise through a bandpass) - **Sequencer**: lookahead scheduling for rock-solid timing, live playhead highlight, beat markers every 4 steps - **Controls**: Play/Stop button, BPM slider (40–240), Spacebar toggle, and step preview when you click a cell while stopped
TAKE IT TO CODE
A single self-contained HTML file — copy it and open in any browser, or reuse the prompt with your own pi-agent run.
RUN
EVALUATION
16-step drum machine with kick/snare/hihat/clap grid, BPM slider, play/stop toggles via space, and playhead moves on keys.
Vision grade · anthropic/claude-sonnet-5
MEASUREMENTS
Raw readings from the capture, not a verdict — the grade above is the only judgement. Percentages are how much of the screen changed; the measure under-reports sparse motion on a dark background.