Spectrum App Data Visualization
Advertising Support Application – Desktop
OVERVIEW
Spectrum is a broadband and cable provider serving the USA. Spectrum Reach is the division that sells advertising on TV, Streaming TV and online to customers. I worked on the app that supports sales in the creation of advertising solutions and reports. This case study focuses on the reporting feature of the app.
PROBLEM
The business wanted to add additional metrics to the reporting feature. Sales users expressed a need to be able to view these metrics on the app which they could share with their clients to show the value of proposed ad solutions.
The challenge was to interpret the data points from different sources and integrate them into the app. One source was a Powerpoint deck with detailed slides of metrics. The other source was a group of data graphs from Tableau, a visual analytics platform.
ROLE
I was the UX designer on a scrum team composed of a product owner, business analyst and external development team.
PROCESS
In order to understand what the metrics represented, I was involved in information gathering meetings with relevant cross-functional teams (market research, sales, data). Once I understood the story that the metrics told, I needed to visualize the complex data points in a simpler way. Since these could be shared with clients, the visualization needed to be understandable by a layperson.
For the first set of metrics, I was focused on a slide from the Powerpoint deck (shown below). I redacted the client's name for privacy. The business wanted to show both sets of reach analysis metrics, which are displayed as different types of charts (bar and pie). These charts are explained by their respective accompanying text, which the new visualizations won't have the benefit of.
Sample Powerpoint slide that shows different metrics
After exploring different options, I presented the metrics in a bar graph, which is consistent with how other metrics are displayed in the app. The bar graphs also stand on their own without relying on additional text. These were shared with stakeholders who have experience analyzing and explaining graphs to broader audiences. They provided useful feedback which was incorporated. The mockup below shows both sets of reach analysis metrics from the slide, integrated into the app. Note that additional data points are displayed when the user hovers over a color coded area that corresponds to the legend.
Mockup of reach analysis bar graphs
For the second set of metrics, a group of data graphs from Tableau was provided as the basis. These graphs (shown below) contain multiple data points within the same categories for one theme (audience composition). The direction was to integrate this into the app in a way which simplified the clutter and told the same story as in Tableau.
Using the existing charts in the app as reference, I explored multiple options while researching best practices in data intensive visualizations and examples of such. The option that garnered the most positive feedback from stakeholders was a combined chart (instead of side by side) that users could use comparatively in multiple ways. The mockup below shows the set displayed in its own tab on a report page. As with the first example, the legend and hover text provide context and are consistent through all the charts.
RESULTS
I did not have the opportunity to see these implemented as I left Spectrum before development. I am confident that these mockups provided a solid foundation for the product team to test, collect feedback and iterate on.
