Skip to main content

​
Overview

LuaPop supports optional voice chat functionality, allowing users to speak with your AI agent instead of typing.

​
Enable Voice Chat

window.LuaPop.init({
  agentId: "your-agent-id",
  position: "bottom-right",
  voiceModeEnabled: true  // ✅ Enable voice chat
});

​
Features

Speech-to-Text

Users can speak their messages

Text-to-Speech

AI responses can be spoken aloud

Multi-Language

Supports multiple languages

Hands-Free

Great for accessibility and mobile

​
How It Works

1

User Activates Voice

User clicks microphone icon in chat input
2

Browser Requests Permission

Browser asks for microphone access
3

User Speaks

User speaks their message
4

Speech-to-Text

Audio converted to text automatically
5

AI Responds

AI processes and responds as normal
6

Text-to-Speech (Optional)

Response can be played as audio

​
Use Cases

​
Accessibility

Voice chat improves accessibility for:
  • Users with motor impairments
  • Users who prefer speaking
  • Hands-free scenarios
  • Visually impaired users

​
Mobile Users

Perfect for mobile where typing is harder: 
const isMobile = window.innerWidth <= 768;

window.LuaPop.init({
  agentId: "mobile-agent",
  voiceModeEnabled: isMobile, // Enable on mobile only
  buttonText: isMobile ? "🎤 Voice Chat" : "💬 Chat"
});

​
Driving/Hands-Free

Ideal for automotive or hands-free scenarios: 
window.LuaPop.init({
  agentId: "hands-free-agent",
  voiceModeEnabled: true,
  chatTitle: "Voice Assistant",
  buttonText: "🎤 Voice Chat",
  welcomeMessage: "Hi! I'm your voice assistant. Tap the microphone to speak to me.",
  chatInputPlaceholder: "Click mic to speak..."
});

​
Browser Support

Voice chat requires:
  • Modern browser with Web Speech API
  • HTTPS connection (required for microphone access)
  • User permission for microphone

​
Supported Browsers

BrowserSpeech-to-TextText-to-Speech
Chrome✅ Full✅ Full
Safari✅ Full✅ Full
Firefox✅ Full✅ Full
Edge✅ Full✅ Full
Mobile Safari✅ Full✅ Full
Chrome Mobile✅ Full✅ Full

​
Privacy & Permissions

Voice chat requires user permission to access the microphone. Users must explicitly grant permission.

​
Permission Handling

The widget automatically:
  1. Requests microphone permission when needed
  2. Shows appropriate UI if permission denied
  3. Gracefully falls back to text-only chat

​
Privacy

  • Audio is processed in real-time
  • No audio recordings are stored locally
  • Audio converted to text server-side
  • GDPR compliant

​
Best Practices

Voice chat only works on HTTPS:
const isSecure = window.location.protocol === 'https:';

window.LuaPop.init({
  agentId: "your-agent-id",
  voiceModeEnabled: isSecure // Only enable on HTTPS
});
Let users know voice is available:
window.LuaPop.init({
  agentId: "your-agent-id",
  voiceModeEnabled: true,
  buttonText: "🎤 Voice Chat Available"
});
Voice chat is especially useful on mobile:
const isMobile = window.innerWidth <= 768;

window.LuaPop.init({
  agentId: "your-agent-id",
  voiceModeEnabled: true,
  buttonText: isMobile ? "🎤" : "💬 Chat",
  chatInputPlaceholder: isMobile 
    ? "Tap mic to speak" 
    : "Type or click mic to speak"
});

​
Next Steps

Configuration

All configuration options

Examples

See voice chat implementations