Working with Jeff and 3D artist Lucas Geitner, we created an immersive audio-visual listening experience. Rather than compromise on quality with real-time 3D rendering, we developed a frame-by-frame video sequence system that preserves Lucas's high-fidelity 3D renders while enabling smooth, interactive camera movements.

I engineered a custom playback system using 280 WebP-compressed frames organized into six navigable sequences (wide shot, left/right record views, and transitions between them). Using GSAP for interpolation and Canvas APIfor rendering, the system provides fluid 30fps-like camera movements between three interactive viewpoints. I implemented progressive loading with priority frames to ensure instant interaction while remaining assets load in the background.

The audio system is built on the Web Audio API as a dual-deck DJ interface with independent playback controls, queue management, and intelligent song transitions. Each deck features a custom waveform visualizer with scrubbing capability and a real-time frequency analyzer that displays FFT data when audio is playing. The crossfader uses gain node routing to blend between decks, creating an authentic DJ mixing experience.

This project presented unique challenges: maintaining ultra-high visual quality in a web environment, orchestrating complex audio routing with multiple gain nodes and analysers, and building responsive canvas-based visualizations. The result is a performant, immersive experience that pushes the boundaries of what's possible with web audio and creative video optimization techniques.

This project will be live soon and I will update the URL.