Next.js · Web
Groove Weaver
A music maker for kids: tap squares on one grid of rainbow notes and drums, press play, and hear the song loop.
It opens with Twinkle Twinkle already on the grid, so the first thing a kid does is press play. Each rainbow row is a note from C up to C, and the three drum rows are marked with pictures, so kids who can't read yet know which is which.
Who it is for
For kids from kindergarten to grade 5, and the teachers running music class. There's nothing to read, no account and nothing to install, and every sound is made by the browser, so it works on school Chromebooks and networks.
How it works
02
Seven starter songs and beats, from Old MacDonald to Hot Cross Buns, load in one tap. Band, Toy box and Robots change how the same song sounds, and Slow, Medium and Fast set the speed without a BPM number in sight.
grooveweaver.com
03
The column lights up as it plays. Every square also sounds the moment it's tapped, so kids hear what they did before they press play.
grooveweaver.com
On a phone
It's built for tablets and Chromebooks, but the whole grid still fits on a phone.
Good to know
- Songs auto-save in the browser, and Share puts the whole song in a link, ready for Google Classroom. Nothing is uploaded.
How it is built
Next.js and the Web Audio API. Every note and drum is synthesized in the browser, with no sample files.
Next.js · Web Audio API · TypeScript
What it costs
Free
$0
No account and no ads. Everything runs in the browser, and songs save on the device they were made on.
- Every starter song, speed and sound set
- Auto-save in the browser
- Share a song as a plain link