Overview
Share the songs you love. Discover what the world is listening to.
Brief:
Music Note is a free web app where people drop the songs they love onto a world map, so finding new music means exploring the places and people behind it. I built it because I love discovering music through other people, but streaming platforms kept narrowing my taste instead of widening it, with no way to connect with other listeners.
Impact:
I designed and shipped it solo with no engineering background, from first sketch to live product, and it reached 286 visitors in its first 24 hours.
Personal Pain Points
Streaming platforms were narrowing my taste instead of widening it
Ideation
Discover, share, connect
• YouTube links over streaming integrations. They’re free, need no account, and work for everyone.
• Open-source maps over paid map services. MapLibre with OpenStreetMap data kept running costs at $0.
• Screen names over accounts. That means less friction and almost no personal data collected.
• Five live notes per person over unlimited posting. The cap keeps the map curated and limits spam.
• Approximate location over exact location. Notes land near you, never on your exact spot.
Final Design
Every pin is a song
Each shared song becomes a note on the map, shown as a vinyl record you can open, play and respond to. The experience follows four moments: exploring, sharing, listening and connecting.
Process
1
After brainstorming in my journal and making rough sketches, I explored wireframes, palettes and type in Figma, then used Figma Make to create a first draft, which I heavily edited.
Post Launch
Issues upon launch
1
Disappearing 48 hour notes left the map too empty. Expired notes now stay as past notes: still playable, but closed to new comments.
2
Phones broke first: The landing animation crashed iPhones, songs took two taps to play, and pulling down reloaded the page. I rebuilt the animation, made play work on the first tap, and turned pull-down into “swipe down to close.”
3
Unclear Discover button: Feedback showed people didn’t know what the globe button did. It’s now gold and expands into a labelled “Discover” button on hover.
Impact
Real people sharing songs they love
visitors in the first 24 hours
visits in the first month
music notes dropped in the first month
Learnings
For future projects
Clear Plans: AI builds whatever you ask, so the vision has to come from you. Writing the plan and the rules before building kept Claude focused on what I designed.
Technical Risks: Problems like the iPhone crash weren’t on my radar, because I approached the project as a designer. Next time, I’d test on real phones (both Android and iOS) before launching to the public.
Privacy a Decision: No logins, approximate locations, cookie-free analytics and blocked AI crawlers were deliberate product choices from the start, not afterthoughts.
Next Step, Keep the Music Playing: The map only works if people keep sharing. My next challenge is growth: getting Music Note in front of more music lovers so there’s always something new to discover.
