Brussels / 4 & 5 February 2017


GridSound : A free HTML5 Digital Audio Workstation (DAW)

Pushing the boundaries of the Web Audio API

GridSound is a free open source HTML5 audio sequencer based on the new fresh Web Audio technology. Drag and drop your samples, mix them and create a composition directly in your modern browser.

GridSound uses many new HTML5 technologies, the main one is the Web Audio API which provides a powerful and versatile system for controlling audio on the Web. We chose to extract all the reusable Web Audio code into a standalone library: webaudio-library. The user's intial audio sample files have to be dropped into the app then into the samplegrid. For these actions we use the Drag and drop API, and for opening and read the files we use the File API. User Interface : We write our design with a modern CSS3 without any browser prefixes (eg : -webkit, -moz) and by using properties like transition and display: flex, the CSS is organised into different files using Sass (SCSS). The HTML part is separated into different templates, for that we use Handlebars. We use <canvas> to draw a live audio analyser of the master output, and all the audio waveform are drawn with SVG.


Melanie Ducani (Misty)
Photo of Thomas Tortorini Thomas Tortorini