Head UI/Graphic Designer|Hack@Brown 2020
Imagine someone else who listens to that exact Indie band you bumped into while drinking alone at a Brooklyn bar and fell in love with their music afterwards...
What it does
SyncUp takes your song and artist data from Spotify and runs a proprietary similarity function that weights song and artist popularity inversely to an overall score, so as to discourage matching people based on music everyone listens to. The algorithm focuses on trying to match you with other users that enjoy the same niche songs and artists.
Explore our interactive mockup below!
How we built it
I designed mock-ups and branding in AdobeXD first, then switched to Figma because it allowed further collaboration between members of our team. We wanted our UI/UX to flow well with the Spotify aesthetic and user-experience.
First interactive prototype: Matchr
(sounds too much like a dating app and looks too much like Spotify)
Challenges we ran into
- Chaining asynchronous post requests to retrieve paginated data
- Migrating from Node.js to React
- It was hard to design an MVP that feels complete and cohesive because of time limitations
- Difficulty hosting a React app on Github Pages
What we learned
- Our original front-end prototype was in Node.js, so we learned a lot about that before pivoting to React.
- Working with Spotify API
- Making post requests
- Recommending similar groups instead of just individuals
- Improving the similarity metric by tuning the sigmoidal function and adding to the data
- Showing a match's top shared artists and tracks
- More user statistics like uniqueness
- More involved UX like recommending a concert to a match
- Facebook integration