D3 music visualization
Try playing some music, and see if the bubbles start dancing! If you're experiencing problems, try switching to Chrome, and enable WebAudio API to access your microphone. Sometimes this API will complain about insecure origins, in which case, just open index.html in your browser manually. Sorry about the complications!This started at Spotify's Music Hackathon in April 2016 with two of my friends. The purpose of this project was to play around with JavaScript Web Audio API and to find appropriate methods to convert raw audio signals from Fast Fourier Transform (FFT) to human-compatible levels. This led us to experiment with Mel frequency cepstral coefficients (an algorithm commonly used for speech analysis tasks).
To see the differences between the raw mapping of sound frequencies and MFCC see the visuals below.
Visualizations:
- MFCC
- FFT bars
- FFT D3 balls
- FFT D3 lines
For technical details and collaboration, please see the Github repo above.