I wanted to noodle on a piano without needing an app or a MIDI controller. OpenBand runs entirely in the browser - realistic instrument sounds via soundfonts, keyboard mapping, and a recorder so you can play something back after you’ve figured it out.
Features
- Piano playable from your keyboard
- Realistic instrument sounds via Soundfont Player (General MIDI soundfonts)
- Record a session and replay it
TODO
- Other instruments - guitar, drums, synth
- Export recorded tunes as audio files
- Tempo and key controls
What I learnt
- How the Web Audio API works under the hood
- Managing simultaneous key inputs so chords don’t drop notes
- Loading and streaming soundfont files in the browser
Built with
- Next.js
- React Piano
- Soundfont Player
- tailwindcss
- Deployed on Vercel