Musical Canvas

Inspiration

Music is one of my favorite things, and I often think about what it would be like to be able to see this music. On the flip-side, what if we could hear colors and shapes?

What it does

Taking in a user-inputted mp3 file, this project converts the audio file to a series of chords, then takes the quality of those chords and its intervals to draw something on the canvas!

How we built it

Using HTML, CSS, and Javascript, as well as the Essentia and Teoria libraries (as credited on the site)

Challenges we ran into

I am not highly comfortable in web development or audio analysis, so this was an amazingly rewarding experience and fun project to do!

What's next for Musical Canvas

I'd like to fully flesh out the idea of what chords or intervals match with what shape. The shapes for now are done based on an inkling of a feeling, but I'd like to add more support with the different shapes and colors that chords can create! I would also like to develop this into a real-time paintbrush, where you can play music and it paints on the canvas as you play.