Redefining Digital Banking in Sri Lanka
Crafting a seamless end-to-end user experience for one of Sri Lanka’s top financial institutions’ online banking portal.
“Won the award of Best Digital & Customer Experience in 2024”
To comply with my non-disclosure agreement, I have omitted and obfuscated information in this case study.
Their online banking platform is split into two parts: Personal Banking and Corporate Banking. Both were long overdue for a complete redesign.
The bank chose to first focus on the Personal Banking portal, which suffered from outdated UX patterns, poor information architecture, and an inconsistent visual language.
Prior to this, HNB had adopted a mobile-first strategy and launched a redesigned mobile banking app.
I was part of the core team working closely with the Head of Design to bring that app to life, and it received overwhelmingly positive feedback.
Following that success, the leadership team decided to extend the same high standards and features to the web experience.
This case study focuses on the implementation of the Virtual Wallet feature, arguably the most impactful update to the app since its launch.
This release introduced a major redesign of the onboarding experience and homepage, both of which were critical to supporting the new wallet functionality and improving overall usability.
Having worked closely with HNB’s former Head of Design on both the mobile banking app and the SOLO app, I was trusted to lead this new initiative.
Although this was my first time designing for a large-scale web banking platform (after mainly working on mobile fintech apps), I was excited by the challenge.
By then, I had already worked on three major fintech products and felt confident in my structured, user-first approach.
I was the Senior UX Designer, responsible for redesigning the entire end-to-end personal online banking experience from UX research and journey mapping to UI design, stakeholder presentations, and design QA.
This meant working closely not just with our internal team, but also staying in constant communication with key stakeholders on the bank’s side to ensure alignment every step of the way.
While the workflows of retail and commercial customers vary significantly, their goals remained the same: to seamlessly manage finances, access essential features easily, and onboard with minimal friction.
For the bank, the objective was to initiate a positive, long-term relationship with users, maximise product adoption, and streamline operations through automation.
“Customer experience in the financial sector still trails behind many other industries, highlighting a huge opportunity to improve the foundational systems that support it.”
Customer Obsessed
Speed with Purpose
Think Beyond Banking
Data Driven
Built on trust & security
Maintaining constant communication with project managers on both the internal and banking side was essential to stay aligned on scope, timelines, and evolving priorities.
We created a list of “How might we…” questions to align the team around user and business needs.
How might we create a consistent, unified experience across web and mobile platforms?
How might we design flexible UI components that can accommodate future feature rollouts without disrupting the experience?
How might we provide an experience that is engaging and valuable to our customers?
We reviewed four direct competitors in the banking sector to benchmark their online banking platforms. Key takeaways:
- Most offered basic features like fund transfers, bill payments, and account summaries but lacked modern UX and good responsive design.
- One competitor stood out in usability, based on online reviews and customer feedback.
- A few allowed users to generate downloadable receipts and PDFs from transaction history, a valued but often missing feature.
- There was little consistency between mobile and web platforms, creating a disjointed omnichannel experience.
These findings reinforced the need for HNB’s online portal to deliver a seamless, user-friendly experience that matched the mobile app’s success.
Workshop mapping usability pain points by task criticality, user impact, and frequency, used to inform phased releases.
To make strategic decisions on what features to release first, I relied on a data-driven approach know as the severity framework to guide prioritisation based on actual user pain points and business value. However, these release phases was not solely depended on this framework, it included more input from banking side stake holders, development team and business goals.
Severity = Task Criticality × Impact × Frequency
- Task Criticality – How essential is the task to the user? (1 = low importance, 5 = mission critical)
- Impact – How much does the issue affect the user’s ability to complete the task? (1 = minor suggestion, 5 = complete blocker)
- Frequency (%) – How often does the issue occur across users or sessions?
In majority of companies/teams, the flow looks something like this
In majority of companies/teams, the flow looks something like this
With multiple teams involved from developers and QAs to stakeholders on the bank’s side, I learned how vital it is to keep communication open and simple. Regular catch-ups helped us avoid misunderstandings and stay aligned, even during fast-moving sprints.
It’s easy to get caught up in creating the “perfect” design, but I was constantly reminded that great UX needs to work within business constraints. I had to balance user needs with what was technically and commercially viable, which helped me grow stronger as a product thinker.
The scope was massive, but we had to phase the rollout. This taught me how to think modularly and planning a scalable experience that worked now but could grow later.
Because many APIs were reused from the mobile app, I had to work closely with developers to understand what was feasible. This helped me design flows that were easier to build while still delivering a great user experience.
By aligning the web and mobile journeys, we made the experience feel familiar and easy to use. This gave users more confidence and reduced friction.
As a proud moment for the entire team, the redesigned personal online banking experience played a key role in HNB winning the Best Digital & Customer Experience Award in 2024, recognising the impact of thoughtful design at scale.
