Blueprint

Inspiration

Duke seniors spend their last months talking about their last home games, last late nights at Perkins, last walks through the quad. But those moments end up scattered across camera rolls and group chats, eventually forgotten.

We wanted to pin them to the map.

What it does

Blueprint lets Duke seniors drop memory pins on a fantasy-illustrated map of campus. You can attach photos, voice memos, and songs to the exact places where moments happened. It's essentially a living yearbook tied to real places.

How we built it

Frontend: React + Vite with a custom pan/zoom map engine
Backend: FastAPI + SQLite, containerized with Docker and served via Nginx
Auth: Email/password + Google OAuth via a manual PKCE flow through Auth0
Media: In-browser audio recording (MediaRecorder API), photo uploads, YouTube embeds via oEmbed
Share: html2canvas captures memory cards as downloadable PNGs

Challenges we ran into

Implementing Google OAuth from scratch via Auth0's PKCE flow meant debugging token exchange and callback mismatches.

Building the pan/zoom map engine without a library required careful pointer event math to get drag, zoom, and level transitions feeling natural. On top of that, designing a fantasy-style illustrated map of Duke's campus from scratch required significant manual effort, as using only image-generation tools was insufficient.

Accomplishments that we're proud of

The map feels alive. Watching our own pins drop onto campus landmarks (with photos, voices, and songs attached) is pretty cool. We're also proud of shipping a polished full-stack app end-to-end within a single hackathon window, including features like auth and media uploads.

What we learned

Browser APIs are more powerful than people give them credit for. And scope discipline at a hackathon is everything (we had a lot of ideas initially, but we didn't have the time to complete them all).

What's next for Blueprint

Opening it up beyond Class of 2026. Better collaborative features so friend groups can build shared memory maps together. An approach for scalability (how crowded the map might get, etc.). And maybe even a printed yearbook export.