CCaaS Redesign
Complete redesign of a Contact Center as a Service web application, from discovery to final design.
Names, logos and other elements have been modified or masked in order to avoid disclosing confidential information.
My role
Principal Product Designer
UX Researcher
Timeline
May 2024 – Feb 2025 (9 months)
Background
What is the product?
It is a CCaaS (Contact Center as a Service) web application for customer relationship management.
The product allows customer requests arriving from various channels (calls, SMS, email, chat, forms, Messenger, WhatsApp) to be handled in the form of case.
Problem
The product has evolved significantly over the years (new channels, new functionalities, etc.) complicating screens and user journeys.
Currently, the product lags behind its competitors: it is complex, less intuitive, and not well-suited for customers needing to manage multiple channels simultaneously.
Objectives
- Conduct an in-depth UX study
- Improve user experience to enhance case processing time.
- Determine whether contextual improvements are needed or if a complete redesign is required
Team Context
The project started as a duo: a Lead Designer (focusing on the UI and Design System) and myself, the UX Designer (responsible for UX research and redesign).
However, during the project, the Lead Designer had to leave, and I continued as the sole Product Designer, responsible for the product design strategy and roadmap on the project, component design, prototypes, UI, design documentation, and more, in addition to the research.
Achievements
Over 10% Reduction in Navigation Time
Case processing time reduced by more than 10%.
This improvement significantly enhances productivity.
40% Fewer Screens
Number of screens users need to navigate through to complete specific tasks has been reduced by 40% in typical flows, streamlining the user experience.
Research
Research methodology
Client and User Studies
Visits to 6 contact centers, more than 40 interviews, over 60 hours of observations, several research workshops with different teams and clients.
Produced documentation:
- 6 Users personas covering major product uses
- 8 user flows
- 4 observation reports
- Stakeholders map
- Client personas
Competitor Study
Analysis and use of 5 competing tools, observation of teams using competing products, interviews with competitors’ users.
Produced documentation:
- Competitor analysis report
- Comparison of user journeys between competitors and our product
Insights learned
Some of the key insights from the UX research:
- The product is lagging too far behind its competitors in terms of multi-channel capabilities.
- It can be limited in production for certain teams.
- Original user journeys no longer correspond to current usages.
- It aims to be multi-tasking but does not allow multiple cases to be processed simultaneously.
- There is a lack of necessary features, like notes in cases, the ability to tag a colleague, etc.
Example of research documentation produced during the research phase: Userflows, Persona.
Design and Tests
Ideation and Strategy
Workshops with Product Teams
Together with the Lead Designer, we prepared strategy workshops to better define the product vision, as well as ideation workshops to imagine the future of this product.
These activities helped define the direction we wanted to take the product and the resources to allocate.
Strategy
Based on my research findings, I recommended a complete overhaul of the tool to better meet user needs and align with the company’s strategic vision.
To support this recommendation, I presented my research, including a competitive analysis, user observations, and, most importantly, the key areas for improvement that cannot be implemented without a complete redesign of the product’s UX and UI.
This strategy was approved by the product teams.
Lorem
Wireframe
I designed detailed wireframes with the primary goal of streamlining case processing and eliminating the need to navigate back and forth between pages.
The main concern with these new interfaces was information overload and the readability of the various fields. To address this, I created several versions and conducted extensive usability testing.
Before
Lorem ipsum
Lorem ipsum
After
Lorem ipsum
Lorem ipsum
Prototype
To conduct usability tests, I designed 4 fully interactive prototypes (for all major user flows), based on the Design System.
Tests
To conduct usability tests under the best possible conditions, I created a rigorous testing protocol for each use case of the product.
I conducted over 20 usability tests with four different teams.
Lorem ipsum
Lorem ipsum
Lorem ipsum
Lorem ipsum
Lorem ipsum
User Feedback
All user feedback was very positive, and the prototypes were validated: all test protocols were successfully executed by users without any blockages.
Iterations
There were certainly some iterations to improve these prototypes, allowing us to optimize the user journeys and interfaces.
For example, a menu on interfaces raised questions among the product teams and some users, so I decided to conduct an additional A/B test on this specific point.
These tests allowed us to validate a version of the menu that better aligns with user needs.
UI delivery
After the prototypes were validated, I designed the final UI and documented the interactions, behaviors, and components.
For these UI I had to create various components and their documentation, to be integrated into our Design System.
Lorem ipsum
Lorem ipsum
Lorem ipsum
Next steps
Stay in touch with Users
To further develop this project while maintaining contact with users, I am setting up a User Club.
The goal is to allow product teams to have a direct link with users, foster a more iterative approach, and better incorporate their needs for future development.
I have created the documentation, workshop templates, communication materials, and guides as adaptable documents, so that this initiative can be replicated by other product teams for other products within the company.
Quantitative data
Unfortunately, using an analytics tool wasn’t possible during the initial phase of the project due to the sensitive nature of the data processed within the product.
After several demonstrations, I was able to demonstrate the necessity of using an analytics tool. I then implemented and administered CrazyEgg and later Microsoft Clarity for this product.
This allows us to track significant quantitative data that will be used for future development.
Lorem ipsum
Lorem ipsum
Future Challenges
The transition from the old version of the product to the new one will take place in three major updates that will significantly modify the interfaces and user journeys.
Rigorous monitoring will be implemented during these updates to measure the adoption of the new interfaces and ensure a smooth transition for users.
To avoid having to conduct another in-depth UX study, I will implement continuous product monitoring, particularly through the User Club and Clarity.
And after?
The redesign isn’t limited to the screens visible to the end user. Because this product is complex, it also includes complex settings screens.
Therefore, another important part needs to be redesigned: the settings screens, with numerous potential improvements to the user experience, such as guided settings, the creation of WYSIWYG case flows, a screen for visualizing KPIs, and more.
These are topics I’m currently working on.
Lorem ipsum
Lorem ipsum
