Ever since I got into coding, I was fascinated by music visualization programs such as Cthugha, G-Force, and MilkDrop. This project is at best a small homage to those programs (and the many more that have come and gone since). I decided to use MIDI files because:
- having access to the events/messages would allow me to create visualizations directly tied to notes, pitch, velocity, etc...
- representing music as set of instructions reminded me of playing off sheet music long ago in grade school
- it was easier than performing a frequency analysis ;)
The result is a much simpler visualizer than most (I'm a web developer, not a graphics programmer), but one that I hope feels more closely tied to the music.
Move your mouse around. Hold your mouse down. Press any/all keys on your keyboard (space will randomize some effects). Pretend like you are playing a piano. Have fun :)
- Mellon Collie and the Infinite Sadness - The Smashing Pumpkins (via midiworld.com)
- Flight of the Bumblebee - Nikolai Rimsky-Korsakov (via 8notes.com)
- Greensleeves - Unknown Composer (via tripod.com)
- Angel's Fear - Hiroki Kikuta (via khinsider.com)
- The Legend of Zelda - Title Screen - Koji Kondo (via vgmusic.com)
- Mega Man 3 - Title Screen - Yasuaki Fujita (via khinsider.com)
- Dica da Nutri - ana_locks (via color-hex.com)
- Monolith of Ideas - lovelylakes (via color-hex.com)
- Neon002 - daftblue (via color-hex.com)
By default we only include and use one instrument (acoustic grand piano) for all channels. For complete instrument support, download the MIDI.js Soundfonts from the link above, and change line 1 of js/app.js to:
var USE_FULL_SOUNDFONT_LIBRARY = true,
MIT. Free for any reason ✌(-‿-)✌