Enhanced B2B Invoices & Statements

Enhanced B2B Invoices & Statements in PROLink

Role: UX Designer
Project Length: 3 months, implemented in phases (November 2023 and January 2024)
Type: Enhancement for digital retreival of invoices and statements
Business Impact: $400K savings/year by eliminating a manual paper process
‍

Project Background

NAPA PROLink is the online parts catalog and purchasing portal for commercial customers of NAPA. Any business (usually auto repair shops) can buy aftermarket auto parts on PROLink and get these delivered from a local NAPA store.

This project was a part of the NAPA PROLink redesign, and focused specifically on the Invoices and Statements experiences where customers access itemized purchase records. This solution resulted in an estimated $400K/year savings by eliminating a manual paper process. There were approximately 40K monthly visitors for Invoices, and 9K for Statements which were launched as an MVP in 2022.
‍

The first part of the redesign was released in November 2023. Phase 1 of the redesign brings in highly requested features such as multi-select and print. Phase 2 adds multiple store selections, Proof of Delivery photos, saving capabilities, and an improved navigation structure.‍

Research Process

To help with user recruitment, I gathered feedback from support emails and survey responses. These were organized with the direct contact information of customers, and grouped by the type of issue or feature. A prominent complaint mentioned was the inability to select multiple documents for printing, since many customers needed paper records for various financial processes.

"Printing monthly invoices have been a challenge. Is there a way to create an option to print all within a date range? This would help when printing 170 plus invoices every month.”

These insights helped us to better understand what and why Invoices and Statements are being used for, and validate features to help with pain points.

From insights, I created user flow diagrams to outline how a user might accomplish particular tasks such as searching for an invoice or print multiple documents at once. These diagrams were walked through with the Product and Engineering team to verify and think through technical feasibility.

Challenges

There was a hard deadline tied to the overall redesign, which caused this project to be released in phases. One specific challenge was that the proposed mobile designs could not be developed in time. Along with the low percentage of overall users on mobile (2%) this led to the desktop experiences being prioritized for the Phase 1 release. As a temporary workaround, we notified users about a better experience coming in the near future.

I also had to design around some technical constraints, particularly related to page limits and maximum loads.

Implementation

Designs were developed from September to October. I worked closely with the development team to make sure that designs and production aligned, while clarifying expected behaviors of new components. The design system is still being created, so there was new territory for the developers.

Additionally, we had an internal team change so I started working with a new team. However, I made sure to clarify all questions with the designer taking over Invoices & Statements for a smooth transition, and that everyone was on the same page for next steps as we transitioned from MVP to Phase 1, and Phase 2 (shown below).

Next Steps

The live experience was launched in November, implementing Phase 1 designs. These enhancements focused on multi-select, printing, filtering, and an improved navigation experience.

In the future, there will be new features such as downloading data, filtering by multiple stores, integrations with other accounting software, and online payments. I look forward to seeing how this product continues to improve based on more research and customer feedback.