Vibeify

Vibeify instantly creates Spotify playlists based on your mood, genre, and era. Pick your vibe, and we’ll craft the perfect soundtrack for your moment—fresh, fast, and totally you.

Comment 2

Inspiration

We were inspired to create this project after coming to the problem of wanting to play new songs to fit a certain mood. When people are in a specific mood—whether happy, sad, or focused—they don’t want to spend time searching through generic playlists. Vibeify was built on the idea that the music listening experience should adapt to the listener’s emotions. By generating playlists based on mood, genre, and era, we make music discovery faster, easier, and more personalized.

What it does

Vibeify is a web app that allows users to input their desired mood, genre, and era of music. Vibeify will then generate a playlist that matches the specific user input, displaying 10 song recommendations and linking to the newly generated Spotify playlist.

How we built it

Backend was built using Express.js, utilizing OpenAI's API to pull recommendations for songs and then searching for those songs and adding them to a Spotify playlist using Spotify API. Frontend was built with help from Lovable, utilizing React, TypeScript, HTML, and CSS.

Challenges we ran into

Connecting to specific Spotify and OpenAI API endpoints was a difficult task to navigate. One of the main Spotify API endpoints that would have fit perfectly for our usage was deprecated, so we had to think of an outside solution. This is where we used OpenAI's API to generate recommended songs based on our user's prompts.

One of the main challenges we faced on the frontend was integrating it with our backend to ensure the intended functionality executed properly. Since we completed the backend first, much of our frontend design was shaped around the backend logic we had already built. Additionally, we used Lovable for design inspiration, but initially struggled to translate its TypeScript files into JavaScript. Ultimately, we decided to pivot and adopt TypeScript for our frontend to streamline development and maintain consistency.

Accomplishments that we're proud of

We successfully connected our two API connections to our front end to create a seamless flow of communication to create Spotify playlists in real time. We are also proud of our ability to navigate the challenges we faced communicating with the APIs and how we were able to design a creative solution that fit our needs.

What we learned

We learned how to design API communication pipelines to efficiently retrieve data from OpenAI, parse through the data to isolate valuable keywords, and use those values to create Spotify playlists on real user accounts. Having to pivot from deprecated endpoints taught us how to problem-solve and creatively adapt using the resources that we had. Building a backend before our front end taught us how to design and shape front end experience around our backend flow and logic. This approach made our app much more cohesive and user-friendly.

What's next for Vibeify

In the future, we plan to integrate a database to save user history, playlists, top artists, etc. An additional feature we would like to add includes a "Discover" function to build playlists using random inputs. Additionally, we plan to expand into audiobook and podcast recommendations based on an individual's mood & genre.

Share this project:

Updates