Procurement.
Made mobile.

Company spending, purchase orders and invoice decisions. A mobile interface that keeps the context beside the action, with tablet layouts and a dark theme.

Explore the app

SPEND → REVIEW → APPROVEMobile & tablet

The product: Company purchasing
Orders, invoices & document capture
Our scope: Mobile app UX/UI
Tablet layouts & dark theme
Project contact: Tung Chan

EXPLORE THE DESIGN

From spending to the next decision.

Explore the mobile dashboard, order and invoice review, document capture, dark theme and tablet layouts.

Mobile dashboard — monthly spend, approval chart and purchase-order states

Invoice review — supplier, amount, payment status and approval actions

Purchase-order review — approval, invoice and delivery states with supplier context

Mobile dashboard — monthly spend, approval chart and purchase-order states

01 / 08

Choose a preview or use the arrows. Open a screen for the complete layout.

01PROCUREMENT APP UX/UI

Put the decision beside the purchasing context.

A procurement app needs more than a list of amounts. We designed order and invoice interfaces that group supplier details, status and the review action. The purchase-order view distinguishes approval, invoice receipt and delivery rather than collapsing them into one generic state.

Invoice records use status tabs and search to narrow the list. Each card keeps its reference, amount and approval actions together; the detail view adds supplier and payment context. Orange primary actions remain visually distinct from the surrounding blue navigation.

Invoice list — status tabs, search, amounts and approve or reject actions — Invoice records with clear decision actions

02TABLET & DARK-THEME DESIGN

The same purchasing system, in a different context.

The mobile dashboard starts with spending and a summary of purchase-order states. On a tablet, the wider canvas accommodates budget summaries and department charts alongside the main overview, with shared navigation and a consistent card hierarchy.

The dark theme preserves those same relationships rather than introducing a different product. Blue navigation, an orange approval chart and colour-coded order states carry across both themes. Our UX/UI scope covers the mobile workflows and their tablet adaptations.

Tablet dashboard — spending, order states, budgets and department charts — Budget and department reporting on tablet

Dark theme — the same spending hierarchy and colour-coded order states — A consistent hierarchy in the dark theme

MOBILE APPS & BUSINESS TOOLS

Complex workflows.
Clear interfaces.

Planning a business app or improving a purchasing workflow? Tell us who uses it and which decisions matter. We’ll suggest a scope and estimate.

Get a project estimate Explore the design in Figma

From spending to the next decision.

Put the decision beside the purchasing context.

The same purchasing system, in a different context.

Complex workflows.Clear interfaces.

Complex workflows.
Clear interfaces.