Meet Brian: The Production Engineer Who Wanted Better Music
Before joining Sigma School, Brian Khong spent his career as a production engineer. But beneath that title, he wanted to become a software developer and build apps that solved real frustrations in everyday life.
For Brian, that frustration came from a familiar place. Ads. They cut into songs at the worst possible moments, interrupting workouts, commutes and focus time. The constant disruption inspired Brian to build TuneFlow, a clean and simple music streaming app that lets users listen without interruption.
Bryan's Problem With Free Music Platforms
Anyone who has used Spotify’s free version knows the pain of sudden ads.
Brian identified two major pain points:
- Constant ads interrupt listening sessions. Ads appear frequently and disrupt the flow, especially during commuting or studying.
- Limited playback control on free platforms. Users cannot choose specific songs from their playlists and are forced into shuffle.
There was a clear gap for an ad-free platform that prioritizes clean UI, better playback control and a smoother experience. Brian wanted to fill that gap with TuneFlow.
Introducing TuneFlow: An Ad-Free Music Streaming Experience
Brian built TuneFlow as a web app that focuses on simplicity, speed and user freedom. The platform lets users search for songs, create public playlists, explore community playlists and enjoy fast playback without ads.
Tech Stack
- Frontend: React.js
- Backend: JavaScript
- Database: SQL
- APIs: YouTube Music API, Spotify API
- Third-Party Tools: React Player
React Player was especially important. It allowed Brian to build a custom player with a seek bar, loop settings, volume control and a smooth autoplay experience.
What Users Can Do
- Create, edit and delete playlists
- Upload custom playlist covers
- Make playlists public for others to explore
- Play songs with custom controls
- View recently played tracks
- Browse public playlists from other users
- Enjoy a clean and responsive interface
- Loop songs, adjust volume and skip freely
- Experience fast search from Spotify and YouTube sources
TuneFlow works across desktop and mobile, with future plans to improve mobile playback controls.
Tackling the Hard Problems: Brian’s Developer Journey
1. Incorrect Song Playback From YouTube
When searching for a Spotify track, YouTube sometimes returned unrelated videos due to naming differences.
This caused wrong songs to play, which was a major user-experience issue.
Solution:
Brian designed a custom scoring system that compares Spotify titles with YouTube search results.
The algorithm returns the closest match based on score, increasing accuracy to about 80 percent. He continues fine-tuning it to reach even higher precision.
2. Linking Spotify and YouTube Data
Mismatched metadata made it difficult for the app to consistently pull correct audio sources.
Solution:
He refined the matching logic and improved the conditions that validate each result, reducing errors.
3. Autoplay Limitations
Chrome blocks autoplay on inactive tabs, preventing continuous playback.
Solution:
Brian documented this limitation clearly and implemented fallback suggestions, including recommending Firefox for users who want full autoplay functionality.
Lessons Learned: From APIs to Full-Stack Thinking
Throughout the project, Brian strengthened his skills in:
- Integrating external APIs using documentation
- Building a full stack application with React and SQL
- Implementing custom playback logic
- Debugging complex problems with scoring algorithms
- Creating responsive UI layouts
- Managing state and data flow in real time
- Handling third-party tools like React Player
- Using community feedback to refine the experience.
His favorite part was seeing everything come together, especially once the playback controls and playlist system worked seamlessly.
A Portfolio Worth Showing: TuneFlow’s Real-World Potential
TuneFlow is a platform with genuine potential, especially for users who want a simple, ad-free alternative to major music apps.
With plans to implement lyrics, better mobile controls and social features like liking and following playlists, Brian is already thinking about future versions.
Most importantly, TuneFlow represents Brian’s transition from engineer to full-stack developer. His app shows determination, creativity and a clear understanding of user needs.