Tutorial: Customer Escalation with Call Stages
Learn how to implement customer service escalation in Ultravox using call stages to handle customer complaints by transferring them to a manager.
What you’ll learn:
- How to implement an escalation tool
- How to use call stages to switch conversation context
- How to handle manager takeover with a new system prompt
- Testing escalation scenarios
Time to complete: 25 minutes
Prerequisites
Before starting this tutorial, make sure you have:
- Basic knowledge of TypeScript and React
- The starter code from our tutorial repository
- Node.js 16+ installed on your machine
- ngrok installed on your machine
Understanding Call Stages
Call stages in Ultravox enable dynamic changes to an ongoing conversation by:
- Switching system prompts mid-conversation
- Changing voice personalities
- Maintaining conversation context
- Handling role transitions seamlessly
In this tutorial, we’ll use call stages to transfer angry customers to a manager who can better handle their complaints.
Project Overview: Dr. Donut Manager Escalation
We’ll build an escalation system for our Dr. Donut drive-thru that allows the AI agent to transfer difficult situations to a manager. The system will:
- Recognize when a customer needs manager assistance
- Collect complaint details
- Switch to a manager persona with authority to resolve issues
Implementation Steps
- Set Up ngrok → Enable external access to our escalation endpoint
- Define the Tool → Create a schema for escalation requests
- Create Manager Handler → Build the API route for manager takeover
- Update System Prompt → Add escalation rules to the base prompt
- Test the System → Verify escalation flows
Step 1: Set Up ngrok
First, we need to make our escalation endpoint accessible to Ultravox.
- Start your development server:
- In a new terminal, start ngrok:
-
Copy the HTTPS URL from ngrok (it will look like
https://1234-56-78-910-11.ngrok-free.app
) -
Update
toolsBaseUrl
indemo-config.ts
:
Step 2: Define the Escalation Tool
We’ll define an escalateToManager
tool that the AI agent will use to transfer difficult customers.
Update the selectedTools
array in demo-config.ts
and add to our call definition:
Step 3: Create Manager Handler
Create a new file at app/api/managerEscalation/route.ts
to handle the escalation:
Step 4: Update System Prompt
Add escalation rules to your base system prompt in demo-config.ts
:
Testing Your Implementation
Here are three scenarios to test the escalation system:
Scenario 1: Food Quality Issue
Scenario 2: Out of Stock Frustration
Scenario 3: Product and Refund
For each scenario, verify:
- The agent offers manager assistance
- The escalation tool is called with appropriate details
- The manager persona takes over with the new voice
- The manager follows the resolution guidelines
Common Issues
-
ngrok URL Not Working
- Make sure ngrok is running
- Check the URL is correctly copied to
demo-config.ts
- Verify no trailing slash in the URL
-
Escalation Not Triggering
- Check the system prompt includes escalation guidelines
- Verify the complaint is clearly expressed
- Try using keywords like “manager”, “refund”, or “complaint”
-
Manager Voice Not Changing
- Verify the
X-Ultravox-Response-Type
header is set - Check the voice parameter in the response body
- Verify the
Next Steps
Now that you’ve implemented basic escalation, you can:
- Implement different manager personalities for different situations
- Create a complaint logging system
- Add resolution tracking and follow-up mechanisms