Smart Diagnostics
Expanding Vyopta's call monitoring by introducing the ability to quickly identify the root causes of problematic calls, and provide remediation steps.
My Role
I was the lead product designer working on a team size of 6 people that included program managers, software engineers, customer success, QA testers and sales engineers. I was responsible for UX Design, UI Design, Interaction Design and UX Research (assisting lead Product Manager).
Smart Diagnostics details panel
Highlights
Unblocked multiple key deals in the 2021 sales pipeline.
Attracted new enterprise companies using Microsoft Teams.
Issues and remediations offered what Microsoft Teams did not, enticing new customers for Vyopta.
We delivered a huge customer feature request, allowing issues to be detected, explained and providing steps to resolution.
Project Scope
Our goal was to expand the app by providing detection issues and remediation steps, along with enhancing live metric charts and a new solution for ended calls, some of the limiting factors included:
Not all vendor's tools provided APIs for their live data, this affected how the project would need to be released in stages over a 5 month period.
There were a lot of unknowns for what exactly should and could cause an issue for different platforms, and what action steps should be taken.
There were hundreds of attributes for both the caller and the callee that needed to be easy to understand, displayed and searchable.
The Challenge
I was part of the complicated project that expanded the call monitoring app's detection and remediation capabilities and provide a solution for calls not in progress.
Customers were overwhelmed and did not know what to do with all of the data.
There needed to be a clear way to let users know what the issue might be and what steps to take to fix it.
Some platforms (like MicroSoft Teams) did not have real time data available to monitor, there needed to be a way to still capture, monitor and detect possible issues.
Outlining the different types of metrics that needed to be supported.
Research & Interviews
I researched different types of issues and apps within Vyopta's sector and others.
Then I mapped out the legacy call details workflow by developing wireframes to help determine our starting point.
Next, I helped research the current call details process by interviewing multiple internal stakeholders (software engineers, product support, sales engineers) to better understanding their expectations.
I interviewed key existing customers to understand how they expected to use call details.
We held many white boarding sessions that I lead within our product team to determine what direction and progression made sense.
Design Sprint
I helped facilitate multiple mini design sprints with key stakeholders to see how we might simplify call details and expand it with smart diagnostics.
Customers must clearly understand what the issues were and how to resolve.
Calls in progress needed to have easy to read data visualization charts.
Calls that had already ended, should display searchable call metric details.
All calls should clearly indicate a quick status and other device and network details.
Smart Diagnostics page
The Execution
I identified the key areas of the UX design based off of our research findings and broke the project up into the most intuitive sections. I start with sketching things out on paper, then creating basic wireframes, followed up with the core mock ups and finally developing a working prototype. We identified these key areas:
Quick status
Challenge: Users needed to scan the page to find a small call status indicator.
Solution: We wanted to make sure users could instantly view the call status and get a real sense of the urgency while capturing other requested details.
Status Header
Possible issues + remediations
Challenge: Previously, a "Possible Issue" concept did not exist.
Solution: We introduced a new concept of detecting issues and providing actionable steps to take to resolve.
Issues were calculated from a new quality metric matrix
Live EKG charts + controls
Challenge: Previously, metric parameters were displayed in a table format.
Solution: All call metrics would become visual data charts users could interact with and toggle audio, video and presentation modes.
Live data charts showed metric status in real time
Ended call detail record
Challenge: Previously, a call details record could only be exported and opened externally.
Solution: Users would now have the ability to view attributes, search and filter (between caller and callee) on all call details records.
Call details data record
Details panel
Challenge: Only a limited number of details were available.
Solution: We created a new flexible panel that allowed different types of data attributes to be shown.
Details panel
Outcome & Results
Smart Diagnostics unblocked multiple key deals in the 2021 sales pipeline.
We delivered a huge customer feature request, allowing issues to be detected, explained and providing steps to resolution.
Bringing Smart Diagnostics to the table allowed Vyopta to attract new enterprise companies using Microsoft Teams.
Issues and remediations offered what Microsoft Teams did not, enticing new customers for Vyopta.