Back to writing

A music visualizer you can drive through

Used Opus 5.5 and GPT Astra 6 to vibe code a music visualizer over a few days. It's essentially audiosurf in your browser - you drive to the song and the world dances to it.
Still insane to me that this can be built in less than a week, mostly through overnight runs where the agents worked 6 hours straight while I slept.

https://music-visualizer-audio.ekeric13.chatgpt.site

This was kind of a sentimental one, since a music visualizer was one of the first web dev projects I built and deployed.
Back then, you uploaded an MP3 and it would play and visualize it. No idea how I put it together circa 2014. These days you paste a YouTube link (who still has MP3s??), and the visualization is built in Three.js instead of my old jQuery setup.

My favorite little "growth hack" I did for this one: change youtube.com to youtubedrive.com in a video's URL and it will automatically import the song. No copying and pasting urls required.
If someone has already imported a song, it's immediately playable. I do another fancy trick to make new songs playable as soon as possible. I do a quick first pass that analyzes beats, amplitude, and frequency to get the visualization running within a few seconds. But then in a background job I use ML models (think Demucs, nothing fancy) to separate the vocals from instruments and get a more detailed analysis in general. If you refresh after a few minutes you get an improved drive.

There are eight different "worlds" to drive through. In my experience, models tend to be strong at "punk" aesthetics, so I leaned into synthwave, cyberpunk, and solarpunk. Then I did visual references they know well: Hokusai, van gogh, etc. Used Blender MCP for much of the asset work, with some visuals generated by image models.
Put together an eval suite spanning pop (Golden), EDM (L'Amour Toujours), ambient (Brian Eno), jazz (Oscar Peterson), classical (Debussy), and more. Wanted this to generalize across different types of songs.
Claude was great at coding, but the creative direction was surprisingly lacking. I had to supply lots of references and ask for several versions of the same idea, then choose what worked.

The infrastructure is through ChatGPT Sites: a Cloudflare Worker for the backend and R2 for storage, with a 25 MB cap per song. It was very, very, very nice not having to set all of that up myself. Hoping people don't abuse the free hosting Cloudflare and OpenAI have made available.
The main constraint was the Worker isolate: I couldn't just run tools like yt-dlp, ffmpeg, or PyTorch there, so I hosted my own cloud container for some operations.

I actually think the game is quite fun. Usually vibe coded games are not. The models are great at putting a lot of code together and making it look impressive, but they don't naturally have a good sense of what's fun.
Works on desktop and phone. No account required. Your song library stays in your browser, so you'll need to add the link again if you change devices... but you will be able to play the song instantly!