GoPay: Fintech Billing and Payments App Design by Hamza JilaniGoPay: Fintech Billing and Payments App Design by Hamza Jilani

GoPay: Fintech Billing and Payments App Design

Hamza Jilani

Hamza Jilani

GoPay brings recurring bills, e-invoices, payments, and wallet activity into one mobile product. The design challenge was to make dense financial information understandable without slowing down the tasks people came to finish.
I mapped the main journeys around account setup, bill discovery, payment, transaction history, receipts, card management, notifications, and security. The interface uses progressive disclosure so users see the amount, status, and next action first, with invoice detail available when they need it.
The final design includes a reusable component system, light and dark visual modes, searchable invoices, biller profiles, and clear payment states. I produced the product flows, wireframes, high-fidelity UI, Figma prototype, and developer-ready handoff.
See the full case study: https://plexable.com/cases/gopay
Payments can be searched and filtered by status or biller before opening the full record.
Payments can be searched and filtered by status or biller before opening the full record.
A short onboarding screen leads into password creation with the rules visible as the user types.
A short onboarding screen leads into password creation with the rules visible as the user types.
Home prioritizes invoice exposure. The notification view separates payment requests, receipts, and security updates.
Home prioritizes invoice exposure. The notification view separates payment requests, receipts, and security updates.
After payment, the receipt appears immediately. Biller details can be reviewed or edited from the same flow.
After payment, the receipt appears immediately. Biller details can be reviewed or edited from the same flow.
The six-digit passcode screen strips account access down to one clear action.
The six-digit passcode screen strips account access down to one clear action.
The light theme preserves the dashboard and biller hierarchy without changing how the product works.
The light theme preserves the dashboard and biller hierarchy without changing how the product works.
Each biller profile shows the balance, paid amount, amount due, and individual payment requests.
Each biller profile shows the balance, paid amount, amount due, and individual payment requests.
Invoice-number search and filters make long payment histories easier to scan.
Invoice-number search and filters make long payment histories easier to scan.
The More screen groups payment methods, settings, support, and the business e-invoicing route.
The More screen groups payment methods, settings, support, and the business e-invoicing route.
Saved cards identify the primary payment method and provide a direct path to add another.
Saved cards identify the primary payment method and provide a direct path to add another.
Notifications are grouped by day, with payment requests, receipts, account changes, and security updates easy to distinguish.
Notifications are grouped by day, with payment requests, receipts, account changes, and security updates easy to distinguish.
A wider view of the final system: card capture, dashboard, notifications, biller details, receipts, and payment methods.
A wider view of the final system: card capture, dashboard, notifications, biller details, receipts, and payment methods.
Like this project

Posted Aug 31, 2026

UX/UI design for a mobile-first billing product covering account setup, invoices, transactions, wallet activity, and payment flows.