Strategy | UI/UX | Web App
IVR Web Application
IVR Cloud Telephony Enterprise communication should be a simple plug and play system. This web application makes Voice, SMS and Authentication program. Build a personalized experience for your customers over voice calls. Track, manage and build call flows using Exotel.
Project Overview
Design
Strategy
Client
Problem Statement
The core problem is the disconnect between the people who design the customer experience (Support Managers, Marketers) and the tools required to build it (Code, APIs, Telecom Infrastructure).:
- High Technical Barrier: Traditional IVR setup requires knowledge of telephony languages (like vXML) or complex backend coding (Twilio/Vonage APIs).
- Slow Iteration: Marketing and support teams often have to wait for IT/Developers to make simple changes to call scripts or holiday greetings.
- Lack of Visualization: Text-based scripts make it difficult to visualize the “customer journey” through a phone call, leading to dead-ends and frustrating user experiences.
A "What You See Is What You Get"
- Drag-and-Drop Interface: Users drag “Nodes” from a sidebar onto an infinite canvas
- Node Linking: Users draw lines (edges) between nodes to define the logic flow (e.g., If user presses ‘1’, go to Node B)
- In-Browser Simulator: A “Test Call” button opens a softphone in the browser, allowing the builder to interact with the flow immediately without picking up a real phone
- Debug Mode: Highlights the active node in real-time during the test call to troubleshoot logic errors
- Design Strategy
- Problem Solution
- Insights & Analytics
- User Research
- User Persona
- Information Architecture
- Wireframe
- Prototyping
The Users and the Industry
This deep dive analyzes the Two-Sided Marketplace of an IVR system: the Business Users (who build the flows) and the Callers (who endure them). Understanding the friction between these two groups is where your design opportunity lies.
- Market Shift: The market is moving from “On-Premise Hardware” (server racks in a basement) to CCaaS (Contact Center as a Service). This confirms your web-based SaaS approach is right on trend
- The “Deflection” Economy: For a business, a live agent call costs ₹2–₹5. An automated IVR resolution costs ₹0.05–₹0.25. The entire industry is driven by this 50x cost difference.
- AI Integration: The current trend is “Conversational IVR” (Generative AI) replacing “Menu-based IVR” (DTMF). Your tool needs to support both: visual trees for logic and AI nodes for flexibility
Personas
& User Journey Maps
My interviews with the Business Users and Callers provided critical, detailed information. This foundation allowed me to successfully create the resulting personas and journey maps.
Personas
User Journey Maps
Information
Architecture.
This document outlines the Information Architecture flow for an IVR (Interactive Voice Response) Web Application used to design, manage, deploy, and monitor IVR systems.
The application supports:
- IVR flow creation (menus, prompts, routing)
- Audio and text-to-speech management
- Call routing and business logic
- Reporting and analytics
- User and system administration
Wireframing
Our internal process challenges eventually surfaced in our design output. In just two months, we generated over 200 artboards in a high-speed sprint to meet deadlines. However, the volume came at a cost: documentation suffered, and many screens were unintentional replicates. It was a powerful lesson in how ‘moving fast’ can sometimes get in the way of ‘moving right.
Style Guide