VocaThread Case Study
- Type: Conceptual UX Case Study
- Role: UX/UI Designer, UX Researcher (solo)
- Tools Used: Figma, UX Pilot (AI), ChatGPT (AI)
- Focus Areas: Enterprise UX, Workflow Simplification, AI Integration
- Timeline: June 2025
- Platform: Desktop Web App (Internal Use)
- Tags:
- Enterprise UX
- SaaS / CRM
- Internal Tools
- AI Design
Project Goal:
Design a secure, AI-powered internal tool to streamline documentation, ease mental load, and guide call center agents through complex reconnection calls at DIRECTV.
Project Background
Context:
This case study stems from my real-world experience working as a collections agent for Empereon Constar, a DIRECTV contractor. For three months, I handled high-pressure calls with customers who had overdue accounts and were at risk of service disconnection.
Problem Space:
The reconnection process was often fragmented and emotionally taxing — for both the agent and the caller. Calls were tightly scripted, tools were scattered across multiple systems, and many customers hung up before help could be offered.
Overview:
VocaThread explores how human-centered design can reduce friction and restore empathy in high-stakes call center environments. Built on personal experience and research, this AI-powered assistant was designed to guide agents through sensitive reconnection calls with more structure, better timing, and clarity — all without losing the human touch.
Key Challenges involved:
- Handle up to 100 calls daily (both inbound and outbound).
- Use 4–5 disconnected applications (Latitude, RIO, various CRM tools).
- Manually document every call in a rigid format — even hang-ups.
- Memorize multiple legal scripts, account lookup flows, and promo. logic — all without access to notes or external reference materials.
- Maintain a polite, sales-driven tone while steering conversations toward conversions
Firsthand Experience
- 3-months in a real call center.
- High-security operations center
- What I observed: Multitool chaos, emotional burnout, confusing validation flows
Design Approach & Process
To structure this project, I leaned on the Double Diamond framework — a design thinking process that balances divergent exploration with convergent clarity. As a solo designer working from lived experience, this helped me separate assumptions from insight, and strategy from execution.
Discover: Empathize with the agent experience
Define: Narrow in on key reconnection problems
Develop: Ideate interaction flows and UI strategies
Deliver: Polish and validate the proposed solution
**Each section of this case study is clearly labeled according to the Double Diamond design process — from early discovery through final delivery — to help readers follow the thinking behind every decision.
Look for this to see what section you’re in.
User
Research
Research
User Interview:
To validate my experience, I sent an 8-question anonymous survey to trusted former coworkers, ensuring privacy by not collecting email addresses.
Only three responded, but their honest insights were crucial to shaping this project.
I researched Reddit and gathered three insightful quotes.
“I got a call center job 3 months ago… I put him on hold for 15 minutes while I cried.”
“We had to learn 12 different systems… I lasted… a day.”
“Talking for 8‑10 hours a day is not normal… it was the having to pretend to care that killed me.”
Environmental Analysis
To visualize the agent experience, I recreated my dual-monitor setup from memory.
Call Flow
Pressure Points
Pressure Points
Agents often faced added stress by supervisors if they didn't firmly stick to the script or share promotions correctly.
Personas
Problem Statement
Call center agents face:
Disconnected tools that increase cognitive strain.
Rigid scripts that limit natural conversations.
Lack of customer context during emotional calls.
Result: Poor customer rapport, frequent script mistakes, and agent burnout.
Key Challenges
- Script compliance vs. authentic interaction
- Tool overload → cognitive fatigue
- Promo timing / payment flow confusion
- Multilingual and validation friction
- Missed sales due to abrupt hangups
- Personal Hardship: Because reconnections were rare, the process remained unfamiliar, leading to frequent manager intervention..
How Might We...
- Help agents capture caller context more efficiently and naturally?
- Reduce friction across tools without sacrificing accountability?
- Support compassionate communication within the limits of policy?
- Recognize the emotional effort agents invest in every call?
- Bridge language gaps when Spanish-speaking agents are unavailable during high-volume periods?
- Make scripts feel more like conversations without losing compliance?
- Surface early signs of burnout through thoughtful interface design?
Design Goals
Simplicity, Clarity, Empathy
We prioritized intuitive design, ensuring every interaction feels calm and clear to reduce agent stress and mental load, especially during sensitive calls.
Smart AI-Enhanced Flow
AI assists agents by automating repetitive tasks like transcription and note-taking, providing real-time guidance to keep them focused on the customer, not the tools.
Compliance-Friendly Yet Human
VocaThread balances strict compliance needs (scripting, logging) with agent autonomy, enabling genuine customer interactions while adhering to all procedural requirements.
Process + Tooling
- Used UX Pilot to rapidly prototype flows
- Iterated inside Figma with adjustments for accuracy
- Prompt development became a key part of the design method
- Generated nearly 30 wireframes, selectively curated for clarity and focused presentation.
To move between screens, simply drag left or right.
This first phase of VocaThread’s wireframes shows my early efforts to consolidate numerous disconnected tools. Though not user-tested, this unified system aimed for cohesion, but still resulted in a crowded and mentally taxing layout.
Explore the key wireframe components below, grouped by the problems they were designed to solve.
Language Detection & Multilingual Agent Handoff Features
Agent Wellness & Break Tracking Components
Smart Conversation & Transcription UX Concepts
AI-Powered Agent Support Concepts
Design Principles
While this single-application approach improved cohesion, the layout still felt crowded and mentally taxing. This insight later sparked a new design direction — one that prioritized a more streamlined, focused agent experience.
To bring structure and clarity to the agent experience, I defined a 6-stage call flow that mirrors the natural progression of a reconnection call:
- Login
- Identity Confirmation
- Eligibility
- Billing
- Plan Selection
- Completion
Each stage was crafted to reduce cognitive load and streamline decision-making for the agent, while supporting compliance, empathy, and business goals at every step.
This modular structure also allowed me to integrate smart AI enhancements—like transcription, payment logic, and wellness prompts—precisely where they’re most impactful.
ID Confirmation Page Descriptions:
The VocaThread ID confirmation screens are designed to streamline the start of a reconnection call by automatically displaying the customer’s details and providing live AI transcription.
A standout feature is the Request Bilingual Agent button, which appears when a non-English language is detected or manually selected by the agent, enabling quick escalation for better communication.
Additionally, the Customer Billing Modal offers a detailed 3-month billing history with an AI-generated summary, giving agents critical context about missed payments or outstanding balances to guide conversations with empathy and accuracy.
Eligibility to Payment Flow Description:
After verifying the customer’s identity, the Eligibility Check screen ensures service requirements are met by confirming equipment status, service address, and competing provider information.
Once eligibility is confirmed, the flow transitions seamlessly to the Billing and Payment process, where agents can apply promotional credits and collect payments.
If the customer wants to reconnect, the Pending Supervisor Approval modal enables agents to request authorization for special promotions, providing real-time context and payment breakdowns while keeping the call on hold.
Together, these screens reduce call complexity, improve agent efficiency, and protect compliance by guiding agents step by step.
AI Support Features
VocaThread’s AI-powered tools are designed to reduce friction for agents while improving call accuracy, compliance, and empathy:
✅ Editable Live Transcriber
Automatically generates call transcripts with timestamps and speaker labels, and allows agents to edit the text in real time to ensure accuracy before saving documentation.
✅ Compliance-Safe Transcription Toggle
Transcription automatically pauses during sensitive moments like payment collection, protecting customer privacy and maintaining regulatory compliance.
✅ AI-Generated Call Summaries
After each call, agents receive an auto-drafted summary capturing key events, reasons for non-payment, and follow-up actions — reducing repetitive manual note-taking.
✅ Dynamic Emotional Insights
Real-time monitoring of agent stress and fatigue levels surfaces micro-coaching tips like “Take a short break” or “Maintain a calm tone,” supporting agent well-being during high-pressure calls.
✅ Multilingual Support & Routing
When a non-English caller is detected, VocaThread offers bilingual agent requests and helps agents transfer calls seamlessly, bridging language gaps even during busy periods.
These features work together to streamline the call flow, reduce agent burnout, and create a more compassionate customer experience.
♿ Accessibility & Agent Empathy
Creating a compassionate, effective experience in high-stress call center environments means designing for both accessibility and agent well-being:
✅ Accessible UI Design
High-contrast color schemes and large, legible typography ensure clear readability for all agents, including those with low vision or color blindness.
Keyboard-navigable layouts allow agents to complete workflows efficiently without relying on a mouse — essential for agents with motor limitations or those using assistive devices.
✅ Clear, Jargon-Free Language
Simple, direct wording in interface labels and prompts reduces cognitive load, especially in stressful moments like payment collection or escalations.
✅ Emotionally Supportive Interactions
The Agent Wellness Monitor tracks stress and fatigue, surfacing micro-tips that encourage self-care without disrupting workflow.
Soft color cues and affirming messages help agents feel seen and supported, reducing the risk of burnout.
✅ Empathy-First Compliance Prompts
Scripts guide agents to verify identity and explain sensitive policies with a kind, professional tone — building rapport while staying compliant.
✅ Multilingual Considerations
Quick access to bilingual agent requests and clear indicators for language status reduce miscommunication and help agents handle calls with empathy, even when language barriers exist.
By weaving these accessibility and empathy strategies into every screen, VocaThread empowers agents to deliver better customer experiences while taking care of their own well-being.
🔁 Reflection & Next Steps
What I Learned:
- Prompt-writing for AI tools requires clarity and iteration
- Visual simplicity takes more thinking than clutter
- Empathy should never be treated as “extra” in enterprise design.
What’s Next:
- Continue refining UI inconsistencies from AI-generated layouts
- Add mobile version / voice UI options
- Share with recruiters for real-world critique
- Explore how this model could work for healthcare or education support agents
