Skip to main content
Browser ExtensionFull Stack DeveloperLivePersonal Project

8Dfy — Spatial Audio Chrome Extension

A Chrome extension that transforms YouTube audio into immersive 8D spatial sound in real time. Features binaural HRTF positioning, multi-band surround panning, binaural beats, eight audio presets, and adjustable bass, clarity, and reverb — all processed client-side with zero latency and no data transmission.

Built with

  • TypeScript
  • Web Audio API
  • HRTF
  • Chrome Extension
  • Convolution Reverb
  • Binaural Audio

The problem

Spatial audio normally requires either specially mastered content or a native application that captures system sound. Neither works for the audio most people actually listen to — arbitrary video already playing in a browser tab. Doing it in the page means processing a live stream in real time, with no buffer to work ahead in, and without the latency that would push audio out of sync with video.

How it was built

The extension taps the page's existing media element through the Web Audio API and routes it through a processing graph before it reaches the output device. Because the graph sits inside the tab, nothing is captured at the operating-system level and no audio ever leaves the machine — the privacy property falls out of the architecture rather than being a policy promise.

3D positioning uses HRTF — head-related transfer functions, the measured way a sound is filtered by the shape of a listener's head and ears before reaching each eardrum. Convolving a signal with an HRTF pair is what makes a sound register as coming from a specific point in space rather than simply from one side, and it is the difference between real spatial audio and stereo panning marketed as such.

On top of positioning sit multi-band surround panning, convolution reverb for room simulation, binaural beats, and adjustable bass and clarity — combined into eight presets so the common cases are one click rather than a mixing session.

The hard constraint throughout is latency. Audio processing that runs behind the video track is worse than no processing at all, so every node in the graph has to be cheap enough to stay inside the frame budget of a live stream.

Why this stack

  • Web Audio API — a real audio processing graph in the browser, not an audio element with filters bolted on. It is what makes per-node routing and convolution possible client-side.
  • Convolution reverb — impulse-response-based room simulation, the same technique used in digital audio workstations.
  • TypeScript — extension messaging between content script, background worker, and popup is exactly the kind of loosely-typed boundary where a type system pays for itself.

Outcome

  • Published and live on both the Chrome Web Store and Firefox Add-ons.
  • All processing runs client-side with no data transmission.

Frequently asked questions

How is 8D audio different from regular stereo?
Stereo places a sound somewhere on a line between two speakers. HRTF-based spatial audio convolves the signal with measurements of how a real head and ears filter sound arriving from a given direction, which lets the brain localize it to a point in three-dimensional space — including above, behind, and moving.
Does the extension send audio anywhere?
No. The processing graph runs inside the browser tab, so audio never leaves the device and nothing is transmitted.

Want something like this built?

I build across Web3, AI, and financial infrastructure — smart contracts, data pipelines, LLM systems, and the interfaces on top.