Back

Simplifying Monthly Fee Collection

A mobile collection experience that helps property owners and on-site collectors find units, create invoices, and confirm cashless payments.

Project
Bayarin
Category
Product UI/UX
Role
Product design
Year
2025
Bayarin screens showing login, collector home, unit search, a monthly fee invoice, and a payment receipt.
Overview: login, home, unit search, invoice, and receipt.

The challenge

Monthly maintenance fees (IPL) were mostly collected in cash. Property owners, building managers, and on-site collectors had to keep track of payments manually, write receipts, and handle change. I designed Bayarin's mobile experience to turn that work into a clear digital flow, from finding a tenant's unit to creating an invoice and confirming payment.

Design decisions

01

Give collectors three ways to find a unit

I mapped the collection journey in wireframes before moving into the interface. After logging in, collectors can scan a QR code at the unit, search by location, or enter a tenant code to create an invoice. The alternatives keep a missing or damaged QR code from becoming a dead end.

Three ways to find a tenant unit in Bayarin: scan a QR code, search by location, or enter a tenant code.
Unit lookup: create invoice, QR scan, location search, and tenant code.
02

Make the interface easy to use on the move

Collectors often work outdoors and on foot, sometimes with limited signal. I used large buttons, clean layouts, and readable text so the next action is easy to find. The payment screen also needed to feel clear and reassuring for tenants who are less familiar with apps.

Bayarin collector home and invoice screen with readable payment details and a prominent action button.
Interface detail: collector home and the invoice with payment methods.
03

Close the payment with a useful receipt

Tenants have different payment preferences, so the app presents the available methods clearly, including mobile banking and e-wallets. Collectors can choose the tenant's preferred option. After payment, a receipt appears that can be shown on-screen, printed, or shared, giving both sides a clear record of the transaction.

Bayarin payment method selection, virtual account details, payment confirmation, and receipt with print and share actions.
Payment completion: method, virtual account, confirmation, and receipt.

The result

The design brings unit lookup, invoicing, payment options, and receipts into one mobile collection journey. It replaces the notebook-and-cash workflow with a more organized way to collect monthly fees. Future improvements identified for Bayarin include an offline mode, more language support, and better performance.

More work