01Introduction

Designing a counter offer feature for loan customers

Counter Offer lets Tonik offer a different loan amount or terms, instead of only approving or rejecting. I was the only designer, working with a UX writer. The head of design reviewed my work.

Loans
UX design
Flow mapping

The higher offer screen in the Tonik app, "You're approved to get even more!", with two amount cards to choose from

The problem

Once customers applied for a loan, they either got the exact amount they applied for or got rejected. There was no flexibility in approving loans.

This missed two groups:

Customers who qualified for less got nothing.
Customers who qualified for more only got what they asked for.

The old Loan Status screen with a plain rejection card.

The old approval screen, 'Woo! You got approved', showing the same amount the customer applied for.

What made it complex

With the counter offer feature, Tonik can now offer a lower amount to partially qualified customers and a higher amount to overqualified customers. Risk, credit, and product set the rules:

What Tonik offers at each qualification level
Qualification level	Commercial response
Unqualified	Plain rejectionClose the path clearly.
Partially qualified	Offer a lower amount or same amount with new term or rateKeep terms viable while reducing exposure.
Qualified	Same amount, term, and ratePresent the same approved offer.
Overqualified	Offer a higher amountInvite an upgrade without creating pressure.

With the PayHinga choice carried over from the application, that is about 10 paths.

Offer paths from the Loan Status tile to the loan summary. Rejected: 'We cannot extend a loan to you at this time' loan card. Lower amount: 'Hooray!' screen, then accept or decline. Same amount with a new term or rate: 'Hooray!' screen, then accept or decline. Same amount: 'Woo! You got approved' screen, then accept. Higher amount: 'Woohoo!' screen, then 'Just for you' with a slider or keypad, or 'You applied for', which goes straight to pay dates. — I mapped every path before designing screens.

Designing the offer screens

The offer screens reuse the loan calculator from the application, so customers can compare the offer with what they asked for. The UX writer wrote the copy.

The lower and same amount (new term or rate) offers

Lower amount offers and same amount offers (new term or rate) use one layout. Only the amount, term, and monthly payment change.

The lower amount offer screen, 'Hooray, you made it! Check the loan details', with notes: good news first, what they applied for, the new offer, and what they can unlock next.

The headline leads with good news. It is still a loan they can take.
“Tailored for your profile” explains the change without revealing the scoring.
Showing what they applied for makes the change easy to see.
The tip tells them that paying on time can unlock higher loan offers.

The higher offer

Two cards let customers choose between the higher offer and what they applied for.

Two higher offer screens. Left: the default, 'Just for you', with a slider. Right: 'You applied for' selected, for customers who want to keep their applied amount.

Decision and trade-off

The business wanted to show only the higher amount, in a large size.

I pushed back. Many customers would still want what they applied for, and might miss it or borrow more than they need. So I made both amounts equal cards.

Close-up of the two amount cards, 'You applied for ₱20,000.00' and 'Just for you ₱50,000.00', the same size and weight. 'Just for you' is selected by default.

We agreed to select “Just for you” by default.

What I learned

What the design did well

One layout for lower and same amount offers meant fewer screens to build.
A lower offer can feel like progress instead of rejection.

What I would do next

I would test:

Do customers notice they can keep their applied amount?
Does the default push them to borrow more than they need?