A precision metronome Progressive Web App built with Blazor WebAssembly, MudBlazor and the Web Audio API.
Live app: knerten0815.github.io/metrobones
Metrobones is designed for my drummer "Bones", who complained at rehearsal, that there are so many metronome apps in the iOS app store, but not a single one features clicktracks (which musicians use for songs with varying tempo or time signatures). I saw it as a good excuse to deepen my knowledge in fullstack web development, while simultaneously creating something that might actually be used by people.
- Create Click Tracks with different tempi, time signatures and click sounds throughout the track. Start your click at any section.
- Time signature support allows selecting beats-per-bar (1–32) and note value (1, 2, 4, 8, 16)
- Custom Beat Accenting - mute some beats for practice or accent additional beats in odd time signatures
- Subdivisions: divide bars into any number of beats
- Agogics: accelerate and slowdown click track sections over time
- Tap tempo with rolling average over the last 8 taps
- Precise click playback via Web Audio API lookahead scheduling
- Visual feedback highlighting the current beat
- Installable PWA - add to home screen and use offline on Android and iOS
- Export and import clicktracks as MIDI
- Notification controls via Media Session API
- Native Android app
- Setlists
- Visit knerten0815.github.io/metrobones
- Open your browsers menu (3 dots) on the website
- Click "add to home screen" (or "install" depending on browser)
- Use the app offline
- Blazor WebAssembly (.NET 9)
- Web Audio API — audio scheduling and click synthesis
- MudBlazor UI
- Hosted on Github Pages