desktop with data chart

Product Performance Dashboard

Discovery, Research, UX Design, API Integration

Project Overview

The Challenge

Mastercards Enterprise Security Solutions suite is comprised of multiple products, each with slightly different reporting and dashboard needs. Much of the information presented in the dashboards are similar and interrelated, though the user experience had no cohesion.

The user experience team worked with product teams to create a cohesive, user-friendly framework. We collaborated extensively with product owners, ran workshops, and worked with various design teams around Mastercard to develop a strategy for deploying standardized dashboards across product teams.

As the UX Designer, I worked product teams to develop a short and long-term roadmap, UI standards, and design framework for a collection of dashboards.

The Solution

A multi-phased strategy that immediately addresses pressing needs of UI consistency, while working toward a longer-term strategy of consolidating dashboards to create a seamless experience.

This effort is currently ongoing, stay tuned for updates!

"How might we enable our customers to make informed decisions on their portfolio by creating a streamlined delivery of insights into product performance, benchmarking, and trends in the fraud landscape."

Defining the Problem

We first started by better understanding what problem we were trying to solve. This involved working with business architects and  8 product owners to identify the current state of data-driven insight delivery.

Getting stakeholder input and buy-in was imperative to a successful strategy. The UX team brought 8 product owners together for a half-day workshop where I facilitated a number of exercises to better understand the metrics and KPI’s in each of the dashboards, identify overlaps, and understand pain points.

Through our research, we identified three main challenges to solve.

Product Centric vs. Experience Centric

Each product team was approaching their dashboard in silos, creating inconsistencies in the experience for end users. There was initially no standard for UI elements such as information placement, navigation, and styling, giving a disconnected feel to the suite of dashboards.

Redundant Information

There is a lot of overlapping data from one dashboard to the next, creating redundancies and inefficiencies in the workflow for both Mastercard employees and customers.

Not centrally located

Dashboards were placed in a number of different locations instead of one central location, leading the users to search around the site to find the information they are looking for.

Understanding our Customers

We identified three main types of users, each with different goals and actions to take. Below is our primary user type.

“I need to quickly understand the effectiveness of my bank’s fraud strategies, as well as view an overall snapshot of my customer's behavior"

-Mastercard Customer

Design

I worked with our lead UXer to brainstorm different ideas for initial concept testing. Navigation a very important to this strategy, so we created user flows of our main user type, a Fraud Analyst.

User Flow

To better understand how a user would interact with the system, we defined user flows.

Concept Designs

I developed initial lo-fi wireframes and prototype for concept testing to get early user feedback from customers and stakeholders.

View the lo-fi Prototype here >

1- Primary Navigation

Based on our research, the all eight dashboards fell into 2 categories: Product Performance and Insights. By creating intuitive groupings, we were able to take 8 dashboards located in 8 different locations and move them into one central location.

2- Secondary Navigation

By moving similar metrics/KPI’s in one location, we reduced redundancy with the types of metrics being displayed. One particular metric (“approvals”) was repeated 5 different times, but this redundancy was reduced, which makes it more efficient for both internal and external teams.

3- Standardized Layout

The design framework provided a flexible guide for product teams to build their dashboards with, creating consistency amongst all the dashboards

UI Standards

I defined UI standards that met WCAG AAA standards.

Concept Testing

To validate our design’s, a round of concept testing was run with 3 customers to get initial feedback. We were looking to answer the following questions:

  • Understand how the landing experience addresses needs and expectations of customers. 
  • Understand what analytics customers would want to see and what analytics are most important. 
  • Understand additional opportunities to create an experience-centric product.

Findings associated with dashboard and analytics:

  •  Overall customer were excited about the landing experience, especially the ability to view insights into their data.
  • Gained a better direction for what information matters most to the customer.
  • Gained deep insight into how the customers use analytics to make decisions.
  • Uncovered a knowledge gap in some customer to be able to make sense of the data and successfully take action in proactive ways.