Audio Visualizer

image.png

image.png

https://youtube.com/shorts/5JFL4XyVj2Y?si=TJA11ILxdZJ_n09c

When I think of a sound machine, I’m reminded of the little science experiments my elementary class used to do with empty glass bowls – filling them with various amounts of water to change the pitch they rang out when you clinked them. Using the same concept, the Audio Visualizer is an interface on p5.js that both clinks and shows you the pitch and intensity of the note!

(The sound making machine is the first picture)

~ Serena Yung


Prototype / Building Process

  1. Glass instrument - sound machine I wanted to make use of some pretty vases I had lying around my room - inspired by water instruments! When you vary the water level in a bowl/glass and clink it, it produces different notes.

image.png

  1. p5.js Audio Visualizer Initially, I was thinking of making an automated symphony with a variety of glass bottles. But upon realizing that I have a limited set of vases, and the solenoid doesn’t produce sounds as intense as I wanted, I decided to pivot. I wanted to make an interface on p5.js in order to visualize the 1) pitch, 2) note, 3) volume and frequency (common-ness of the sound).

Screenshot 2025-04-04 at 2.35.33 PM.png

Each color represents a different note, size represents volume, and they move randomly across the screen for a cool visual effect!

There’s also a neat waveform being drawn through the background of the screen :)

3. Final Product

Video

https://youtube.com/shorts/5JFL4XyVj2Y?si=TJA11ILxdZJ_n09c


Code: p5:js - view here Arduino - basic blink for solenoid


Conclusion / Reflection

I loved designing a visual interface for a sound machine! If I had more time, I would definitely try to build an enclosure/home for this - Dr. Sudhu brought up a good point that my hand was muffling the sound at which they rang out. So, perhaps something that could levitate the vases in the air, like through a string of some kind, so that the sound could be more resonant.