Creating a synthesizer with Beep.js

Just wasted a perfectly fine afternoon brushing up on my piano skills….
Beep is a JavaScript toolkit for building browser-based synthesizers using the WebAudio API. It takes a “batteries included” approach, meaning it boots up ready to give you the audio equivalent of “Hello, World!” without too much fuss. One line like synth = new Beep.Instrument() will build a bundle of Trigger interfaces, each with its own Voices for Notes—that is, a piano keyboard that you can begin banging on immediately. But what’s a software piano that can’t play itself? Use synth.scorePlay() to play the default score provided for you. (And yes, you can always write your own scores!)

The blurb above and descriptions below include some sample code. If you’re new to hacking around in the browser you may be wondering where that code’s supposed to go. Are you viewing this in a modern desktop browser? Then you can open up your browser’s JavaScript Console and start hacking away right now.

Check out the Git here or go straight to the demo and start procrastinating.

Leave a Reply