OverviewOverview
Research & DirectionResearch & Direction
Design DecisionsDesign Decisions
DesignDesign
ReflectionReflection

Hang Seng Bank MPF (Pension Fund) Platform

GreenTomato Limited  |  Desktop  |  Fintech

Project Overview
01
The MPF (Pension Fund) Platform Redesign was a desktop fintech project for Hang Seng Bank focused on improving how users understood and managed pension-related information such as account details, and investment activities through a clearer digital experience.

My role was to figure out where the biggest usability gaps were and build a case for addressing them structurally. Working inside a major financial institution meant every design direction had to be grounded in the research and negotiated against business requirements and delivery constraints before it moved forward.
Company
Hang Seng Bank
Tools
Sketch
Roles
UX Research & Strategy,
UI Design
Deliverables
User Journey Maps,
Wireframe,
High-Fidelity UI
The Challenge
02
Create a clearer view of a complex financial picture
MPF is inherently complex: Contribution history, Fund performance, Account balances, and Investment allocations all living in the same platform. Users needed to understand their position at a glance, and the existing design wasn't giving them that.
1
Improve important tasks without oversimplifying them
Key actions like switching investment instructions carry real financial weight. The experience needed to guide users through those tasks with enough structure and context to feel confident,  not just technically functional.
2
Focus the redesign within enterprise constraints
The scope couldn't cover everything, and the timeline was fixed. A big part of the challenge was deciding which problems to solve first and building the rationale to align the team around that priority order.
3
Research into Direction
03
The research covered three angles: Current platform audit, Competitor review, and User survey data. Together they pointed to the same underlying issue: The platform was built around how the data was organised, not how a user actually thinks about their pension. Here's what I found from the research, and the specific direction I chose to address it.
Evaluating the current platform
Users Survey
3 / 10
3 / 10 is the scores of respondents rate the current platform
70%
70% of respondents said they had difficulties in using current platform
46%
46% of respondents said they were able to complete what they came to.
2 / 10
2 / 10 is the scores of respondents think if they will recommend this platform to others
Key Insights and Solutions
Users had no single view of their pension position.
Account balance, fund performance, and contribution history were all on separate pages with no single view that tied them together. Users who wanted to understand their pension position had to visit three or four places and do the mental arithmetic themselves, a significant ask for something people check infrequently and already find stressful.

Rather than fixing navigation or adding shortcuts, I decided the root problem was the overview page itself. The fix was structural: bring balance, performance, asset distribution, and contributions together at the top level, with detail available a click away.
High-stakes actions had no structure to support them
Changing investment instructions is a high-stakes action, it affects how a user's retirement savings are allocated. The existing flow treated it like a basic form fill, with no summary of what was changing and no confirmation of what had been submitted.

I prioritised rebuilding these flows with a clear stepped layout: select, review, confirm. Each step needed to show users exactly what they were changing before they committed for a decision with real financial consequences, that level of clarity isn't optional.
The platform needed to work for the returning user, not just first use
MPF isn't a product people use once and forget. Users come back to check statements, review returns, and track contributions across years. But the history and records sections were hard to navigate across visits. Inconsistent layouts, weak filter controls, no sense of continuity between screens.

I shaped the redesign around that repeat-use pattern: contribution history, e-statements, returns, and projections all needed consistent structure and reliable navigation, not just a visual tidy-up.
Design Decisions
04
Two directions we explored didn't survive contact with technical and stakeholder constraints, but both shaped the final design in different ways.
The dashboard we didn't build
Early on, we explored a customisable widget dashboard for the overview page. The kind where users can add, remove, and rearrange panels to suit how they track their pension. It was the more modern approach and had real usability appeal for a product where different users care about different things.

It didn't move forward. Engineering flagged the technical complexity, and the PM raised a valid concern: Hang Seng's broader digital banking platform already had a dashboard feature, and introducing a second customisable layout in a related product risked inconsistency across the experience. Both were legitimate reasons. We stepped back from the widget model and refocused on a structured overview that surfaced the most universally important information: Balance, Performance, Contributions in a fixed but well-prioritised layout.
The slider input we fought for
The Asset Switch flow required users to allocate percentages across different funds. The original approach was a standard text input: Type a number, tab to the next field, repeat. It worked, but it made it hard to visualise the distribution or quickly test different allocations without manually editing multiple fields.

We proposed a slider input instead: drag to adjust each fund's percentage, with the total updating in real time. It was a more intuitive way to interact with a complex distribution problem. Engineering pushed back as the implementation was more involved than a text field and they had timeline concerns.

Rather than dropping it, we built interactive prototypes of both approaches and ran them past the engineering team directly. Seeing the slider in practice, how much faster it was to adjust and compare allocations changed the conversation. They agreed to build it. It ended up being one of the most distinct interaction decisions in the final design, and the one most directly tied to how users actually think about investment distribution.
Final Design
05
The final designs addressed the three priority areas directly. The account overview was restructured to bring the most important numbers together in one place. The key action flows were rebuilt with clearer step progression. And the history and records sections were reworked to support the way users actually return to and use the platform over time.
Account overview and performance visibility
The MPF Overview page was rebuilt around a single goal: let users understand their pension position without having to navigate away from the first screen they land on. Account balance, fund performance, asset distribution, and employer/employee contributions are all surfaced at the top level, with detailed breakdowns available a scroll or click away.
MPF Overview
Fund Performance
Account Returns and Projection
Investment instruction and account management flows
The investment instruction flow particularly Asset Switch was redesigned with a stepped layout that breaks the process into clear stages: select, review, confirm. Each step shows users exactly what they're changing and what the outcome will be before they commit. For a decision with real financial consequences, that level of clarity isn't optional.
Change Investment Instructions
Account Details
History, records, and long-term self-service
Contribution history, e-statements, account returns, and projections were all present in the old platform but hard to navigate across. The redesign gave each section a cleaner table layout, better filter controls, and consistent structure so users can move between them without having to relearn the interface each time. These are the screens users come back for, they needed to work reliably, not just look tidy.
Contribution / Transaction History
MPF e-Statement / Advice
Reflection
07
MPF is the kind of product nobody really wants to think about — it's long-term, complex, and the consequences of getting it wrong are delayed and invisible. That context shaped a lot of the design thinking. Making something feel manageable and trustworthy matters differently when the stakes are someone's retirement savings vs. a shopping app.

The biggest challenge wasn't the interface — it was scope. There was more to fix than we had time to fix, and a lot of my energy went into making the prioritization visible: showing stakeholders what we were solving, why in that order, and what we were deliberately leaving for a later phase. That kind of upfront alignment work saved a lot of rework later.
Back to Home