Skip to main content

Voice Agent (LiveKit Integration)

Let your customers talk to your AI instead of typing! Enable voice conversations in your chat interface so customers can speak naturally and get instant responses.

What is Voice Agent?

Voice Agent lets customers have voice conversations with your AI. Instead of typing messages, they can speak naturally, and your AI responds with voice. Perfect for hands-free interactions, accessibility, and a more natural conversation experience.


Why Use Voice Agent?

Better Customer Experience

  • Natural Conversations: Customers can speak naturally instead of typing
  • Hands-Free: Perfect for mobile users or when typing isn't convenient
  • Accessibility: Makes your chat accessible to everyone
  • Faster Interactions: Speaking is often faster than typing

Real-World Use Cases

  • Customer Support: Let customers explain issues by voice
  • Sales: Natural conversations for product inquiries
  • Accessibility: Help users who have difficulty typing
  • Mobile Users: Easier to speak than type on mobile devices

How It Works

When you enable Voice Agent:

  1. Customer clicks the voice button in your chat interface
  2. Voice modal opens with audio controls
  3. Customer speaks - their voice is transcribed in real-time
  4. AI responds with voice and text
  5. Conversation continues naturally with voice or text

What Customers See:

  • A voice button (waves icon) next to the text input
  • A full-screen voice conversation modal
  • Real-time transcription of what they say
  • Audio visualizer showing voice activity
  • Both voice and text messages in the conversation

Setting Up Voice Agent

Step 1: Get LiveKit Credentials

You need a LiveKit account to use Voice Agent. LiveKit provides the infrastructure for voice conversations.

Option 1: Use LiveKit Cloud (Recommended)

  1. Go to LiveKit Cloud
  2. Sign up for an account (free tier available)
  3. Create a new project
  4. Get your credentials:
    • Server URL: Your LiveKit server URL (e.g., wss://your-project.livekit.cloud)
    • API Key: Your project API key
    • API Secret: Your project API secret

Option 2: Self-Hosted LiveKit

  1. Set up your own LiveKit server
  2. Get your server URL, API key, and API secret
  3. Make sure your server is accessible
Need Help?

Check out the LiveKit Voice AI Guide for detailed setup instructions.


Step 2: Enable Voice Agent in Your Chat Interface

  1. Go to Dashboard → Chat Interfaces
  2. Click "Edit" on the chat interface you want to enable voice for
  3. Scroll down to the "Voice Agent" section
  4. Toggle "Enable Voice Agent" to ON

What You'll See:

  • A toggle switch that says "Voice Agent Disabled" or "Voice Agent Enabled"
  • When enabled, configuration fields appear below

Step 3: Enter LiveKit Credentials

Once you enable Voice Agent, you'll see configuration fields:

Required Fields:

  • Server URL: Your LiveKit server URL

    • Example: wss://your-project.livekit.cloud
    • Must start with wss:// or ws://
  • API Key: Your LiveKit API key

    • Found in your LiveKit project settings
    • Keep this secure!
  • API Secret: Your LiveKit API secret

    • Found in your LiveKit project settings
    • This is encrypted and stored securely

Optional Field:

  • Agent Name: Name of your voice agent
    • This helps identify your agent in LiveKit
    • Leave blank to use default

Visual Guide:

┌─────────────────────────────────────┐
│ Voice Agent Enabled │
│ │
│ Server URL * │
│ [wss://your-project.livekit.cloud] │
│ │
│ API Key * API Secret * │
│ [api_xxx] [secret_xxx] │
│ │
│ Agent Name (Optional) │
│ [My Voice Agent] │
└─────────────────────────────────────┘

Step 4: Save Your Changes

  1. Click "Update Interface" button at the bottom
  2. Your voice agent is now enabled!
  3. The voice button will appear in your chat interface

Testing Your Voice Agent

Test in Preview

  1. While editing your chat interface, use the "Show Preview" button
  2. Click the voice button (waves icon) in the preview
  3. The voice modal should open
  4. Try speaking to test the connection

Test in Live Chat

  1. Go to your live chat interface URL
  2. Click the voice button next to the text input
  3. Click "Connect" in the voice modal
  4. Allow microphone access when prompted
  5. Start speaking!

What to Expect:

  • Voice modal opens with connection status
  • Real-time transcription appears as you speak
  • AI responds with voice and text
  • Audio visualizer shows voice activity

Customer Experience

What Customers See

In the Chat Interface:

  • A voice button (waves icon) next to the text input
  • Tooltip: "Voice Agent Enabled" when hovering

When They Click Voice Button:

  • Full-screen voice modal opens
  • Connection screen appears first
  • "Connect" button to start voice conversation
  • Real-time transcription area
  • Audio visualizer showing voice activity
  • Both voice and text messages visible

During Conversation:

  • Customer speaks → Real-time transcription appears
  • AI responds → Voice plays + text appears
  • Can switch between voice and text anytime
  • Can close voice modal and continue with text

Troubleshooting

Voice Button Not Appearing

Check:

  • ✅ Voice Agent is enabled in chat interface settings
  • ✅ LiveKit credentials are entered correctly
  • ✅ Chat interface is active (not disabled)
  • ✅ You're viewing the correct chat interface

Solution:

  • Go back to chat interface settings
  • Verify Voice Agent toggle is ON
  • Check that all required fields are filled
  • Save changes again

Connection Fails

Check:

  • ✅ Server URL is correct (starts with wss:// or ws://)
  • ✅ API Key is correct
  • ✅ API Secret is correct
  • ✅ LiveKit server is accessible
  • ✅ Your internet connection is working

Solution:

  • Double-check all credentials in LiveKit dashboard
  • Test your LiveKit server URL in a browser
  • Verify your API key and secret are correct
  • Contact LiveKit support if server issues persist

No Audio / Microphone Not Working

Check:

  • ✅ Microphone permissions are granted in browser
  • ✅ Microphone is not muted
  • ✅ Browser supports WebRTC (Chrome, Firefox, Safari, Edge)
  • ✅ No other app is using the microphone

Solution:

  • Grant microphone permissions in browser settings
  • Check browser console for errors
  • Try a different browser
  • Restart browser if needed

Transcription Not Appearing

Check:

  • ✅ Voice connection is established
  • ✅ You're speaking clearly
  • ✅ Microphone is working
  • ✅ No network issues

Solution:

  • Wait a moment for transcription to appear
  • Speak more clearly
  • Check microphone input levels
  • Refresh the page and try again

Best Practices

1. Test Before Going Live

  • Always test voice agent in preview first
  • Test with different browsers
  • Test on mobile devices
  • Verify audio quality

2. Provide Clear Instructions

  • Let customers know voice is available
  • Explain how to use voice feature
  • Show them the voice button location

3. Monitor Performance

  • Check voice connection success rate
  • Monitor transcription accuracy
  • Get customer feedback on voice quality

4. Keep Credentials Secure

  • Never share your LiveKit API secret
  • Rotate credentials regularly
  • Use environment variables if self-hosting

Limitations

Current Limitations

  • Requires LiveKit Account: You need a LiveKit account (free tier available)
  • Browser Support: Requires modern browser with WebRTC support
  • Microphone Required: Customers need a microphone to use voice
  • Internet Connection: Requires stable internet for best experience

Browser Compatibility

  • ✅ Chrome (recommended)
  • ✅ Firefox
  • ✅ Safari (iOS 11+)
  • ✅ Edge
  • ❌ Internet Explorer (not supported)

Pricing

LiveKit Pricing:

  • LiveKit offers a free tier for testing
  • Paid plans available for production use
  • Pricing based on usage (minutes of voice)
  • Check LiveKit Pricing for details

Axie Studio:

  • Voice Agent feature is included in all plans
  • No additional charges from Axie Studio
  • You only pay for LiveKit usage

Next Steps


Ready to enable voice? Go to Dashboard → Chat Interfaces → Edit → Voice Agent section!