Console
May - Jun 2025
Vasutorn K.
Rawisara L.
Product Associate
UX/UI Associate (Me)
Figma, Figjam, Claude
Explored multiple problem-solving approaches for the operations team
Created user flows for end-to-end billing scenarios
Documented and categorized all cases handled by CS and Accounting
Finance staff currently build invoices, write billing emails, and reconcile receipts entirely outside Salary Hero which is a slow, error-prone process that doesn't scale. This feature automates the complete billing cycle: report dispatch, invoice generation via FlowAccount, outbound email, and receipt reconciliation, all within the Report & Billing page. Finance teams can now close billing cycles faster, with no manual data re-entry.
The blue frame in the journey map above shows the current state, where both CS and Accounting still manually prepare and send each client's report and invoice. Client-specific requirements have made full automation difficult.
These are the core problems driving the manual workload for CS and Accounting. By addressing them, we aim to reduce repetitive effort and build a process that scales as we bring on more client companies.
📝
Different Formats
Each client uses a different payroll provider, resulting in inconsistent file formats.
💰
Clients sometimes want to pay a specific amount that differs from the system total, requiring CS to update the report and Accounting to adjust the invoice.
🏢
Child Company Grouping
Some pay cycles must be bundled into a single email because a child company shares the same HR contact as its parent.
The feature will be split into two parts:
Create Workflow/Task (Configuration) - Define how billing runs for a set of companies: which companies and pay cycles map to which report and invoice templates, and who receives the emails. Workflows are reusable.
Workflow Transaction (Runtime) - Once a workflow is set to Active, the system automatically generates one transaction per billing period and moves it through a defined status lifecycle.
CS and Accounting can configure every variable and save templates for future reuse.
User Flow
Prototype
Pros
Full flexibility; no manual adjustments needed outside the console. Everything lives in one place.
Cons
Heavy on dev resources. In practice, most enterprise clients share the same payroll format, so the level of configurability exceeds current needs.
User's Feedback
CS and Accounting can't set up their steps independently. The Accounting team has to wait for the report before starting.
"Save template" is unnecessary since the setup only happens once anyway.
We trimmed the setup process by removing unnecessary complexity. Templates are pre-loaded by the backend, so CS and Accounting can configure workflows with fewer steps and developers have less to build.
User Flow
Prototype
User's Feedback
Noticeably easier for both teams to set up.
Report and billing can now be configured independently, which speeds up the overall process.
Report & Billing → Workflow Setting tab hows a table of workflows with a Create Workflow button. A workflow can be saved as Draft and later becomes Active. Every workflow is split into two tabs: Report and Billing.
1.1 Report tab
Step 1 Select Company
Select one or more companies. Each company has a Pay Cycle selector (or "All").
A company may tick "Include child company", which adds the child company plus its own Child Company's Pay Cycle.
Add Company adds more company rows.
Step 2 Select Report Template
Left panel lists each company / child company with its available pay-cycles (Monthly, Monthly-2, Bimonthly, Bimonthly-2) as checkboxes.
Right panel = one or more Reports. Each Report = a Report Template + an Assigned Pay Cycle set.
This step groups pay-cycles into report templates. + Add Report allows more than one report.
Step 3 Schedule Email
Per-report email recipient configuration: Template + Assigned Report + To / Cc / Bcc lists.
Supports Upload / Download of the email recipient list.
Add Email allows multiple emails per report.
"Schedule Email" configures recipients only it does NOT set a send date/time. The actual send time is computed automatically by the system.
1.2 Billing tab
Step 1 Select Invoice Template
Same grouping concept: group pay-cycles into one or more Invoices. Each Invoice = Invoice Template + Assigned Report + Company Address.
Each invoice may tick "Add SaaS Fee Invoice" to additionally produce a SaaS-fee invoice.
Add Invoice allows more than one invoice.
Step 2 Sending Email
Per-invoice email recipient configuration: Template + Assigned Invoice + To / Cc / Bcc, with Upload / Download and Add Email.
Workflow Transaction tab is a lists transactions. Clicking a row opens Workflow Transaction Details with a 4-step tracker: Sending Report → Sending Invoice → Payment Details → Sending Receipt & Tax Invoice, plus a Workflow tab and an Audit Log tab.
This project has been on the backlog since I joined Salary Hero — nearly four years ago. It's been paused and restarted multiple times as client requirements kept evolving. The more clients we onboard, the more edge cases we uncover. I'm glad we're finally seeing it through. Looking back, there are two things I'd do differently:
List conditions before designing
We initially assumed that maximum configurability would solve everything for CS and Accounting. In reality, the number of actual edge cases was much smaller than we anticipated. Next time, I'd start by sitting down with both teams, mapping out every condition they encounter, and finding the patterns before jumping into solutions.
Surface technical constraints early
Some client requests turned out to be technically infeasible for example, threading follow-up emails as replies to the original even when content had changed. We should have looped in developers sooner so we could communicate limitations to CS and Accounting before expectations were set.