UOB TMRW App
Mandatory 12-hour cooling period for fraud prevention
Overview
My Role
Working team
UX Researcher, Lead content writer, Product owner, FBA, Legal & compliance, Fraud prevention & risk mgt, Ops & CX, QA & UAT
Duration
3 Sprints (6 weeks)
Lead UI/UX designer
Working team
UX Researcher, Lead content writer, Product owner, FBA, Legal & compliance, Fraud prevention & risk mgt, Ops & CX, QA & UAT
Duration
3 Sprints (6 weeks)
Platform
Web, iOS & Andriod
Tools used
Figma, Microsoft Teams, Excel
Responsibilities
Market Research, Ideation, UI/UX Design, Hi-fidelity wireframes, Usability Testing
Web, iOS & Andriod
Tools used
Figma, Microsoft Teams, Excel
Responsibilities
Market Research, Ideation, UI/UX Design, Hi-fidelity wireframes, Usability Testing
Overview
With scams becoming increasingly sophisticated, the Singapore Government and banks are strengthening their defences to better safeguard customers against fraud. As part of this effort, a mandatory 12-hour cooling period was introduced for high-risk activities, such as updating contact details, eGIRO set up and increasing card limits.Spanning UOB Personal Internet Banking and the UOB TMRW app, this project focused on translating the regulatory requirement into a clear and reassuring end-to-end experience—from completing a contact detail update to understanding the cooling period and managing temporarily restricted banking activities.
The Goal
Implement a 12-hour cooling period that strengthens scam protection while keeping the experience clear and reassuring.The Challenge
1. Implement the required 12-hour cooling period across multiple banking platforms and journeys while keeping the experience as smooth as possible.2. Customers who expect an immediate update may now need to wait before completing another task. The experience must make clear when the cooling period starts, when it ends, and when their updates take effect, so they can plan around the delay with confidence.
Mapping the Impact
To help visualise and understand how the cooling period would affect interconnected journeys across platforms we mapped out the end to end journey of each flow in a service blueprint. By listing all the activities that happen at each stage, we are able to uncover key dependencies, potential gaps and points of customer confusion that enabled us to create a consistent experience across the entire banking ecosystem.
Impacted journeys:
1. Contact Details update (Mobile, Email, Residential & Mailing Addresses)
2. eGIRO setup & management3. Debit card limit update
Defining the experience principles
Guided by the bank’s commitment to creating experiences that are simple, secure and reassuring, we established six principles to guide our design decisions throughout the cooling-period experience.1. Inform before restricting: Explain the impact before customers confirm an update.
2. Make security understandable: Use clear language instead of regulatory terminology.
3. Provide visibility: Help customers understand when the cooling period starts and ends.
4. Reassure without creating alarm: Communicate protection without increasing anxiety.
5. Design for consistency: Apply common patterns across platforms and affected journeys.
6. Support legitimate urgency: Provide help paths for customers with time-sensitive needs.
Exploring key scenarios and edge cases
1. Contact details update
(A) Fresh update - No ongoing cooling period
⭐ KEY POINT
Explaining the delay before customer proceeds
The bottom drawer brings the 12-hour cooling period into focus just before customers continue. It explains why their mobile number must be correct and when the update will take effect, helping them make an informed decision as to proceed with the update or not.
✅ The bottom drawer component keeps the number they entered visible in the background, so the message stays connected to the task at hand. The drawer gives this decision the attention it needs without breaking the flow.
❌ An inline notice would be easier to miss during entry, while a separate page would take customers away from the number they’re reviewing.
Explaining the delay before customer proceeds
The bottom drawer brings the 12-hour cooling period into focus just before customers continue. It explains why their mobile number must be correct and when the update will take effect, helping them make an informed decision as to proceed with the update or not.
✅ The bottom drawer component keeps the number they entered visible in the background, so the message stays connected to the task at hand. The drawer gives this decision the attention it needs without breaking the flow.
❌ An inline notice would be easier to miss during entry, while a separate page would take customers away from the number they’re reviewing.
⭐ KEY POINT
Reinforcing the timing at confirmation
The review screen puts the new mobile number and the 12-hour cooling period together, so customers can check both before confirming. The highlighted notice reinforces that the update will take effect after the wait, while the separate Confirm action gives them a clear final decision point.
✅ The coloured info box makes the key consequence—switching back to the previous number takes effect immediately—easy to spot beside the number being reviewed.
❌ An inline sentence could blend into the page, while a pop-up would add another interruption before confirmation. The info box keeps the message visible as customers make their final decision.
Reinforcing the timing at confirmation
The review screen puts the new mobile number and the 12-hour cooling period together, so customers can check both before confirming. The highlighted notice reinforces that the update will take effect after the wait, while the separate Confirm action gives them a clear final decision point.
✅ The coloured info box makes the key consequence—switching back to the previous number takes effect immediately—easy to spot beside the number being reviewed.
❌ An inline sentence could blend into the page, while a pop-up would add another interruption before confirmation. The info box keeps the message visible as customers make their final decision.
(B) Multiple contact details update - With ongoing cooling period
⭐ KEY POINT
Explaining the impact of a new change
When customers enter a new mobile number while an update is pending, the notice makes the consequence clear: the new change will replace the earlier request and restart the 12-hour cooling period. It also shows when the current request would take effect, helping customers decide whether to continue or wait.
Explaining the impact of a new change
When customers enter a new mobile number while an update is pending, the notice makes the consequence clear: the new change will replace the earlier request and restart the 12-hour cooling period. It also shows when the current request would take effect, helping customers decide whether to continue or wait.
⭐ KEY POINT
Confirming submission and setting expectations
The Submitted heading confirms that the bank has received the request, without implying the new number is already active.
The screen shows when the update will take effect, reassuring customers that they’ll be notified when it takes effect helps them plan around the wait. The new number, submission time and reference number provide a clear record they can use to track the request or seek support if needed.
✅ Blue supports the Submitted state: the bank has received the request, but the new number is still pending.
❌ Green could suggest that the update is already complete, leading customers to believe their new mobile number is active before the cooling period ends.
Confirming submission and setting expectations
The Submitted heading confirms that the bank has received the request, without implying the new number is already active.
The screen shows when the update will take effect, reassuring customers that they’ll be notified when it takes effect helps them plan around the wait. The new number, submission time and reference number provide a clear record they can use to track the request or seek support if needed.
✅ Blue supports the Submitted state: the bank has received the request, but the new number is still pending.
❌ Green could suggest that the update is already complete, leading customers to believe their new mobile number is active before the cooling period ends.
(C) Revert contact details update - With ongoing cooling period
⭐ KEY POINT
Making the revert exception clear
When customers switch back to their previous mobile number, the bottom drawer explicitly identifies it as a revert and explains that the previous number will become active immediately.
Showing this before they proceed helps them distinguish the revert from a new number change and confirm that it’s what they intend.
Making the revert exception clear
When customers switch back to their previous mobile number, the bottom drawer explicitly identifies it as a revert and explains that the previous number will become active immediately.
Showing this before they proceed helps them distinguish the revert from a new number change and confirm that it’s what they intend.
⭐ KEY POINT
Giving customers a final chance to self-correct
The review screen lets customers check the mobile number they entered and reconsider their decision to switch back to their previous details. The reminder that the change takes effect immediately makes the consequence clear before confirmation, giving them a chance to go back and correct a mistake.
Giving customers a final chance to self-correct
The review screen lets customers check the mobile number they entered and reconsider their decision to switch back to their previous details. The reminder that the change takes effect immediately makes the consequence clear before confirmation, giving them a chance to go back and correct a mistake.
⭐ KEY POINT
Making immediate completion unmistakable
The green Successful state and “Your mobile number was updated” message clearly signal that the switch back to the previous number has taken effect immediately. Showing the updated number, time and reference number gives customers a record of the completed change.
✅ The green screen, checkmark and Successful heading give customers an immediate, familiar signal that the change is complete.
Making immediate completion unmistakable
The green Successful state and “Your mobile number was updated” message clearly signal that the switch back to the previous number has taken effect immediately. Showing the updated number, time and reference number gives customers a record of the completed change.
✅ The green screen, checkmark and Successful heading give customers an immediate, familiar signal that the change is complete.
2. Manage GIRO - Status management 🔐 (Password protected)
Some parts of this project have not yet been released and remain under a client NDA. To respect that confidentiality, this section of the case study is password protected. If you’d like to view the full case study, please email me at hwns.lim@gmail.com for access. Thank you for your understanding.
Learnings & Reflections 💯
Mapping the connected journeys helped me see where a single rule could lead to different customer experiences. A mobile number update might be pending, a return to previous details could take effect immediately, and an eGIRO setup could still be awaiting merchant approval after the cooling period. Each state needed language that accurately reflected what had happened.
I also learned to pay closer attention to the actions customers need while they wait. Making statuses clear was only part of the solution; actions such as cancelling a GIRO arrangement also had to be easy to find. It reinforced a principle I’ll carry forward: when a process becomes more complex, customers need clearer feedback and more visible control.