Boombox

Login screen
Selecting a decade
Mid-round, making a guess
Round over
Game ended, results screen

Inspiration

With the rise of Wordle and Worldle and Dordle and Quordle, etc., casual guessing games have been the newest fad sweeping the nation. As Spotify aficionados, we wanted a Music-le (a song guessing-game). The name may not have stuck, but the idea sparked Boombox: a musical guessing game.

What it does

Boombox is a name-that-tune web game that leverages the Spotify API to generate songs from throughout the decades, testing players on their song and artist knowledge. After choosing a decade playlist, the player is presented with 5 songs, with 30 seconds to guess each song’s title and artist name. At the end, the player receives a composite score based on how many songs and artists they correctly identified.

How we built it

We built Boombox in ReactJS and SCSS with heavy use of the Spotify API. We started with setting up Spotify authentication for our app and calling the API to get songs from a given playlist. Over the day, we pieced together the core gameplay functionality for our minimum viable product and later added styling, patched bugs, and implemented a few extra features.

Challenges we ran into

Getting into the groove with React Hooks, we frequently ran into trouble with JavaScript synchronization. We also had some snags trying to incorporate various pre-made React components from npm to save time.

Also, Spotify’s API limits which users can use an app in development mode, so we had to whitelist our own accounts and create a dummy account for others to try out the game with. In the future, we’d like to upgrade the app’s Spotify API privileges so that anyone can log into their own account and play using their own library.

Accomplishments that we're proud of

We’re really proud of our slick user interface and had a great time ideating and sketching out designs. We’re also proud of how quickly we were able to integrate Spotify’s API into our project, leveraging existing JavaScript wrappers.

We also added a bunch of cool details, like leveraging Spotify’s song metadata to make each round get progressively more difficult by presenting songs with progressively lower popularity scores.