I recently came across this series of beautiful visualizations… Sharing it here for inspiration.
I love how it converts musical art to visual art! It actually made me want to make a music-related piece, too. I don’t have a particular idea in mind yet. There could be a lot of directions. The author of these visualizations worked with the notes, but stuff could be done with the wave files (which reminds me of good ol’ Winamp :D).
Ahh wow that goes way back!
The original wave simulation was done in 2012! Part of HTML5Examples (source).
I just went through and upgraded the code to be more modern. Fun!
Cool stuff!
I noticed that the project is made with Jekyll. I wonder why that is case, especially that it is just a single page. Unless there is something I’m missing, this seems quite manageable by just coding the HTML/CSS directly without needing a site generator, right?
Ah yes, we did decide to use Jekyll because we wanted to give the client the ability to edit text copy and labels by simply editing files using the GitHub Web-based editor. Since GitHub pages is already set up so that Jekyll “just works”, we wanted to leverage that for the automatic building of the static site in response to changes in the files, whenever they were edited.
We could have achieved the same effect by dynamically fetching each and every file that defines copy or labels, but then the app would have ended up fetching so many files and taking a long time to load, OR we’d need to consolidate all configuration into a single place.
That’s why we went with Jekyll, as far as I can recall.
