Designing the interaction model behind a portfolio-building and fund-switching tool for HSBC's private banking

Proof of concept, later handed off to HSBC's in-house digital team."

HSBC Private Wealth Management's RM tool is used by Relationship Managers to build, review, and rebalance investment portfolios on behalf of private banking clients, spanning everything from selecting a model portfolio to swapping individual funds within an existing allocation.

The platform needed to hold an unusual amount of financial complexity: risk levels, asset allocation, volatility, fund-level detail, model portfolios, inside a single continuous flow, without turning every screen into a wall of numbers for the RM to decode in front of a client.

Beyond the UI, the real challenge was interaction design: how do you let an RM construct and compare a multi-fund portfolio, move between "as-is" and "target" states, and swap funds mid-flow, without ever losing the thread, all inside HSBC's strict global design system.

Client / Project

HSBC / Private wealth management tool

Client / Project

HSBC / Private wealth management tool

Platform

Web

Platform

Web

Role

UI / UX

Role

UI / UX

Year / Duration

2024 / 5 months

Year / Duration

2024 / 5 months

Process

Mastering interaction, not just interface, for a high-complexity system

Working alongside a second UX/UI designer, a Creative Director, and stakeholders, my contribution centred less on discovery research and more on how the interface should behave: sequencing the steps an RM takes to build a portfolio, defining what state the screen holds at each point, and deciding how dense financial data should reveal itself without overwhelming the moment.

That meant repeatedly testing the logic of the tool against HSBC's UX principles and compliance constraints, then refining the prototype through successive rounds of stakeholder feedback, with usability, not novelty, as the measure of success throughout.

Compare as you go . Never lose the starting point

Auto-rebalance, manual, or model-based. Same portfolio, three ways to get there

Problem statment

RMs needed one tool that could do several structurally different things without feeling like several different tools: start a portfolio from a model or from scratch, edit a target allocation against a client's current holdings, switch and compare individual funds within an asset class, and see the risk and volatility consequence of every change in real time, all built on a component library that wasn't originally designed for this level of interactive depth.

RMs needed one tool that could do several structurally different things without feeling like several different tools: start a portfolio from a model or from scratch, edit a target allocation against a client's current holdings, switch and compare individual funds within an asset class, and see the risk and volatility consequence of every change in real time, all built on a component library that wasn't originally designed for this level of interactive depth.

RMs needed one tool that could do several structurally different things without feeling like several different tools: start a portfolio from a model or from scratch, edit a target allocation against a client's current holdings, switch and compare individual funds within an asset class, and see the risk and volatility consequence of every change in real time, all built on a component library that wasn't originally designed for this level of interactive depth.

Design response

Every change, right when it happens

As soon as an RM finalises portfolio changes, the customer gets a push notification or an alert message. One tap brings them to a detailed view of what's changed, where they can approve the update or book time with their RM to talk it through.

Every change, right when it happens

As soon as an RM finalises portfolio changes, the customer gets a push notification or an alert message. One tap brings them to a detailed view of what's changed, where they can approve the update or book time with their RM to talk it through.

Every change, right when it happens

As soon as an RM finalises portfolio changes, the customer gets a push notification or an alert message. One tap brings them to a detailed view of what's changed, where they can approve the update or book time with their RM to talk it through.

Reference and target, comparison built into the flow

When building a new portfolio, the RM starts from a Reference portfolio, a suggested allocation based on the client's risk profile that offers an easy starting point rather than a blank canvas. As soon as the RM begins adjusting that allocation, a Target portfolio is created, letting them compare what they are building against what was originally suggested at every step of the process.

Reference and target, comparison built into the flow

When building a new portfolio, the RM starts from a Reference portfolio, a suggested allocation based on the client's risk profile that offers an easy starting point rather than a blank canvas. As soon as the RM begins adjusting that allocation, a Target portfolio is created, letting them compare what they are building against what was originally suggested at every step of the process.

Reference and target, comparison built into the flow

When building a new portfolio, the RM starts from a Reference portfolio, a suggested allocation based on the client's risk profile that offers an easy starting point rather than a blank canvas. As soon as the RM begins adjusting that allocation, a Target portfolio is created, letting them compare what they are building against what was originally suggested at every step of the process.

A warning system that keeps risk visible

If an adjustment to the fund selection or allocation pushes the target portfolio past the client's risk tolerance score, the RM is warned immediately, keeping the consequence of a choice visible at the moment it is made rather than after the fact.

A warning system that keeps risk visible

If an adjustment to the fund selection or allocation pushes the target portfolio past the client's risk tolerance score, the RM is warned immediately, keeping the consequence of a choice visible at the moment it is made rather than after the fact.

A warning system that keeps risk visible

If an adjustment to the fund selection or allocation pushes the target portfolio past the client's risk tolerance score, the RM is warned immediately, keeping the consequence of a choice visible at the moment it is made rather than after the fact.

© 2026