Designing the digital foundation for HSBC Insurance, from paper-based servicing to a scalable online experience
HSBC Insurance customers had no digital self-service experience. Policy information, coverage details, and account updates were delivered primarily through quarterly paper statements, creating friction for customers and operational inefficiencies for the business.
HSBC aimed to bring insurance products onto both web banking and native mobile platforms as part of a broader digital transformation initiative. The challenge was not only to digitise insurance journeys, but to do so within the constraints of a tightly governed enterprise ecosystem involving multiple stakeholders, approval bodies, and distributed teams.
Research - Phase 1
Identifying the gaps between banking UX patterns and insurance needs
Through UI exploration and close collaboration with UX, several structural limitations became clear within HSBC’s existing ecosystem.
To better understand customer expectations and behaviours, I also participated in two moderated user testing sessions involving 7–8 participants per session. Observing how users navigated policy information, interpreted insurance terminology, and interacted with proposed layouts provided valuable behavioural insights that directly informed subsequent design decisions. The sessions were especially useful in helping the team validate assumptions early and shape an experience that felt more intuitive and appropriate for HSBC’s customers.

HSBC Life Insurance Dashboard / Starting point

HSBC Life Insurance Dashboard / Building blocks
Problem statment
Design response

Designing for scalability through a card-based system
I introduced a modular card-based layout to manage the complexity of insurance information while maintaining clarity across both web and mobile platforms. The structure allowed content to be grouped into digestible sections, improving scanability and navigation for users dealing with dense policy data.
The decision was also driven by long-term scalability. As HSBC Insurance continued expanding its digital capabilities, the card system created a flexible foundation that could accommodate future features, products, and servicing functions without requiring major structural redesigns.

Establishing the foundation for HSBC’s graphical system
Alongside product interface work, I developed a unified illustration, pictogram, and icon style guide to address the absence of a consistent graphical system within the existing library.
What began as a small collection of supporting assets evolved into a scalable graphical standard that other designers could follow and expand upon. The system introduced consistency across illustrations, iconography, and visual communication patterns, eventually becoming the foundation for HSBC’s broader graphical element library used across future digital products and experiences.
Phase 2
Making long-term insurance value easier to understand through data visualisation
Following the initial launch of the HSBC Insurance dashboard, the team continued enhancing the platform with new servicing capabilities. One of the key additions was the Policy Future Value Reprojection feature — a tool that allowed life insurance customers to view projected future values of their policies over time.
The feature became one of the most important areas within the policy servicing experience, helping customers better understand the long-term value of their insurance products rather than simply viewing static policy information.
The enhancement later contributed to the wider product experience that went on to receive industry recognition and award wins for HSBC Life.
Design response

The challenge was translating highly complex financial projections into something customers could actually understand. Insurance projections are often presented as dense tables of numbers with little context, making it difficult for users to interpret policy growth, long-term returns, or surrender values.

To improve comprehension, I designed a data visualisation experience centred around clear graphs, structured information hierarchy, and interactive chart behaviour. Users could explore projected policy values year by year, compare estimated growth over time, and review surrender values through an interface that felt significantly more approachable than traditional insurance statements.
Result
The feature became one of the most important areas within the policy servicing experience, helping customers better understand the long-term value of their insurance products rather than simply viewing static policy information.
The enhancement later contributed to the wider product experience that went on to receive industry recognition through the Asia Insurance Industry Award and the Bloomberg Businessweek Financial Institution Award 2021 for HSBC Life.

© 2026
