OVERVIEW
Background
Sprinklr offers customer service software that helps brands manage agents and customer interactions, to ultimately improve customer experience.
This project focused on Care Console Voice Call, which allows agents to receive customer calls from all over the world with a built-in call feature to communicate with customers and take timely actions while being on the call.
I led the design of the mobile voice call interface, from identifying user needs to delivering hi-fi wireframes to the dev team.
Impact
📱 This product has been launched and is currently being used by
various of enterprise companies.
🛠 I helped improve the team's design system and have created
standardized elements for voice call across the platform.
ℹ️ Learn more: https://www.sprinklr.com/features/call-center/
IDENTIFY THE PROBLEM
Inquiry for Improvement
Agents has reported high dissatisfaction rate on the current voice call product, because:
-
they need to take call related actions when talking to customers.
-
they need to navigate within the app while being on the call.
However, the product at that time wasn't able to accommodate those needs.
Audit the Current Design
Since it's an improvement based on an existing function and it has to be consistent with the other parts of the
product, I started by gathering resources and figuring out "what resources do I have in hand?"
A comprehensive desktop version that provides various range of capabilities
A simple MVP version that allows minimal interactions
User Interview
With the help of UX Researcher in the team, we conducted interviews with several clients to learn about what they were looking for while taking calls from customers and what were their major frustration at the moment.
RESEARCH
Competitor Study
We looked into a couple of competitors and noticed that the maximum number of primary actions is 5. All other features are hidden in the secondary level.
We also found out that many major voice call/video call apps are using movable widget while being minimized.
Define Success
While users have a ton of "ideal features" that they wanted, we picked out the key features to be included in this project based on survey results from 100+ users. Meanwhile, we also made sure to align with business goals and marketing strategies.
The goal of this project is to:
-
Ensure seamless transition between different scenarios during a call
-
Enable agents' needs for multi-tasking
CHALLENGES
Challenge 1
How to leverage the MVP version and Desktop version with this design and define primary features?
Comparing to a desktop app, a mobile app will most likely have a smaller screen, and interaction signifier can also be different.
Challenge 2
How to give users access to features while moving out of the chat screen?
Currently, users are not able to navigate within the other parts of the app until the call is over, because the minimized call widget is fixed on screen, which takes too much backend effort to make it work on other pages as well.
EXPLORATION
Widget Shape
What features need to be included in the minimized version?
User research says ONLY “Mute”.
Feature Layout
Ideally fit all within the “comfort zone”
Error Prevention
-
Mute and Pause might confuse the user when they’re put side by side
-
More issues were identified through user testing
FINAL SOLUTION
Hidden Menu
A More button is introduced to cover a couple of not commonly used features, determined by the research team through user interviews.
Movable Minimized Widget
Users are able to move the widget around while it's minimized so that they can adjust its location based on their needs and view other pages.
REFLECTION
Design System Improvement
For future design hen this feature was launched, other members will be able to use this as a reference to build up the design.
What I did for design documentation provides a source of truth for the rest of the internal team, including both designers and engineers. With this effort, I helped ensure design consistency across the platform, smooth design hand-off process, which ultimately improved team efficiency.