Reporting Application Upgrade

An outdated, non-responsive payments reporting platform badly needed updating; it had been originally been built to only accommodate desktop devices and was failing even the most basic accessibility standards.

The application was slow, unwieldy, overwhelming, and did not scale to allow users to see their data on devices smaller than a laptop. In fact, the site wouldn’t allow users to view the site at all under a certain resolution. The home screen, a dashboard containing a dizzying number of charts and statistics, had a load time that frustrated most users, who also appeared to not even use the application.

The customer base, mostly small business merchants. complained frequently about the difficulties they faced and the pain points they experienced.

My team was tasked with the following:

  • Gathering the pain points of the users
  • Understanding what features merchants were actually using and how they navigated the application
  • Redesigning the entire application with the following criteria:
    • Making the entire application responsive
    • Building a structure that reflected how customers actually used the platform
    • Updating the design to be more modern while also utilizing the company’s design system

Research and Data Gathering

The team used the following methods and tools to conduct research:

  • Pendo, an analytics and feedback tool, to track quantitative data such as user journeys and page views. Pendo was also used to collect quick feedback points through an open-text form; we were able to recruit users for qualitative research conversations through this method as well.
  • 1:1 interviews with customers to elicit how they used the reporting platform, their pain points, their wish list for future features, etc.
  • 1:1 interviews with customer service representatives to gather trends of why users would contact support to get help with the application, etc.

“I want to look at reports first, I don’t care about the dashboard. Most of the information isn’t important to me, maybe just a quick summary with some trends”

“I can’t use the reporting tool on my tablet, all of the screens cut off and I can’t take any actions”

“I can’t figure out how to filter my data. Most of the time I just download everything and filter it manually, which feels like a waste of time.”

Key Findings
  • Most users never used the dashboard; instead, they would often go directly to specific reports based on their job function.
  • Due to the lack of responsiveness of the application as well as the table data, most users couldn’t find how to do simple actions such as viewing details of individual transactions, etc. and were considering leaving the company for a competitor with a more friendly interface
  • The filtering interface is clunky, overwhelming and cumbersome.
  • Overall, most of the features aren’t being used by most customers at all.

The Solution

For the initial redesign, we decided to focus on tackling the biggest pain points:

DASHBOARD/ HOME SCREEN: We replaced the charts with a small overview chart and quick links to the user’s most recently viewed and generated reports; we also included the most recent transactions, as the data showed us that the transaction finder was one of the most frequently used screens as well.

Original Dashboard
New Dashboard

TABLE REFACTORING: We replaced the hard-coded, non-responsive table interface with AG Grid, a responsive, easily customizable table framework that would allow us to make our reports truly responsive as well as allow for pinnable columns.  We also refactored the filtering functionality to use an additive filtering paradigm, which also allows the tables to be more mobile-friendly.

Original Reporting Table Interface
New Reporting Table Interface

OVERALL RESPONSIVENESS: The entire interface was overhauled to emphasize responsive capability as well as user behavior on specific devices. In the original version, the application didn’t scale for tablets, leaving important data off the screen; at lower resolutions, the users got completely blank screens. 

However, users also indicated that they weren’t likely to use all of the application’s functionality on their phones due to the complexity of the reports. Therefore, while we wanted to give users access to a mobile version, we opted to create a streamlined and simplified version of the interface that would offer the features users needed on the go and remove complex options (like filtering, etc).

Original Tablet View
Original Mobile View
New Tablet View
New Mobile View

Leave a Reply

Your email address will not be published. Required fields are marked *