I recently tried adding a conversational AI voice agent to a fictional website called ABC Computing a store that sells computer components. Let me tell you, it’s super easy to set up, and I was amazed at how quickly it was up and running. If you’ve ever wanted to make your website more interactive and helpful for your users, this guide will walk you through the entire process in just 5 minutes!
Step 1: Start by Accessing the ElevenLabs Dashboard
First things first, head over to https://elevenlabs.io. If you don’t already have an account, signing up is super straightforward:
Click Sign Up, enter your email, create a password, and confirm your account through the email they send.
Already signed up? Just hit Log In.
Once you’re in, you’ll see a sidebar with various tools. Click on Agents under the Conversational AI section. This is where the magic happens.
Step 2: Create a New Agent
Now it’s time to create your agent. Think of this as the virtual personality you’re adding to your website. Here’s how you can do it:
Click the "+" Button to create a new agent.
Give it a name. For ABC Computing, I called it ABC Assistant because it sounded friendly and professional.
Set up the basics:
Language: I selected English since that’s the primary language for ABC Computing’s customers.
First Message: I made it welcoming and helpful:
“Hi, I’m John, your ABC Computing assistant. How can I help you today?”
System Prompt: This part defines your agent’s personality. Here’s what I used:
“You are a friendly and knowledgeable support agent named Alex. Your job is to assist customers with their inquiries about ABC Computing’s products, like graphics cards and SSDs. Keep responses clear and concise—3 to 7 sentences.”
Step 3: Choose the Perfect Voice
One of my favorite parts of this process was picking a voice for the agent. ElevenLabs has an impressive library of voices, so you can make your agent sound natural.
Go to the Voice tab and pick a voice. For ABC Computing, I chose “Danbee,” which sounded professional but approachable.
Adjust the settings:
Set TTS Output Format to PCM 16000 Hz (it ensures clear audio).
If you have technical terms like “RTX 4060” or “NVMe SSD,” you can use Pronunciation Dictionaries to make sure your agent says them correctly.
Step 4: Add Knowledge to Your Agent
Your agent needs to know what it’s talking about, right? This is where the Knowledge Base comes in. For ABC Computing, I added a few key resources:
Click Add Item in the Knowledge Base section.
Upload files or add URLs:
I added ABC product catalog called sales.pdf so the agent could reference details about GPUs, CPUs, and storage devices.
I also included their return policy and FAQ as a separate document, ABC-Warranty-FAQs.pdf.
You can add multiple items to cover a wide range of customer questions.
Step 5: Configure the AI Brain (LLM Settings)
Next, I fine-tuned how the agent responds to users by configuring the LLM settings.
Choose an AI model, like GPT-4o. It’s super powerful and provides detailed yet understandable responses. This model will also support tool calling.
Adjust the Temperature to control creativity:
I kept it low (around 0.3) to make responses more focused and fact-based.
Set Token Limits to manage response length. I left it unlimited because some customer questions, like comparing GPUs, require detailed answers.
Step 6 (Optional): Integrate Any Tools
If you use third-party tools (like order tracking or inventory systems), this is where you’d connect them. For ABC Computing:
I used the Tools section to link their product database so the agent could pull live stock availability.
For security, I stored API keys in the Secrets section.
Step 7 (Optional): Design the Widget for Your Website
Now it’s time to make sure the agent blends beautifully into your website. Here’s what I did for ABC Computing:
Switch to the Widget tab.
Copy the Embed Code provided and paste it into the website’s footer or wherever you want the agent to appear.
Customise the widget:
I set the Background Color to white (#FFFFFF) to match ABC Computing’s minimalist theme.
For Button Text Color, I chose blue (#0000FF) to stay on-brand.
Step 8: Test Your Agent
Before going live, I tested the agent by clicking the Test AI Agent button. Here are a couple of questions I asked it:
“What’s the difference between the RTX 4060 and RTX 4070?”
“Can I return an SSD if it’s faulty?”
The agent responded accurately and naturally, thanks to the documents I uploaded earlier.
Step 9: Deploy the Agent
With everything set up, I deployed the agent to ABC Computing’s website. Here’s how:
Paste the embed code (from Step 7) into the website’s HTML.
I placed the widget on the homepage and the contact page to make it easy for users to find.
Step 10 (Optional): Monitor and Improve
Once the agent was live, I used the Analysis tab to track its performance:
I checked how users were interacting with it and which questions were the most common.
Based on this data, I added more knowledge base items, like specs for newly launched products.
Final Thoughts
That’s it! In just 5 minutes, ABC Computing now has a conversational AI voice agent that helps customers find the right products, answers their questions, and even assists with support queries. Honestly, this tool is a game-changer for any business. If you’re running an online store, give it a shot it’s easy, fast, and makes a huge difference!
Comments