Final Project

For the ICM final, I don’t have much time to develop complicating code due to the workload. Instead, I integrate my interest in audio-visual into the last round of project.
I want to experiment with both 3D and 2D assets in p5.js to see the visual influence they bring to each other. Besides, to see how the features of soundtrack can be used for the animation and the ambient.


The sarcasm of machine worship distopia


citypop style soundtrack and GIFs

Code explaination

the fundamental part of this piece is to analyse the amplitude of soundtrack since its beats are clear according to the volume and frequency.
I drew rectangles in webGL to make it looks perspective so it will make the whole scene to be like 2.5D.
The size of individual rectangle size is also reactive to the amplitude of soundtrack.
The visual disco lights appear more when more spectrum has volume greater than 100. Also disco lights only appear when the whole volume is greater than mapped value of 30 so it will look like dancing to the music.
The GIFs’ animation will be paused when the beats are weaker before the chorus so it seems like swagging to the music.