No GPU or paid inference API in the working local product.
Interactive demo · no upload · no API
Hear the chart.
Edit the groove.
DrumAI turns audio into playable notation. This public demo lets you inspect the output safely while the CPU transcription pipeline stays private.
Original 4-bar fixture
Notation player
Ready — edit a step or press play
Private pipeline, public evidence
Seven stages from waveform to a chart you can practice.
- 01Preprocess
- 02Separate
- 03Detect
- 04Quantize
- 05Arrange
- 06Notate
- 07Export
Each stage owns a typed input, observable output, and failure boundary.
This demo contains synthesized sound and no commercial recording.
The browser experience is a deterministic demonstration of the output layer, not a claim that the transcription model runs on this page.
Input / output contract
One artifact enters. Three practice-ready artifacts leave.
Local audio path
A user-owned file plus tempo and quantization options. The private CLI keeps audio on the machine.
Immutable score
Measures, subdivisions, instruments, hits, confidence, and provenance form a versionable notation model.
Practice player
The score drives a Web Audio scheduler, cursor, loop boundaries, metronome, and tempo-independent playback.
Portable exports
The working product produces notation and MIDI; this public demo exports only its edited JSON fixture.
Pipeline walkthrough
Seven stages, seven places to observe or recover.
- 01 · Preprocess
Decode to a stable sample rate, normalize channels, and preserve source metadata.
- 02 · Separate
Isolate the percussion signal locally so harmonic content does not dominate detection.
- 03 · Detect
Infer kick, snare, and cymbal events with timestamps and confidence values.
- 04 · Quantize
Map continuous events to musical subdivisions while retaining timing evidence.
- 05 · Arrange
Group hits into measures and resolve conflicts without mutating previous stages.
- 06 · Notate
Translate the score model into an editable visual grid and player timeline.
- 07 · Export
Serialize practice artifacts and diagnostics with source/version provenance.
Logic and code
The private boundary is visible without publishing private source.
audio = preprocess(user_owned_file)
drums = separate(audio, local_cpu_model)
events = detect(drums)
score = quantize(events, tempo_grid)
return export(arrange(score))This describes the contract only. It is not copied from the private implementation.
const stepMs = (60_000 / state.tempo) / 4;
instruments.forEach((instrument) => {
if (state.pattern[instrument][step]) hit(instrument, now);
});The browser scheduler derives sixteenth-note time from tempo and synthesizes only enabled fixture hits.
return {
...pattern,
[instrument]: pattern[instrument].map(
(value, i) => i === step ? !value : value
)
};An edit returns a new instrument row; the original fixture remains a stable reset and test oracle.
Design decisions
Playback is a view over the score, not a second source of truth.
Audio clock over animation clock
Sounds are scheduled against `AudioContext.currentTime`; visual state follows the same step index.
Gesture-gated audio
The audio context is created only after Play, respecting browser policy and avoiding surprise sound.
Immutable editing
Arrangement presets and individual edits create new arrays, keeping reset and export deterministic.
Privacy boundary
No upload input, network request, model download, commercial recording, lyrics, or analytics exists here.
Quality and limitations
Tests prove the demo contract, not transcription accuracy.
- Node tests cover tempo clamping, immutable edits, arrangements, and export shape.
- Playwright covers edit, play, stop, export, keyboard-visible controls, mobile, and console/network safety.
- The demo does not infer drums, accept audio, measure model quality, or export MIDI.
npm install
npm run serve
npm run test:all