The problem
An effect is difficult to tune when the live preview and exported audio use different settings or processing paths.
Creative technology / 2026
Beautiful Ruin
Browser audio processor for auditioning effects, comparing dry and processed sound, saving snapshots, and exporting WAV files.
My role
Audio interface design, DSP implementation, and render-comparison tooling.
What I built
- Browser audio preview with dry/processed comparison
- Saved effect snapshots and WAV renders
- Listening and regression manifests
The result
A local audio-processing prototype that supports repeatable effect auditioning and exported renders.
Statusprototype
Evidencedocumented
Record reviewed
Implementation
How it works
Upload audio, inspect its BPM, key, waveform, and spectrum, then audition authored effects. The AudioWorklet preview and offline DSP use shared preset definitions; snapshots retain settings for comparison and WAV export.
Technical context and methods
The implementation includes a browser processor and a headless audio-evaluation harness. Three effect families have revisioned manifests and active tuning records; seven of the ten families remain code-first implementations.
- Next.js
- Web Audio
- AudioWorklet
- TypeScript
- DSP
- WAV export