HSBC

World Class Onboarding

HSBC World Class Onboarding mobile app screens
Project Overview

WCO is HSBC's flagship mobile onboarding initiative aimed at helping users open accounts quickly, securely, and seamlessly within a few minutes. I led the UX for multiple countries and created a detailed design blueprint across the program.

The Challenge

The project needed to serve two different user types (ATB — Already to Bank, and NTB — New to Bank), meet different market regulations, and still feel like one cohesive HSBC experience.

Using Lean UX and Design Thinking, we embarked on a fast-paced, cross-functional collaborative effort, while building a foundation that scaled across future rollouts.

My Role
  1. 01

    Designed end-to-end UX for KYB & CIB segments

  2. 02

    Designed end-to-end flows and created user flows

  3. 03

    Led design thinking workshops and cross-functional reviews

  4. 04

    Collaborated with BAs, researchers, and developers

  5. 05

    Conducted and analysed user testing in partnership with the research team

  6. 06

    Delivered polished, annotated designs ready for implementation

Global Blueprint

Used Figma and flexible user journeys, achieved the States of Blueprint, enabling fast adaptation in different geographies.

Live in Countries

The World Class Onboarding (WCO) currently rolls out across key markets including the Philippines, UK, Australia, and Mexico with digital journeys on mobile. Our approach was performance-focused with clear user feedback loops, digital simulation, and deep success through simplified onboarding flows.

PhilippinesUKAustraliaMexico
New Pattern Request

Search / Input Field

Problem Statement

The Search/Input field component is a combination of the Search and Input Field that allows the user to search from the registry or enter the value manually, or enter any other input manually. This was a new time-saving component that reduces the steps to complete the order in a given scenario. The proposed component covered both search & input field that could make the experience quick and easy for users.

Use Case

The Search/Input field component is a combination of the Search and Input Field that allows the user to search from the registry or enter the value and enter the input manually. The uses meet specific market requirements.

States Documented

StateDescription
Default stateDefault state; defined as when input is cleared
Active state: typingActive state: defined as when input is cleared
Complete state
Error state

Documented Variants

  • Drop-downs / Input fields
  • Input Fields with Character Counter
  • Combination of With & Without Counter
Outcomes & Impacts

Key Wins

June 2023

WCO Gibraltar: market launched

2023

WCO Egypt: launched

2023

WCO Philippines: launched — fast launch; increasing reach

July 2023

WCO UAE: market-launched

Upcoming Projects

  • WCO Egypt (continues to live to bank)
  • WCO Philippines (continuing to team)
  • WCO Wallpaper (bios on brand)
  • WCO UK (upcoming goals to launch)