Creative Coding with Codecademy #8: Audio Visualizations with p5.sound.js10,770 ViewsApr 27, 2021
Welcome to Creative Coding with Codecademy!
In our final session, Curriculum Developers Jiwon and Nick show us how to add audio to a p5.js sketch. Check out the full course here: https://j.mp/3gtaxmg
- In this video, we will create audio visualizations using the p5.sound.js library. Our team will learn how to load sound files to our p5.js sketches and talk about analyzing sound with FFT (Fast Fourier Transform). Using amplitude values along the frequency spectrum, they will create an animation that reacts to sound.
Info on FFT: https://en.wikipedia.org/wiki/Fast_Fourier_transform
Example Audio Visualization code: https://editor.p5js.org/js6450/sketches/XYnHHUIP7
Code during livestream: https://editor.p5js.org/js6450/sketches/_J6BWk8lP
FFT Waveform code: https://editor.p5js.org/js6450/sketches/csH9A0zv4
FFT Spectrum code: https://editor.p5js.org/js6450/sketches/oWAOKGOMS