Fixing the data analytics tool for Webex Contact Center

Here's how I took a neglected data analytics tool for Webex Contact Center out of the past. The issues with this tool were dragging down customers' perception of the entire contact center suite. To solve this, I added 7 new features, transformed the information architecture, and did a complete visual redesign—all in less than 6 months.

ROLE

Lead designer

ROLE

Lead designer

DELIVERABLES

End-to-end product design

DELIVERABLES

End-to-end product design

TIMELINE

6 months

TIMELINE

6 months

YEAR

2025

YEAR

2025

Slide to compare the before and after of the main page.

Background

Background

The Webex Contact Center — a cloud suite that lets companies set up call centers for customer support, etc. — has a data analytics tool. This tool had been neglected for years. 
It was missing table-stakes features, had major visual design issues, wasn’t accessible, and most customers said they didn’t want to use it. But data is crucial to operating a contact center. So it needed to be updated.  
The Webex Contact Center — a cloud suite that lets companies set up call centers for customer support, etc. — has a data analytics tool. This tool had been neglected for years. 
It was missing table-stakes features, had major visual design issues, wasn’t accessible, and most customers said they didn’t want to use it. But data is crucial to operating a contact center. So it needed to be updated.  

Prioritization

Prioritization

I worked with product leadership to define some high-level phases for this work. As is often the case, it’s easier to get buy-in for new features than it is for other types of fixes and improvements. So we started with features, and then I could move to fixing the information architecture, visual design, copy, and broken flows.

The phases I defined were: 

  1. Add 7 new features 

  2. Move the product onto our design system (to fix a11y issues and visual design issues)

  3. Fix information architecture issues (including terminology)

I added all 7 of these features myself, doing full end-to-end design for each. But I’ll show the some samples here of the three most impactful in this case study.

Together with product leadership, I also made a plan for the order of features. This was based on speed of delivery, because we had engineering teams waiting to get started.

I worked with product leadership to define some high-level phases for this work. As is often the case, it’s easier to get buy-in for new features than it is for other types of fixes and improvements. So we started with features, and then I could move to fixing the information architecture, visual design, copy, and broken flows.

The phases I defined were: 

  1. Add 7 new features 

  2. Move the product onto our design system (to fix a11y issues and visual design issues)

  3. Fix information architecture issues (including terminology)

I added all 7 of these features myself, doing full end-to-end design for each. But I’ll show the some samples here of the three most impactful in this case study.

Together with product leadership, I also made a plan for the order of features. This was based on speed of delivery, because we had engineering teams waiting to get started.

1. Filters

1. Filters

How might we help users build out easier to use and more powerful filters?

We spoke to customers, and one of the most common pain points was around the limitations of filtering. Part of it was just poor UX — the tab design made it hard to read and see how each filter interacted with the other filters (see the “before” image). It also lacked the ability to nest filters, which is common in these types of tools and users expected it.

Before:
Before:
After: more legible on one page
After: more legible on one page
After: new nesting ability
After: new nesting ability

2. Color

2. Color

How might we thoughtfully add the ability to apply color conditions to your data?

Users also wanted to be able to set rules to add color conditions to data. This is a common feature for many applications, from Excel to more advanced analytics tools. 

I intentionally worked with engineering to build upon the new filtering component for this feature, with three goals:

  1. To keep things familiar for users.

  2. Be efficient on both the design and engineering sides. 

  3. Add components and variants to use going forward.

How might we thoughtfully add the ability to apply color conditions to your data?

Users also wanted to be able to set rules to add color conditions to data. This is a common feature for many applications, from Excel to more advanced analytics tools. 

I intentionally worked with engineering to build upon the new filtering component for this feature, with three goals:

  1. To keep things familiar for users.

  2. Be efficient on both the design and engineering sides. 

  3. Add components and variants to use going forward.

3. Formulas

3. Formulas

  1. How might we best give users the ability to write custom formulas they need for common analytics?
  2. How might we simultaneously help technical users and more casual users to write their own formulas? 

The analytics tool already had built-in formulas, but users needed to be able to make their own to adequately do common analysis tasks. I wanted very technical engineers and data scientists to be able to write out complex formulas using the free-form text editor. But I also wanted users who might not be comfortable with syntax to be able to write simple formulas where you only needed to add a few simpler operations (e.g. a + b / c). So the design has what I internally called training wheels, where you can write a formula using only the insert buttons and the operator buttons, and your syntax will be correct.   

  1. How might we best give users the ability to write custom formulas they need for common analytics?
  2. How might we simultaneously help technical users and more casual users to write their own formulas? 

The analytics tool already had built-in formulas, but users needed to be able to make their own to adequately do common analysis tasks. I wanted very technical engineers and data scientists to be able to write out complex formulas using the free-form text editor. But I also wanted users who might not be comfortable with syntax to be able to write simple formulas where you only needed to add a few simpler operations (e.g. a + b / c). So the design has what I internally called training wheels, where you can write a formula using only the insert buttons and the operator buttons, and your syntax will be correct.   

Prototype

Prototype

The prototype I made in Figma to align everyone internally

This includes new visual design, information architecture, and some of the new features I added all in one demo. 

The prototype I made in Figma to align everyone internally

This includes new visual design, information architecture, and some of the new features I added all in one demo. 

Architecture

Architecture

How might we best restructure the cluttered UI to make actions clear, discoverable, and follow a logical hierarchy?  

A broken information architecture buried a lot of actions in the UI, made the initial landing page confusing to scan and navigate, and had unclear terminology that didn’t match user’s expectations. I overhauled the page layout, starting in the abstract, to group everything logically. I also made sure it followed a top-to-bottom and left-to-right flow based on which actions a user would take first. 

As an example, I moved this module feature to a more appropriate location in the interface. It's a low-utilization feature, and the prominence was confusing for users who didn't need it.

Before:
Before:
After:
After:

A.I.

A.I.

How might we use emerging advancements in LLMs to make building a report easier?

Customers were increasingly asking for the capability to generate reports using natural language and chat as a starting point. So I started to work earnestly on how to make report creation easier using LLMs. The old model was basically “buttons over SQL,” and the A.I. model will likely keep a large component of that, but the flow will be a natural language query translated into a SQL query — especially for inital creation. And while this is possible, there are lots of technical aspects to sort out. I was spearheading this direction when my time at Cisco ended. 

How might we use emerging advancements in LLMs to make building a report easier?

Customers were increasingly asking for the capability to generate reports using natural language and chat as a starting point. So I started to work earnestly on how to make report creation easier using LLMs. The old model was basically “buttons over SQL,” and the A.I. model will likely keep a large component of that, but the flow will be a natural language query translated into a SQL query — especially for inital creation. And while this is possible, there are lots of technical aspects to sort out. I was spearheading this direction when my time at Cisco ended. 

Reflection

Reflection

This was a dynamic, challenging project. It was very fast-paced, which was exciting, but meant I needed to be efficient with my time. It worked out, and some of the natural efficiencies that arose from working on multiple features at once—like being able to clearly make the case for reuse of components—were wins.  

I was also the sole design owner of the entire product at the time, which is the type of broad scope and ownership I like to have. 

Unfortunately, my time at Cisco ended before everything I had designed was finished being built. This means that I don’t have all the data we were planning on tracking, and I missed out on getting the qualitative feedback from users who undoubtedly were going to love all the new functionality. 

My external demos were going well, and customers were saying things like: "This looks light-years ahead of what we're working with today."

NEXT:

Keeping messaging competitive in Webex.

How I kept Webex competitive by quickly adding key messaging features. These additions and improvements helped us retain key customers and are now used by upwards of 4 million users daily. 

Read case study

Read case study