HSBC
Global Websites
Creating a scalable web experience for a multinational brand
Research & strategy
Global sitemap & user journeys
Design & testing
Documentation
Market localisation
Background
HSBC websites across the world lacked consistency in terms of branding and site architecture. New pages were typically created ad-hoc with no regard to how it fit within the wider user journey or HSBC design standards.
Task
Design and deliver a set of global journeys and page templates to be adapted by HSBC markets around the world.
Research & strategy
We started by conducting stakeholder interviews and workshops with HSBC’s key markets (UK, Hong Kong, USA, Mexico and Australia) to gather business requirements and learn about their different product strategies and priorities.
With support from the SEO and Data teams, I performed a heuristic evaluation of key market websites, focusing specifically on site architecture, UX and content. I also audited the websites of our best-in class competitors.
Global sitemap & user journeys
Based on our learnings, I was able to create a global sitemap which:
streamlined the number of web pages without sacrificing SEO
was flexible enough to be scaled across multiple markets
ensured consistency across different product lines
Each product line contained its own global journey and a set of page templates which could be localised based on market requirements.
Design & testing
Each template went through several rounds of wireframing. I worked closely with our copywriters and made sure to include input from Ad Control and Legal & Compliance.
The wireframes were reviewed in an agile environment and received feedback from cross-functional teams, including:
my peers from Design
Product
Data and SEO
Market stakeholders
High-impact page templates, such as landing pages and product detail pages, underwent usability testing as well as A/B testing. Tests were conducted by the Research and Optimisation teams, with support from Design.
Only winning designs became part of the new templates. Designs which performed poorly were reviewed, reevaluated and went back into the wireframe stage.
Documentation
Once the journeys and pages were validated, the Design team and I worked with technical producers to create a library of entity-driven global patterns.
I prepared detailed UX documentation and localisation guidelines for each template and journey to be used by copywriters and delivery managers for market rollout.
Market localisation
I provided design support and QA during the market rollout phase, as well as updated and refined the documentation based on suggestions from the Delivery team.
As of February 2023, two markets (Expat and UAE) have completed localisation. Five more (US, Canada, India, UK and Hong Kong) are in the process of adapting the new templates.
