Overview
ZenBill is a startup that provides a business-to-business payment solution. We learned from accountants that their current bill payment workflow is time-consuming and prone to manual errors. Our goal for ZenBill's enhanced bill payment solution was to streamline the process, enabling accountants to efficiently manage payments.
My Role: Lead Designer
As the sole designer, I was responsible for the entire design process, including user research, concept generation, usability testing, and finalizing designs, all to achieve user and business objectives.
I also collaborated with an amazing team of engineers and PMs to bring this feature to life.
Sending bill payments is time consuming process for accountants.
We heard from users that their current bill payment process is cumbersome and time-consuming, particularly for accountants who are responsible for paying bills for multiple clients each month. The manual effort required to enter each line item and payment detail individually for every bill was found to be incredibly inefficient and a source of frustration.
The steps taken to process a single bill payment:
Now, imagine repeating this process for 10-15 clients, who each have multiple outstanding invoices.
Sending a single bill payment can be time-consuming, but when accountants have to repeat this task multiple times a day for multiple clients, it becomes an even more tedious.
Problem
The current bill payment workflow for accountants is time consuming and requires manual effort, resulting in errors and extended processing time.
The current bill payment experience at ZenBill reveals usability issues.
A heuristic evaluation reveals various issues, including challenging navigation, inflexibility, and inconsistencies, resulting in unnecessary delays throughout the bill payment process. ZenBill’s payment solution facilitates bill payments, but it hinders accountants primary objective of completing as many invoices as possible.
User control and freedom
Accountants faced limitations in editing bill file attachments once they were created, requiring them to delete the bill payment record and initiate the process again.
Consistency and standards
Our designs had numerous inconsistencies, frequently using multiple names or labels to refer to the same element, such as "due date" and "pay on date."
HMW
How might we create a bill payment process that is efficient and intuitive for accountants?
Key Research Insights
Accountants responsible for billing and financial management for businesses face a major challenge in the time-consuming process of paying bills, averaging 2.5 hours per day. The key insights from user interviews reveal the following themes:
Bill Management
Accountants typically have multiple bills from different vendors due at the same time.
Processing Time
Accountants spend an average of 2.5 hours a day processing bills.
Human Error
Checking for errors is the most time consuming part of the bill payment process.
Competitors automate bill parsing and utilize a split screen view to speed up bill processing.
My competitive analysis revealed that competitors have automated bill parsing to extract details and pre-fill fields from a bill file. They also utilized a split-screen view, enabling users to simultaneously review invoice and payment details, allowing users to easily detect potential errors. These insights served as a source of inspiration when designing the interface of our improved bill payment solution.
Our team implements Amazon Textract for automated text extraction from bill files.
After extensive research and deliberation to speed up the bill payment process, our team determined that automating it through text extraction was the optimal solution. Among various service options, we selected Amazon Textract, a machine learning (ML) service proficient in extracting text, handwriting, and data from scanned documents.
Technical Limitations
One limitation we encountered during the development process was the speed at which bills were uploaded and parsed through. The optical character recognition (OCR) was slower than expected and it took an average of 45 seconds to process a file.
To address this issue, I prioritized creating a clear, but enjoyable processing screen that reduces uncertainty during the wait time.
How does this feature integrate into our current product?
Previously, ZenBill only allowed manual entry for bill payment. Now, with the new automated bill feature, users can upload their bill file and let the system extract and fill in the information automatically. This option is integrated into the main payment process, giving users the choice to select their preferred input method.
Project goals
Error Prevention
How might we reduce the number of errors when processing invoices?
Efficiency
How might we reduce the amount of time spent processing a single invoice?
Multitasking
How might we support managing multiple bills and vendors at the same time?
Version 1: A vertical layout identified key usability issues for accountants.
For our first iteration, we kept the vertical split-screen that existed in the current ZenBill experience. After conducting usability testing with current users, we identified key issues in this layout.
What didn’t work
Accountants had difficulty navigating the page, especially when scrolling to see hidden parts of the bill file.
How we improved
We switched to a horizontal split-screen, which allowed easy viewing of both the bill file and input fields.
Since 90% of users were on desktop, the wider view also posed no major issues.
Version 2: A horizontal view improved usability, however there were still areas for improvement.
With the new horizontal layout, accountants were able to complete their bill payments faster during our usability test. We did however receive feedback that line items were difficult to read and differentiate. When there were multiple line items, which was common, it was visually overwhelming.
We also noticed that there were still design inconsistencies that needed to be addressed, such as multiple form styles on the page.
ZenBill’s automated bill payment solution streamlines the accounting workflow.
Accountants can create bill payments by uploading vendor bills, which OCR technology can then automatically extract key information from and pre-populate fields for easier use.
Impact
Accountants reduce daily bill processing by 1 hour
Two weeks after launching ZenBill's automatic bill payment, we surveyed accountants to measure the impact on their bill processing. The results showed a significant improvement, with accountants reducing their daily bill processing time from 2.5 hours to 1.5 hours, resulting in a 1 hour reduction in their workflow.