Project Overview

Bank Reconciliation

Bank Reconciliation is a platform in FreshBooks where business owners can effortlessly import and manage their bank transactions so they’re able to keep their books organized.

I’ve designed a new feature: Import Transactions from a File.

Feature Explained

What is Bank Reconciliation?

Bank Reconciliation (Bank Rec) allows business owners and accountants to match bank transactions with FreshBooks entries to ensure the balance sheet reflects the actual bank account balance.

This is optional but highly recommended for users. It can be done at any time or as part of a daily, weekly, or monthly routine.

1. By comparing the transactions that the business owner has entered into FreshBooks to the source of truth (money that has actually left their bank account), they can ensure their accounting books in FreshBooks are as accurate as possible
2. Makes the business owner’s workflow a lot easier, so they don’t have to create journal entries in order to have an accurate balance sheet (e.g., to allocate certain cash transaction to a separate bank account and to get them out of petty cash)
3. If a business gets audited, one of the first things that auditors will do is to compare owner’s bank statements against their general ledger (what they entered in their accouting software) to see if something is missing or added in to make sure their books are accurate and not fraudulent. Reconciled transaction make the audit process a lot smoother because the owner has already matched everything up in their bank account
1. Connect a bank account
2. Set an Opening Balance
3. Start matching

Problem Definition

No ability to add multiple transactions at once

Previously in FreshBooks, business owners and accountants had to enter transactions manually, one at a time which was a slow and inefficient method for handling multiple entries. This limitation caused friction, discouraging users from reconciling transactions regularly.

Adding Transactions in Bank Rec - Before

UX Strategy

UX strategy

Vision

A platform where business owners can effortlessly import and manage their bank transactions so they’re able to keep their books organized.

Goal

Improve the transaction management experience for scaling business owners and accountants.

Plan

Make the process of importing transactions quick, efficient and intuitive.

Process

Design Thinking

Due to a tight timeline for this project, the team and I had to scale down the Design Thinking process, leaving out some aspects of user research such as user interviews and testing.

However, we leveraged product analytics, existing data, and insights from prior customer feedback, performance metrics, and survey results. This enabled us to develop a hypothesis that guided us toward a solution that addressed issues users were experiencing with Bank Rec.

Discovery

• UX audit

• Personas

• Journey map

• Competitive analysis

Ideation

• User flows

• Wireframes

• High-fidelity design

Prototyping

• High-fidelity prototype

Implementation

• Final design

• Design handoff

Discovery

UX audit

Conducting a UX audit helped us identify gaps in the customer experience related to adding bank transactions.

Journey map

When creating a journey map, the goal was to illustrate specific pain points that users face when trying to add multiple transactions on the Bank Rec page. I identified opportunities and quick wins to streamline their workflow.

Competitive analysis

Bulk import and transaction management are common features among competitors, though many solutions fall short in terms of user-friendliness, which can lead to business owners feeling unsure about using these tools effectively.

Ideation

User flow

The user flow shows a straighforward and quick process of adding multiple transactions.

Wireframes

Wireframes were created based on the final user flow, using UI components from the design system while incorporating the new feature.

Solution

Easily import all transactions

A platform where business owners can effortlessly match transactions from their bank account with records in their FreshBooks account, no matter what bank or credit card they’re using so they’re able to keep their books organized.

By having the ability to import a CSV file into FreshBooks, business owners can now easily manage their Bank Reconciliation transactions to keep their books well organized.

Note: Bank Reconciliation is only available on Plus, Premium, and Select plans while Trial users can access the feature for 30 days.

1. Get the account statement (CSV file) from the bank
2. Adjust the CSV file for importing if necessary
3. (In FreshBooks), go to: Accounting, click on the “x left to match” link next to the Bank Account you want to reconcile in
4. In Bank Rec, under Unreconciled Bank Transactions, click on the Add Bank Transaction button and then Import From File
5. Select a CSV file from your computer
6. Match the fields to the columns from your file using the dropdown (e.g., Date should match to the Date header inside your file)
7. Once you’re done matching and specifying the Date Format, click on Import Transactions
8. New transactions will be added and you can start reconciling them. If the new transactions are from before the Opening Balance Start Date, the Start Date will need to be adjusted to include these new transactions before they can become available for matching

Outcome

Final design

To preserve the user’s workflow, the import experience is presented in a modal, enabling completion without leaving the current page. After importing a CSV file, users remain in the modal to match columns from the right side with the corresponding fields on the left using input fields.

You can view the prototype to explore the design in more depth.

Note: the prototype has limited functionality.

Design principles

Adapt to the Task
Maintain Flow
Speak Human
Set Expectations
Don't Add, Evolve

Import From File - Match Modal - 1 Column Amount Format

Import From File - Match Modal - 2 Columns Amount Format

Import From File - Match Modal - Amount Spent - Dropdown

Import From File - Match Modal - Filled State

Import From File - Imported Transactions

Bank Reconciliation - Matching Transactions

Bank Reconciliation - Matched Transactions

Bank Statement - CSV File - Example
Note: The “Description” and “Category” columns are optional but can be included in the CSV file before importing to improve matching accuracy.

Impact

KPIs

The new Bank Rec feature made a strong impact, as reflected in the success metrics, and customer feedback, following its release.

30,000+

MAU (monthly active users)

+40

NPS (net promoter score)

82%

adoption rate

90%

engagement rate

92%

retention rate

How we measured

Adoption rate (82%) was calculated by the proportion of users who interacted with the Import Transactions from a File feature out of the total users who have access to Bank Reconciliation, since launch.
Engagement rate (90%) was calculated based on users who performed meaningful actions while importing transactions from a file, per month.
Retention rate (94%) was calculated as the average percentage of users who continued to actively use the Import Transactions from a File feature month-over-month, based on usage data since launch.
Net promoter score (+40) was calculated using feedback gathered through Pendo surveys delivered in-app and via email. Most users rated the experience a 9 or 10, citing the streamlined transaction import process as a key strength.

Customer feedback

“FreshBooks’ Bank Reconciliation tools work continuously and in real time instead of requiring manual reconciliation.”

Senior Analyst | Business Owner

Project Details

Project details

Role: Product Design

Company: FreshBooks

Team: Product Designer, Product Manager, Engineering

Frameworks: Design Thinking, Agile

Tools:

Design: Figma, Zeroheight, Miro
Project management: Jira, Confluence
Analytics: FullStory, Pendo, Looker

Year: 2023

Platform: Web

Link: FreshBooks.com