FatemehBack to work

Getting people their money back

UX and UIRole PWA · web and mobilePlatform 2024Timeline Employees, finance teams, adminsUsers
Kharjineh expense review on the web

The problem

People pay for work out of their own pocket. A taxi, a meal, a small purchase. Then they wait.

Kharjineh is a B2B platform for company expenses. Employees record what they spent, finance reviews it, and reimbursement happens on a clear track instead of a chain of messages and receipts handed over in person.

This is not a personal budgeting app, and designing it as one would have been the easy mistake. Nobody using this wants to reflect on their spending habits. They want a request to move.

One expense, several hands

An expense rarely goes from request to payment in one step. It gets approved, questioned, referred to someone else, commented on, approved again. The screen has to answer two things at once: what happened so far, and what I can do about it now.

So the review splits in two. The left side is the decision — refer it to a colleague, write a note, approve or reject. The right side is the history, in order, with a name and a time against every step. Nobody has to ask where a request is stuck.

Expense review on mobile
The same request on a phone, history first.
Approve, reject or refer sheet
The decision arrives as a sheet, so the request stays behind it.

Built as a PWA

Finance works at a desk; the person who paid for the taxi does not. Kharjineh runs as a PWA so the same request is workable from either, and neither is a cut-down version of the other.

The dense views — long tables, filters, bulk actions — keep their shape on the web and become cards on a phone, with the same fields in the same order so nothing has to be relearned.

Company list on the web
On the web: a table, with filters and inline actions.
The same list on mobile
On a phone: the same record as a card, same fields, same order.

Support inside the product

When money is involved, questions are not an edge case. Ticketing sits inside the platform with its own states — open, in progress, waiting on the customer, closed — and the same filtering and search patterns used everywhere else, so nothing new has to be learned to ask for help.

Ticket list with status filters

Saying it plainly

The marketing site had to make the same promise in one screen: stop paying out of your own pocket and waiting. The copy speaks to the employee, the illustrations stay light, and the claims are concrete — approvals in a few clicks, transparent settlement, no chasing anyone.

Kharjineh landing page
The marketing site on the web.

The same page had to hold together on a phone, where the promise arrives one block at a time and the pricing has to stay comparable in a single column. Plans are tiered, and a slider lets a company build its own when none of the tiers fit.

The marketing site on mobile
Mobile — scroll inside to see the full page.
Pricing plans with a custom plan builder
Four tiers, then sliders for users and documents when none of them fit.

What I took from it

The interface people spend the most time in is not the one you show in a pitch. Nobody enjoys an expense tool; they want the request to move, and to know where it is when it doesn’t.

Most of the design work went into state and accountability rather than screens — who is holding this now, what have they done, what can I do next. Once that was clear, the layout mostly followed.

A good B2B tool doesn’t ask for attention. It gives the answer and gets out of the way.