I made a 🖥️ digital 🖥️ bumper sticker that shows what I'm listening to on Spotify at any given moment! It's fully…

I made a 🖥️ digital 🖥️ bumper sticker that shows what I'm listening to on Spotify at any given moment! It's fully open source and came together pretty quickly tbh 🧵

First I needed to find a display. Really wanted to do e-ink but the only one I could find with a suitable size/aspect ratio was sold out. But I found this full color 11 inch bar display on AliExpress. Runs on 5V and has HDMI input, so I figured it would be easy to work with

To drive the display, I was hoping to use a RP2040/2350 but wasn't sure I'd be able to get the resolution high enough. Could have maybe tried driving directly with MIPI but that seems like a nightmare. Ended up going with a @Raspberry_Pi Zero 2W....

But that meant more power consumption. Wanted to use a battery, but would have had to recharge often with the Pi Zero. Realized by looking at my car's wiring diagram that I could splice 12V power from the backup camera, and that it would only be hot while the car was running!

So! I wired up a cheap little buck converter to knock the 12V down to 5, and then gently adhered the pi to the back of the monitor. I found this awesome 2 inch heatshrink and used that to encase the whole package. Way easier than designing an enclosure!

Also threw some magnets inside the heatshrink so it would attach to the car easily (I added more/stronger magnets than what's showin in this vid)

Now I needed to actually get my Spotify data! I already use last.fm for scrobbling, so I figured I'd piggyback on that connection. I wrote some code to scrape my own profile to get the last played song (I know you can use their API, I didn't want to add auth)

The code lives on @ValDotTown which is amazing place to get your web-based app up and running. Used their editor to define a function that I could invoke via HTTPS and return my now playing data as a tiny bit of json

@ValDotTown Also decided to use val.town to deploy some image generation code. The bumper sticker itself is rendered in typescript using a canvas lib. (both of these functions are mirrored on this project's github repo btw)

Full explainer video is up on YouTube! (key details in the rest of the thread here) youtu.be/mWRPRW6pHIY?si…

(ignore the fact that I'm pulling a an entire font file from somebody else's github repo each time this runs - meant to ask @stevekrouse if there's a clean-ish way to keep assets like this around on vt?)

Now I needed to get the image from the backend down to my screen. Initially was just going to hotspot my phone while I drove and have the Pi fetch directly over wifi, but then I remembered I had a @particle Boron dev board with a cellular plan! store.particle.io/products/boron…

So I pulled my image rendering function down on to the Pi to run locally (VERY easy because val.town runs on deno), and set up the Boron to fetch now playing data and retransmit it over Bluetooth. The Boron just sits inside the car, plugged into a cigarette lighter

still updating the repo, but the gist of what happens on the Pi: - at login, use framebuffer to display the latest image and reload every few seconds loop { - search for Boron over BLE, connect and pull data - use pulled data to render image using deno } github.com/dupontgu/now-p…

💿💿💿