Case Study

Audio Dojo - Real-Time Audio Training Platform

A system for training musicians to identify audio processing changes like EQ, compression, and effects through interactive listening exercises.

The Problem

Musicians and audio students struggle to reliably recognize changes in audio processing such as EQ boosts, compression settings, and effects.

Traditional learning methods rely heavily on theory, with limited practical feedback or structured repetition.

The Solution

I built a dynamic quiz engine that generates listening exercises using real audio samples and applies audio processing in real time.

Users compare processed and unprocessed audio, answer structured questions, and receive immediate feedback with a final performance summary.

System Architecture

The system is built around a modular audio pipeline and a dynamic question generation engine.

  • Audio Manager handles playback, processing, and PRE/POST comparison
  • Question engine generates combinations based on parameters such as frequency and gain
  • Firebase stores question banks and enables dynamic updates
  • LocalStorage manages session history and results

Key Technical Decisions

  • Implemented a requestId mechanism to prevent overlapping audio playback bugs during rapid user interaction
  • Separated audio processing logic into a dedicated audioManager module for maintainability
  • Designed question data as structured JSON to allow scalable quiz generation
  • Combined Firebase and localStorage for persistence and performance balance

Challenges & Fixes

Handling concurrent audio playback was a major challenge.

Initially, stopping playback incremented requestId, which caused active playback promises to abort unexpectedly.

The fix was to decouple stop logic from request tracking, ensuring stable PRE/POST playback behavior.

Features

  • Real-time audio processing (EQ, Compression, Reverb, Saturation)
  • Dynamic quiz generation based on selected parameters
  • PRE vs POST listening comparison
  • Final summary with performance breakdown
  • History tracking with export (PDF / Excel)

Tech Stack

React (Vite), Web Audio API, Firebase (Firestore), LocalStorage

Call To Action

Explore the live product to see the listening flow, quiz structure, and audio comparison experience in action.

Try the Live Demo