Exploring web audio from different perspectives: p5.js (Processing), cashmusic.js, and BBC future media dive into audio in the browser
In this session we'll look at a few different approaches to visualization and web audio, with specific detail around p5.js and cashmusic.js.
p5.js is a front-end library for creating graphic and interactive experiences, based on the core principles of Processing. Jason Sigal will lead a detailed look at some of the visualization capabilities of p5.js and how it can render audio data to visual display. >> p5 micro-session
cashmusic.js is a library aimed (among other things) at DOM manipulation based on position in an audio track — tweening and changing styles via simple JSON interface. This is a library coming out of dormancy, so we'll explore ways of creating free-form DOM manipulated art with audio as a canvas. And maybe we'll hack it all kinds of up along the way.
At the BBC, we want to get teenagers interested in technology through creativity and music. To do this, we are exploring 'music visualisations' using Web Audio and HTML5 Canvas. We want your ideas on two main topics:
- What 'music' data can we extract from songs using the Web Audio API? E.g., can we detect when vocals kick in, can we differentiate between a verse and the chorus?
- What weird and wonderful things can we do with HTML5 to react to music? We all remeber those swirling patterns from windows media player visualisations, but can we do something a bit more creative and original?