Can auditing be painless?

SAP Processor is for auditing expense reports. But reports aren't always as neat and tidy as you want them to be…

Overview

Designer & Researcher | 2022-2023


SAP Concur Travel & Expense is a suite of services available on web and mobile that allows companies to track and manage employee spending and travel.


Processors are part of a company’s Accounts Payable team, responsible for reviewing and approving incoming expense reports for reimbursement.


The product they use to conduct daily business activity is simply known as Processor.


Context

Designer & Researcher | 2022-2023


SAP Concur Travel & Expense is a suite of services available on web and mobile that allows companies to track and manage employee spending and travel.


Processors are part of a company’s Accounts Payable team, responsible for reviewing and approving incoming expense reports for reimbursement.


The product they use to conduct daily business activity is simply known as Processor.


Determined KPIs

1

A cohesive design language across all SAP products to sell a seamlessly integrated SaSS suite.

2

Improve efficiency, speed, and accuracy of reports by reducing cognitive overload.

3

Meet WCAG Level AA accessibility for enterprises and government contracts.

Video demonstrating the legacy experience.

A Look at the Legacy Experience

I conducted a deep heuristic investigation and found that way-finding and aesthetics were particularly problematic.

Core Issues

1

Painfully Slow

Long load times mean slower audits, slow reimbursements, and angry employees.

2

Tedious interaction

The tables require horizontal scrolling to find key information.

Users must flip back & fourth to cross-reference receipts and form data.

3

Audit Liabilities

Processors have the option to delete reports, but this can cause added work at best, and legal action at worst.

Primary Goals

Make the “spend to reimbursement” flow as simple as possible while maintaining all functionality for experienced users.

Update the processor to match the new and more accessible UI, creating a seamless experience across all apps.

The Mind of a Processor

I interviewed 20 subject matter experts, admins, and processors to understand the role and different business needs across sectors and sizes.

We learned that “Processor” is a bit of a complex term.


Many roles can fulfill the same duties as a processor, so we needed to focus less on title and more on core tasks.


Interconnection diagram showing the different types of actors and touch points involved in the payment, audit, and reimbursement flow.

Meet our processor

Persona Diagram for our primary user, processors at enterprise size companies.

Turning observations into opportunities...

Processors value speed & accuracy.

 They must review hundreds of reports a week and are frustrated with slow loading times and “a large number of clicks” when reviewing reports.

Can we reduce the levels of hidden content?

Processors dislike sending reports back.

They hate sending reports back to the submitter for minor corrections.

Can we allow editing capability?

Processors are stuck doing a lot of manual labour.

Processors often print out physical copies of reports to audit and archive the data.

Can we leverage automation and AI?

Processors want UI that fits their environment. 

Processors want the ability sort, filter, and group items, but some companies need more features than others. Screen sizes also vary, which affects their ability to audit reports.


Can we provide customizable UI for every user?

An ideal day

Storyboard for the ideal workflow for processors, managers, and submitters.

Small Effort, Big Impact

A complete overhaul wasn’t in the cards due to scope, but we had enough data to work on an MVP that would greatly improve the experience with the least amount of dev effort.

Painfully Slow to lighting fast by adding the ability to add, delete, or modify items.


Also implemented a new back-end system to increase performance and reduce loading time for items.

Fix tedious interactions by showing a side-by-side view of expense data and attachments to allow for easy comparison.


Cut out unused columns in the table to reduce need to scroll.

Prevent auditing liabilities by removing the ability to ‘Delete’ reports, which can cause major setbacks or legal issues.


Instead of deleting the report, archive it so it is removed from the queue.

Finding the Right Layout

Experimenting with the layout

I tried a few different configurations of this layout, attempting to keep the same components but rearranging them to fit our grid system.


I found that it was impossible to have all the key information visible at the same time with these constraints.

Hover to pause and view iterations.

These weren’t working.

So I went back to the data.

Using Adobe Analytics to view the most frequently used columns, I narrowed down the top 5 data points of an expense.

This allowed me to forgo the table for a more functional design.

Final Design

Pros

Can view all fields with ample space for each component.

No more horizontal scroll required, which posed a big visibility and accessibility issue.

No more button to delete a report.

Cons

More dev effort required for custom Expense and Itemization cards.

I tested this prototype with 7 processors and 3 managers, instructing them to “Proceed as you normally would and review the following reports.”

Prototype Testing

100% of participants liked the new design over the legacy one for increased visual clarity, legibility, and information hierarchy.

Areas for improvement

Participants did not like seeing all itemization data at once, because it makes the vertical scroll too long.

We removed some of the icons and alerts that were not accessible, however sighted users still wanted the functionality.


Participants felt that having to mark each line item as “reviewed” was tedious and difficult to spot at first glance.

What’s next?

1

Iterate on the pain points from testing: reduced vertical scroll, accessible icons, and bulk actions.

2

Document specifications for accessibility and localization.

3

Leverage AI to read receipts and automatically approve reports

Phoebe Lim

Based in Vancouver, Canada

Currently open to new opportunities.

LinkedIn

pjoylim@gmail.com