“Golden Sun” Visualization – Teresa Lum

"Golden Sun" Visualization - Teresa Lum



I love music. I’ve always loved it and I’m pretty sure I always will, but unfortunately I just don’t have the ear for it. To make up for that, I applied my love for graphics and visual art to create a visualizer, using p5.js, for the song “Golden Sun” by Sweater Beats. I chose the song because it was dynamic enough to drive the visuals while not being so complex it distracts from it.

I started out with one single white circle against a black background, its size changing with the song’s amplitude. The background color corresponds with a range of frequencies, which I used the FFT to figure out. More circles, a waveform mapped to the song’s amplitude, and dots in the background were added for visual effect.

This project was a good learning experience for working with JavaScript. I had a lot of trouble understanding FFT and limiting the background to just one range of colors, but it was very rewarding to see it all come together. I wanted to keep my graphics clean and simple to achieve a minimalist aesthetic.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>