SpektralMix

Mixing 2 songs at once
Mixing options

Inspiration As a musician whose DJ career is on the rise, I’ve been super plugged into how tech is changing how we create and perform. I'm deep into both audio and AI, so it made sense to build something at that intersection. SpektralDJ is me blending my love for music with browser-based tools that feel pro but fun. I wanted something artists like me could just open up, load their tracks, and start experimenting, without installing anything, just pure creative flow with some neon magic on top.

What it does You can upload MP3, WAV, or M4A files and start mixing right in your browser. Each track loads onto these two carbon-fiber inspired platters with waveforms you can scrub through. Cue preview works by holding down in headphone mode so you can plan your drops tight. You can loop or roll a section instantly with a double click, all snapped to the beat. One click syncs BPM between decks, and the visuals pulse in real time -> everything from frequency bars to liquid wave effects that respond to your mix.

How we built it

Frontend’s all in Next.js with React hooks managing deck state -> buffers, BPM, loops, all that. The core audio engine runs off the Web Audio API with a shared AudioContext and per-deck sources, gain control, filters and analyzers. Visuals are piped through Canvas and WebGL, synced with live audio data. Tracks persist using localStorage so they stay put across sessions. For the look and feel, I used Tailwind and CSS variables to lock in a neon-on-dark vibe that feels like an actual DJ rig.

Challenges we ran into Biggest headache was that AudioBufferSourceNodes only play once—so I had to rebuild the entire audio graph every time you hit play or toggle loops or change pitch. Syncing loops perfectly without glitching took a lot of timing work and tiny crossfades to smooth out clicks. Mobile optimization was another rabbit hole—ended up debouncing waveform updates and cutting down draw calls so battery doesn’t tank when you're just previewing a track.

Accomplishments that we’re proud of Cue preview in headphones works instantly without touching the main output—that took finesse. Loops lock to the beat no matter how fast you're working the interface. The UI feels like an actual booth, dark, clean, responsive. And it handles all major file formats with solid error fallback, so you’re not stuck if a track doesn't load right.

What we learned You have to be super strict about cleaning up audio nodes or the whole thing melts down over time. Making complex audio tools feel dead simple is way harder than it looks. And performance tuning on something this visual and interactive is a constant battle, especially on mobile where every draw and event counts.

What’s next for SpektralMix Next step is to let people record and export their live sets. Built-in FX like filter sweeps, delay throws, maybe some reverb shimmer are on the roadmap. I want to add sample pads for drops and loops. Eventually, remote collab and synced sessions so people can jam together online. And of course, a mobile version that doesn’t feel like a compromise but is fully touch-native.