Voxanalytics

TL;DR: Redesigned a call analytics dashboard used by customers such as Autotrader and Zoopla. Simultaneously, created a design system for fast dev implementation and consistency across the product.

IOVOX Enterprise dashboard
Hi-res mock of the Voxanalytics dashboard

Context

iovox are a global leader in cloud analytics for phone calls, and Voxanalytics is their flagship product. The technology behind the product is and always has been impressive, but the design of the web app needed a refresh.

My involvement on this project was twofold. Firstly, to design from the ground up - a configurable, intuitive and meaningful analytics dashboard. Secondly, to freshen up the UI of the rest of the product with a consistent theme. Due to technical, financial and time restraints, a complete overhaul of the UX was out of the question, so we made more superficial UI improvements to integrate with the existing codebase.

The Dashboard

The dashboard is the primary way of viewing phone call analytics in Voxanalytics. Previously it was static, and the graphs, charts and data that were displayed were predetermined by the iovox team. The new dashboard had to be customisable and allow the user to choose both the metrics, and the type of graph/chart they wanted. Through user research, we discovered that users wanted flexibility, offered by providing a selection of ‘widgets’ that the user could choose and configure within the dashboard.

The Design System

The UI elements throughout the product were dated and inconsistent in terms of styling and placement. For that reason, I designed and built the UI section of a design system in HTML and CSS that contained all the major UI elements used throughout the product (buttons, dropdowns, typography etc.). I then worked closely with the developers to integrate this into the product.

IOVOX Enterprise UI toolkit
The UI assets that was designed and used throughout the product