Statify is a "higher or lower" web game using the Spotify API. After connecting their account, players guess which of two songs has a higher popularity score. Correct guesses increase your score, while an incorrect one ends the round. The app features a sleek, dark-themed UI built with React and Tailwind CSS.
No followers yet
Once you ship this you can't edit the description of the project, but you'll be able to add more devlogs and re-ship it as you add new features!
I've successfully migrated our backend from an Express server to a single Vercel serverless function. A key challenge was resolving a Spotify Illegal redirect_uri error, which was caused by Vercel's unique deployment URLs. I fixed this by using the VERCELPROJECTPRODUCTION_URL environment variable for production builds, stabilizing the authentication flow.
I started by building the foundation of the application, focusing first on getting the Spotify login to work securely. My goal was to allow users to connect their accounts as the first step. Once that was handled, I created the core game mechanic: a system that pulls two random songs from Spotify to present to the player in each round. I made sure the song selection was varied to keep the game interesting. With the core logic in place, I shifted to the user-facing side of the project. I designed the main screens, from the initial login page to the game itself, and the game over screen. I created the visual elements for displaying the songs and the player's score, and I chose a dark, terminal like theme to give it a polished look.
Most recently, I focused on making the gameplay feel seamless and fast. I implemented a pre-loading system so that the next pair of songs is already fetched while the player is still on the current round. To complement this, I added smooth animations for the transitions between rounds.