UX Lead with a passion for all things UX, IA, Product Design, and Music
Screen Shot 2016-07-25 at 5.44.46 PM.png

Dronify: Web Audio API Experiment

I wanted to learn more about the Web Audio API and keep some of my coding skills up to date. As a result, I built a basic app that allows users to "Dronify", or add qualities commonly found in drone music, to a song of their choice.

 I first built a prototype to design the filters (or sound effects) I wanted to be able to apply to the sound.  I made a webpage with this dropdown (from @DonKarlssonSan’s example) of all filters and sliders to represent the Freq, Gain, and Q values to determine what combination of variables I wanted for each button.

I first built a prototype to design the filters (or sound effects) I wanted to be able to apply to the sound. I made a webpage with this dropdown (from @DonKarlssonSan’s example) of all filters and sliders to represent the Freq, Gain, and Q values to determine what combination of variables I wanted for each button.

 The  Web Audio API documentation at MDN  is excellent, thanks to  @chrisdavidmills . I worked to redesign the Mozilla Developer Network documentation in 2012, so it is also rewarding to use a tool I've had a part in contributing towards.  Additional helpful links:   SoundCloud API documentation    MDN Web Audio API docs    Fundamentals of Web Audio (O’Reilly)    HTML5 Rocks Web Audio API Intro    Making Music in the Browser (McMillen)    Code Academy SoundCloud API how-to exercise    Google Fonts (Droid Sans)    7 Ways to Toggle a Button in JS (Diaz)