Client project · B2B payroll

PayRun

A B2B platform that lets a CPA review and run payroll across many client businesses, from pay stubs to quarterly tax filings. Own the product design, information architecture, and interaction design; an engineering partner builds the platform.

Role
Product designer (discovery to UI)
Platform
Web app (desktop-first), mobile views in design
Tools
Figma, stakeholder interviews, service blueprints
Timeline
2026 – In progress
PayRun employee page on a laptop held in one hand: upcoming payroll preview and run history

Problem

What does the CPA need?

Our user is a CPA who runs payroll for many small businesses. Everything arrives by email and phone call, and the numbers get typed into an aging desktop tool. He tried the big platforms, and his reasons for leaving kept coming back to three things:

Solution

Two design goals

Clear hierarchy. Everything he needs on one screen, with the most important thing read first.

Follow the CPA’s mental model. When he talks through his week, it is always which client first, then which employee, then which period. So PayRun is organized the same way: client → employee → pay period.

User journey

The mental model of a CPA

He does not think in payrolls. He thinks in clients, then the people inside them, then the paperwork that follows. Every working session starts with the same three questions.

Illustration of a CPA with a thought bubble
  • Which client do I need to work on today?
  • Which employee needs the payroll?
  • Which reports do I need to create?

Underneath those questions sits the structure the product has to carry. One client is a small business with several employees, each on a different arrangement, W2 or 1099, filing status, weekly or bi-weekly, and each of those employees accumulates payroll after payroll.

Diagram: one client business branches into three employees with different W2 or 1099 arrangements, filing statuses, and pay frequencies, and each employee accumulates repeated payrolls

Core use case · Clients list

Clients tab

The CPA’s day starts with a client, so the Clients tab is the front door. It is not a directory. It opens on an overview: how many clients are active, how many payrolls are due in the next few days, and which of them need attention first.

Runs this week sits at the top as a status view: what is coming, what is still open, and what is already done, across the whole practice. The word run is his, not ours. Payroll people talk about running payroll, so using the same word keeps the interface in the language he already thinks in.

PayRun Clients page: total clients and payroll-due-soon cards above active and inactive client tables
The Clients tab opens on the state of the practice, not a list of names

Core use case · Client

Step inside a client

One click deep, everything about one business sits in one place: company details, the employee roster, and the runs. Before PayRun that meant searching months of email threads, so nothing about a client lives anywhere else now.

The page leads with the overall view of the business, then puts the most recent payrolls within immediate reach, since the last run is what he checks against when he starts the next one.

Client detail page for Meridian Construction LLC: company overview, employee stats, and the employee list with withholdings and net pay
The client detail: overview, roster, and every employee’s numbers, one room per client

Core use case · An employee

Reviewing one employee

This page carries a lot, so the work was hierarchy rather than subtraction. The payroll detail leads, because reviewing the numbers is the job. The employee overview sits beside it so he can confirm he is looking at the right person on the right terms before he trusts the math. Underneath, the run history and year-to-date totals build the record.

Every deduction is listed out, at the CPA’s request. He needs to see federal, state, Social Security, Medicare, and the rest itemized rather than summarized, so the goal was dense but legible, not less information.

Employee detail page for Jane Smith: upcoming payroll with full withholding breakdown, itemized payroll run history with draft and complete statuses, and year-to-date summary

Core use case · Creating a run

Creating a payroll: one form on a desktop, four steps on a phone

On desktop the whole form sits in one modal, with tax fields pre-filled from the W-4, so most of it is confirming, not typing. On a phone the same form becomes four steps with a stepper. Same data, same order, different pacing.

Create Payroll Run modal on desktop: run details, earnings, tax information auto-filled from the W-4, and deductions in one scrolling form
Desktop: all four sections in one modal, tax fields auto-filled from the W-4
Mobile step 1 of 4: run details with run type, pay period, pay date, and pay frequency
Step 1: run details
Mobile step 2 of 4: earnings breakdown with gross, hours, overtime, bonus, PTO, and reimbursements
Step 2: earnings
Mobile step 3 of 4: tax information with filing status and withholding auto-filled from the W-4
Step 3: tax info, auto-filled
Mobile step 4 of 4: editable deductions for 401(k), health insurance, and post-tax items
Step 4: deductions

Design decision 1

Quarterly rhythm

The filter started as a custom date range, which covered every case in theory. In practice the CPA does not work in arbitrary ranges. His year runs in quarters, so the quarters became presets sitting next to the custom range.

Filter by dates pop-up: calendar range picker with from and to fields and Q1 to Q4 quarter preset buttons
The date filter: custom ranges for any day, Q1–Q4 in one tap

Design decision 2

Filings: his mental model, plus a batch view

Filings are papers that go out to the IRS and the states, so I expected him to think in forms and deadlines. I was wrong. He still starts from the client.

So the page carries both. By Client groups filings the way he actually works, and List sorts everything by due date for the days when he is filing in bulk. The correction is the useful part: I had a reasonable theory about a regulated workflow, and one walkthrough with the person doing the work replaced it.

Filings page in By Client view: each client as a collapsible group of its forms, with due dates and statuses
By Client: filings grouped the way he thinks about them
Filings page in List view: every form due across clients, sorted by due date, with upcoming, draft, overdue, and filed statuses
List: every form across clients, sorted by due date for filing days

Working with AI

AI runs through the whole process on this project, not just the output. I use it to pressure-test the product definition before anything gets drawn, to widen the set of options while brainstorming, to build and revise screens in Figma, and to move through iterations faster than I could by hand.

Critique is one part of that. Running a structured review against my own screens catches what I stop seeing after hours in the same file: inconsistent data, hierarchy that drifts, states I never designed. It does not replace the CPA’s feedback, but it raises the floor before his time gets spent.

Phases

Where it stands

PayRun is a work in progress, tested hands-on with the CPA it’s designed for. It’s scoped in three phases: