Create a sketch that analyzes sound and translates it into something visual. Use live or recorded audio. Use color, video, images, pixels or whatever you fancy to represent the sound. Some ideas: imagine you are visualizing music for people who cannot hear. Can your visualization be as expressive as the music itself? Or maybe you are visualizing the differences in noise pollution in different cities? What does the sound of different cities look like?
I watched several videos from Shiffman’s Coding Train YouTube channel and learned the fft analyze. I wanted to do something simple yet visually pleasing. My current favorite song is Talk is Cheap by JMSN. Therefore, I sectioned the first half of the song for the assignment.
I started with the simple code that collected the information from fft.anaylze() and fft.waveform(). I then created different versions of using the color based of the mapped values from the collected information. I experimented with lines, ellipses, and rectangles.
When I was trying to experiment with rotate(). I made a mistake of placing the push() and translate() outside of the for loop I tried to generate. It caused the program to run very slow. I later realized the mistake and put the push() and translate() into the for loop.
I also wanted to experiment with lerpColor function. So the background changes subtly within a specific color range.
I also used DOM object to create the button. You can pause and continue the song. The function is quite simple. I learned a new function called pause() which is very handy for my future project.