The Vault Soundtracks

multiple mobile screens displaying an app UI
a smartphone on a desk displaying a homepage
three app screens, homescreen, Spotify connect screen and a join screen with a QR code
two app screens, a playlist with track titles and album artwork, a homepage with action buttons and album artwork
Streamline Group Music Selection

The primary objective of The Vault Soundtracks is to create a collaborative music experience that solves the challenge of choosing music for groups with different tastes. The app explores how Spotify listening data can be used to generate playlists that fairly reflect each group member’s preferences. By combining this data with real-time input, the project shows how technology can support more inclusive and enjoyable shared listening.

A key feature is the voting system, where users approve or reject tracks, making the process interactive and democratic. This ensures that playlists aren’t just algorithm-driven but shaped by the group’s input.

Technically, the project combines Flutter for mobile development, Express.js for backend logic and Spotify API integration, and Firebase for real-time database reads and user authentication. These tools enabled a smooth experience and effective data handling.

Through this project, I explored user-centered design in music curation systems and built a responsive, collaborative interface. It also strengthened my skills in fullstack development, third-party API use, and real-time feature implementation.

Project Outcomes

The final outcome of The Vault Soundtracks is a fully functional mobile app that allows users to generate collaborative playlists based on Spotify listening data. Users can connect their accounts, see combined music preferences, and vote on tracks to create a playlist that reflects the group’s shared taste. The integration of Flutter, Express.js, and Firebase proved effective in delivering a smooth and responsive user experience.

A significant portion of the development process focused on implementing and managing Spotify’s OAuth flow, including securely handling access and refresh tokens across sessions. This involved creating middleware and backend logic to validate tokens and protect API routes. On the frontend, I worked with Flutter to build a responsive UI while handling asynchronous data fetching and real-time updates from the Firebase NoSQL database. Structurally, I followed a layered architecture using a clear separation of concerns, organizing the app into controllers and services. This approach improved maintainability and allowed for reusable, modular code. The emphasis on clean architecture and scalable design contributed to a more organized development workflow.

Project Overview

A collaborative playlist generation Android app designed to solve the challenge of group music selection. Using Spotify's Web API, it analyses multiple users listening data to create dynamic playlists that reflect everyone's musical tastes. Users can vote on suggested tracks, making the experience more interactive and democratic. Built with Flutter and Express.js, the app uses Firebase for real-time updates and user authentication, ensuring a smooth and engaging experience.

Collection
Author/s

India Heath

Discipline
Coding
UI/ UX Design
Web Design
Service Design