Creative Coding with Codecademy #8: Audio Visualizations with p5.sound.js
12,044 ViewsApr 27, 2021Welcome 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
More details:
- 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.
p5.sound.js: https://p5js.org/reference/#/libraries/p5.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
Join the millions learning to code with Codecademy.
Learn to code: https://j.mp/3tW6cvH
Check out our full course catalog: https://j.mp/3xqbzpb
