product design

In progress

product design

In progress

product design

Invoice review

The Invoice Review screen consolidates all bill details and related documents into a single decision-making pointbefore approval.

Powered by AI, it matches bill line items with invoice data, suggests coding, and flags discrepancies for quick resolution.

From here, users can approve, hold, or request changes, with the whole status history and the tracking of changes.

Personas

Employees

AP processor

AP Processor is responsible for managing the company's payments for suppliers, ensuring accurate and timely processing invoices, payments, and reconciliations.

 

The role includes verifying financial records, communicating with suppliers, while ensuring internal policies and regulations. Additionally, the AP Processor collaborates with accountants and external auditors to support financial controls and reporting.

 

Key challenges include meeting strict deadlines and maintaining a high level of accuracy to prevent critical errors.

AP Controller

AP approver

CFO/CEO

Support

Bill summary

Payee

Prime LTD

Payer entity

UK GlobeCorp

Net amount

1,100.00

Tax amount

220.00

Total

1,320.00

Currency

USD

8 items selected

Delete

approved

Bill header

Bill type

Non-PO backed

Invoice number

627380

Invoice date

May 29, 2024

Due date

May 30, 2024

Description

Office equipment and installation services

Department

IT

Location

UK

Bill lines (2)

Delete all lines

Add new line

1

Description

K123 - Wireless Keyboard

Expense account

73050 - Computer accessories

Qty

1

Unit price

1,000.00

Net amount

1,000.00

Tax code

S-GB (20%)

Tax amount

200.00

Total

1,200.00

Department

IT

Location

UK

2

Description

A100 - Installation Service (On-si...

Expense account

73050 - Computer accessories

Qty

1

Unit price

100.00

Net amount

100.00

Tax code

S-GB (20%)

Tax amount

20.00

Total

120.00

Department

IT

Location

UK

Billed to

Adam Strand

600 3rd Avenue

New York

US

Prime LTD

Invoice Date: 29/05/2024

Invoice number: 627380

Invoice

Due date: 30/05/2024

Net amount

$1,100.00

Total

$1,320.00

Tax amount

$220.00

Page

1

/ 1

100%

#

Item & Description

Service Date

Net Amount

Tax Rate

Total Amount

1

K123 - Wireless Keyboard

27/04/2024

$1,000

20%

$120

2

A100 - Installation Service (On-site)

27/04/2024

$100

20%

$1,200

Bills

Lexor

More actions

Save

Submit

Prime LTD

PO-backed bill | 2-way matching

Pending Review

1 of 9 bills

Search

Messages and files

Audit

Activity

Background

We received NPS feedback from a user who couldn't find the Audit button on the screen.

Side panel

Bill search

Bill pagination

Side panels containing

audit, commentsand attached files

Copy ref code

Download image

Goal

Assess the visibility, placement, and discoverability of action buttons on a complex screen.

Research

Through the research, I identified that in the B2B and B2C systems I examined, action buttons are typically concentrated and placed at the top of the screen, sometimes on the right and sometimes on the left, depending on the screen's layout and language.

 

Additionally, I noticed that unlike my screen, which has one button to open the side panel with tabs, other systems have different buttons that open the side panel, with its content changing when another button is pressed while the panel is already open.

 

When implementing changes on my screen, I was able to categorize the action buttons into two clear groups:

Support Action Buttons

Actions that support the invoice workflow but do not directly impact its flow.

Audit

Comments

Attached Files

Download image

Bill pagination

Bill search

Copy ref code

Core Action Buttons

Actions that drive the invoice workflow, but are used less frequently

Hold payment

Send back to AP

Delete bill

Duplicated bill

User Testing Findings

Button visibility & Task Completion

All users successfully identified the button locations and specific icons, completing their assigned tasks.

Understanding of button logic

Users demonstrated a clear and consistent understanding of the button categorization logic within the screen.

Icon Size Issue

Users demonstrated a clear and consistent understanding of the button categorization logic within the screen.

Ref Code Button Placement

Four users initially searched for the ref code within the content before noticing its new button location. Follow-up discussions revealed that the button had relatively low usage, and users found it more intuitive to place it near the Bill Number field within the content itself.

Final Solution

I increased the size of all buttons and integrated the Ref Code button into the content as a field with a quick copy function.

Bill pagination

Bill search

Download image

Attached Files

Audit

Comments

Separated side panel

More projects

Product design

Payment list

Explore

Product design

Home page

Explore

system design

Design system

Explore