Zoom
Zoom Contact Center
Description
When an end-user has an issue with a product, they often reach out to customer support. Zoom Contact Center is a platform that allows customer support agents to manage all of their conversations with end-users simultaneously and seamlessly across all channels. After GA, with a large backlog of new features for our experience, it became clear that our existing interface was not built for feature-scalability. I led the re-design of Zoom Contact Center's core experience to solve this problem.
Process
My work always starts with understanding the user and what problem we're trying to solve for them. In this case, customer service agents required new features that our existing UI didn't have space for. Deciding to explore a re-design allowed us to take a deeper look at our MVP experience and question our existing assumptions. Were our features located where users expected them? How could we organize the interface to maximize agent efficiency? Where were our low-effort high-impact opportunities? After collaborating with my triad on building hypotheses around these questions, we hashed out our initial Jobs-To-Be-Done, aligned on scope, and decided how we would measure our success. We iterated through various layouts and information architecture, collaborating with cross-functional teams and running qualitative user testing. After moving through low-fidelity to high-fidelity prototypes with users and had ensuring we satisfied all of our jobs-to-be-done, I handed off a spec to our Engineers for development.
Zoom Contact Center Zoomtopia 2023 feature
Zoom email and mobile designs
left chevron
right chevron
Impact
By re-designing our interface to house the additional features requested from agents while maintaining a simple and intuitive experience, we were able to unblock 10 enterprise customers to switch to Zoom from their existing contact center providers. This resulted in a 17% increase in MRR(Monthly Recurring Revenue), our key success metric. Following our redesign, I also designed the end-to-end email channel, unlocking 22% of the global CCaaS market, as well as our mobile contact center experience.
directly hero

Project Summary

What is CVA?

CVA is a Virtual Agent that builds automated conversation flows for you with never-before-seen scale and efficiency.

Our platform enables crowd-sourced individuals to contribute to building automated conversations by completing simple tasks in a gamified gig-work model platform.

My contribution

Designed the end-to-end experience for CVA's multi-sided enterprise VA web platform.

Brand exploration

Low/high-fidelity wireframes

Prototypes

User testing

Final designs

Design system

Interaction design guidelines

Developed task design systems for crowd-sourced individuals to train client NLUs with great efficiency

Shifted the organization to design-thinking led

Initiated ENG-Design collaboration from conception to completion

directly product mocks

Brand Exploration

Who are we targeting, and how do we reach them?

Sync with Sales Team on target market

Pull competitive research & design reference

Color explorations

Information architecture explorations

High-fidelity explorations

Facilitate design feedback sessions & style selection

Collaborate on strategy for execution

Low/High-Fidelity Wireframes

What tasks do our users need to complete?

Identify users and tasks they need to accomplish on a macro and micro level.

Break out screens by key functions relating to key high-level tasks.

Collaborate on UX diagrams with product owner.

Build low-fidelity wireframes.

Collaborate with ENG & Product team on functionality and direction.

Design high-fidelity wireframes.

Prototypes

Ilicit feedback

I built prototypes to help create alignment amongst cross-functional team members, communicate the ideal interaction with our front-end engineer, and test our flows with end-users to continue to refine the experience.

Client Dashboard

How will our clients manage their VA?

There are a handful of client user types that need to complete tasks associated with their roles. Ex. a Business Leader is probably only looking for high-level metrics to report performance, whereas a Customer Service Lead manages and approves conversation flows.

We put together a user hierarchy to define which screens would be most used by which user, allowing us to adjust complexity where necessary to help each user type to complete their tasks with minimal friction.

Admin Dashboard

Who takes care of managing the top-level client account settings?

The Admin Dashboard was designed primarily for the Client Administrative user, whose main tasks include managing the client's account, internal user permissions, and security.

Open Figma

CVA admin dashboard figma

Specialist Dashboard

How will our Crowd Specialists contribute to building automated conversations?

Our Specialist Dashboard enables crowd-sourced individuals to earn cash for completing simple tasks that help train NLUs, among other things related to conversation design. The team developed a performance-based system to incentivize high-quality contributions and eliminate bad actors.

Open Figma

CVA specialist dashboard figma

Design System

How will our designs remain consistent?

Design systems are important in every industry, but are vital when it comes to environments of high-complexity like the AI space.

I developed our design system to enable our Front-End Engineer to locate all assets, allow for easy consumption to all cross-functional team members, and to serve as a clear guide of our design language to new designers.

Open Figma

CVA design system figma