Klasika
A curated classical music streaming app built for Massive Music Entertainment.
About This Project
Klasika is a curated classical music streaming platform created for Massive Music Entertainment — a Jakarta-based entertainment company with a catalogue of orchestral recordings, chamber music, and exclusive live concert recordings. Unlike mainstream streaming platforms, Klasika was designed for a discerning audience of classical music enthusiasts who needed liner notes, movement navigation, and conductor/soloist metadata alongside their listening experience.
I joined as the sole frontend engineer, with one backend engineer and a UX designer. The project went from concept to production in 8 months.
The Problem
Classical music has very different listening patterns compared to pop music:
- Long-form content: A symphony can run 60–90 minutes across 4 movements. Users need to navigate within a single track, not just between tracks. - Rich metadata: Listeners care about the conductor, soloists, orchestra, recording date, and venue — metadata that standard streaming APIs don't support. - Audio quality: Classical enthusiasts are sensitive to compression artifacts. We needed lossless audio support (FLAC/ALAC) while managing bandwidth efficiently. - Catalog discovery: The classical catalogue is organized by composer, era, instrument, and form — completely different from the genre/artist/album model of mainstream platforms.
Additionally, our budget was limited. We needed to build a production-quality streaming service without a large engineering team.
How We Solved It
I designed a component architecture that separated concerns cleanly:
Movement-aware Player: Extended the standard HTML5 audio API with a custom timeline overlay that maps movements to timestamps. Users can jump to a specific movement mid-track, with the progress bar segmented to show movement boundaries.
Rich Metadata Engine: Built a flexible metadata schema in MongoDB that supports nested performer credits, recording provenance, and editorial notes. The frontend renders this as collapsible 'liner notes' panels alongside the player.
Adaptive Streaming: Implemented HLS (HTTP Live Streaming) with quality ladders — the server serves 128kbps AAC for mobile/slow connections and 320kbps AAC or FLAC for desktop/fast connections. Users can override quality manually.
Faceted Discovery: A multi-dimensional search and filter system allowing users to browse by composer → work → recording, or by era, instrument, mood, and duration.
Key Capabilities
Movement Navigator
Jump to specific movements within a long-form work. Progress bar is segmented with movement markers and labels.
Liner Notes Panel
Rich metadata display with performer credits, recording details, program notes, and composer biography.
Adaptive Audio Quality
Automatic quality selection based on connection speed, with manual override for audiophiles. Supports up to FLAC lossless.
Faceted Discovery
Explore by composer, era, instrument, mood, duration, or ensemble type — built for classical music's unique taxonomy.
Offline Listening
Download albums and playlists for offline use. Encrypted local storage with license-aware DRM for protected recordings.
Live Concert Streams
Real-time streaming of live concerts with low-latency Socket.IO sync for synchronized listening rooms.
Under the Hood
React with custom Web Audio API hooks for fine-grained audio control. The player component was built from scratch — not using any existing audio player library — to support movement navigation and the custom timeline overlay.
Node.js with Express. MongoDB for flexible catalogue metadata. Audio files stored on object storage (S3-compatible) with CDN distribution. FFmpeg used server-side for transcoding uploads to multiple quality tiers.
Socket.IO for synchronized listening rooms — a feature that allowed users to listen together in real-time with a shared playback state. Useful for online listening groups and virtual concert events.
Impact & Outcomes
Launched to 5,000 beta users in the first month
Average session length of 47 minutes — significantly above industry average of ~20 minutes
Liner notes panel opened in 68% of listening sessions
FLAC quality selected by 34% of desktop users despite being the highest bandwidth option
Platform awarded 'Best Music App' at a regional digital media awards ceremony
What I Learned
Building Klasika taught me that domain knowledge is as important as technical skill. I spent the first two weeks just listening to classical music, reading liner notes, and interviewing potential users. That research directly shaped every product decision. The movement navigator — the feature users loved most — came directly from a conversation with a cellist who told me she always needed to skip the slow movements.