Inspiration

Noise destroys your hearing painlessly, permanently, and invisibly. You can't perceive the damage until it's already happened — so the commute, the gym, and the headphones that are doing it feel completely normal. Statistics don't change behaviour; hearing the damage does.

I wanted to build something that makes the invisible audible — not a chart, not a number, but the actual experience of hearing loss applied to your own environment.

What it does

AfterSound measures the noise in your actual room, projects your hearing forward using NIOSH criteria, and replays five seconds of your own audio through your projected future ears — so the damage is audible before it's irreversible.

  1. Measure your room — Click "Listen to your room" (or try a sample scene: subway, café, gym). The app shows a live A-weighted dB readout, a real-time spectrum visualizer, and your NIOSH safe daily exposure time. It captures 5 seconds of audio.

  2. Hear the future — The captured audio plays back clean, then replays through a projected hearing loss filter chain. When loss is significant, a faint 4kHz tinnitus ringing is mixed in — you don't just hear less, you hear a constant ringing. An audiogram draws itself showing the projected loss. Drag the age and exposure sliders to see the projection change live.

  3. Test your actual ears — A 90-second adaptive staircase hearing test measures your real thresholds at 1 kHz and 4 kHz, then overlays them on the projection.

How we built it

Three real DSP subsystems, all client-side, no backend:

  • A-weighted LAeq sound level meter — An AudioWorkletProcessor applies A-weighting (IEC 61672-1 approximation: 4 cascaded biquads), computes instantaneous SPL, and does exponential averaging in the linear energy domain. The NIOSH dose calculation uses the 3 dB exchange rate.

  • NIPTS projection + resynthesis — Projects noise-induced permanent threshold shift at each audiometric frequency, then applies the audiogram as a multiband biquad peaking filter chain with Q widening to model spectral smearing (loss of cochlear frequency selectivity), plus a highshelf and dynamic lowpass for broad high-frequency rolloff. When average loss exceeds 15 dB, a tinnitus layer mixes in a 4 kHz pure tone (the most common tinnitus pitch in NIHL) plus broadband noise simulating the raised noise floor and reduced dynamic range.

  • Adaptive staircase audiometry — A 2-down/1-up staircase (Levitt, 1971) converges on the 70.7% correct threshold. Step sizes start at 5 dB and reduce to 2 dB after the first reversal. Threshold = average of the last 4 reversal points.

Tech stack: Next.js 16, TypeScript, Tailwind CSS 4, audiomotion-analyzer (spectrum visualization), GSAP (animation), Web Audio API (AudioWorklet, AnalyserNode, biquad filters, oscillators). Fully client-side — no backend, no database, no API keys, no accounts.

Challenges we ran into

  • AudioWorklet + AudioContext lifecycle — Managing cleanup across phase transitions without leaving dangling AudioNodes that throw InvalidAccessError on disconnect.

  • GSAP from() animations — The from() API immediately sets elements to the "from" state (opacity:0). If the animation is killed before completing (e.g., when prefers-reduced-motion changes), elements stay invisible forever. Fixed by calling gsap.set() to reset elements before every animation.

  • Making hearing loss audible — A simple attenuation filter isn't perceptually dramatic. Real hearing loss involves spectral smearing, high-frequency rolloff, tinnitus, and reduced dynamic range — not just volume loss. The resynthesis chain needed Q widening, a highshelf, a dynamic lowpass, a 4kHz tinnitus oscillator, and a broadband noise floor to sound right.

Accomplishments that we're proud of

  • The A/B playback is the money shot: one click, you hear your room, then you hear it through your future ears — including the tinnitus ringing. No imagination required.
  • The entire app is client-side with zero external dependencies — no API keys, no backend, no database. It works on any device with a microphone.
  • Honest limitations are disclosed in-app and in the README. The NIPTS model is our own approximation (not ISO 1999, which is paywalled). The ear test is not a clinical audiometer. We say so plainly.

What we learned

  • The Web Audio API is powerful but unforgiving — AudioWorklet lifecycle management is the hidden complexity of any serious audio app.
  • Psychoacoustic methodology (staircase audiometry) is surprisingly implementable in the browser, but calibration is the hard part.
  • Hearing loss is not just "things get quieter" — it's a loss of frequency selectivity that makes speech muddy and music dull, plus a constant ringing that never stops. Modelling that distinction is what makes the A/B playback land emotionally.

What's next for AfterSound

  • More audiometric frequencies in the ear test (currently 1 kHz and 4 kHz)
  • ISO 1999 compliance if the standard becomes available
  • On-device sound source classification ("72 dB — traffic and speech")
  • Temporal smearing and loudness recruitment in the resynthesis engine

AI assistance disclosure

This project was built with assistance from Devin (Cognition), an AI coding agent. All code was reviewed and deployed by the human developer (me).

Built With

  • accessibility
  • audio
  • dsp
  • hearing-health
  • nextjs
  • noise
  • preventive-care
  • public-health
  • typescript
  • web-audio-api
Share this project:

Updates

Submission history