Back to Showcase
Accessibility / AILive

Voice Interface

Combines SpeechRecognition (voice → text, with live transcription) and SpeechSynthesis (text → voice, with system voice selection) in the same demo — the two halves of a complete voice interface, using only native Web APIs, no external API involved. The recognition language and the default synthesis voice follow the site's active locale (pt-BR, en-US, or es-ES).

Speech Recognition Text-to-Speech Speech Synthesis Accessibility Voice

Technologies

  • Web Speech API
  • SpeechRecognition
  • SpeechSynthesis

Architecture

  • Web Speech API
  • SpeechRecognition
  • SpeechSynthesis
  • Runs entirely on the client
  • Language synced to the site's active locale

Concepts

  • Real-time transcription
  • interim/final result deduplication
  • speech synthesis queue
  • asynchronous voice loading
  • voice-based accessibility

Demo area

The demo is 100% functional — try it now.

Previous Demo

Notifications API

The push-type Notifications API is native to the operating system, delivered even with the app closed — Service Worker + VAPID end to end.

Next Demo

Offline Data + Sync

100% offline data persistence with automatic sync on reconnect — including real SQL running on WebAssembly inside a Web Worker.