๐Ÿ–ผ
HERO IMAGE โ€” FINAL OVERVIEW PAGE
UOB ยท 2023

Investment Transaction Platform: Redesigning for Multiple Products

Desktop UX Design User Interface
ABOUT

THE CHALLENGE

An internal banking platform built for Unit Trust transactions needed to expand โ€” supporting bonds, structured deposits, structured notes, and insurance. The problem wasn't just adding new product journeys. The platform's core logic, screen structure, and actions were all shaped around how Unit Trusts were transacted. That model didn't scale.

THE PROJECT

A platform-level redesign across seven two-week sprints. The goal was not to make every product behave the same, but to create a system that feels coherent even when product rules differ โ€” with a stronger overview structure, a scalable action hierarchy, and shared patterns that could support future growth.

๐Ÿ–ผ
OLD TRANSACTION MODEL DIAGRAM
Advisory record โ†’ multiple Unit Trust items โ†’ one shared submit action
FRAME THE PROBLEM

The core challenge was scale. The platform had been built around Unit Trust behaviour โ€” from the order structure to the overview page and the action buttons. As new investment products were introduced, those patterns began to break. Three issues became clear.

01
Transaction Model
The order structure was too tightly tied to Unit Trust bulk-order logic. Products that required individual transactions couldn't fit the existing pattern.
02
Overview Navigation
The overview page grouped all order types into one long scrollable screen, making work harder to scan and prioritise as products multiplied.
03
Action Hierarchy
Secondary and utility actions appeared in inconsistent places as journeys grew more complex, making it unclear what the user should do next.
๐Ÿ–ผ
AUDIT FINDINGS โ€” 3-PART VISUAL
Three-panel visual showing each issue with cropped screenshots from the old design underneath
UNDERSTAND REALITY

The project was scoped across seven two-week sprints, beginning with a full audit and assessment of the platform to understand what could scale, what needed redesign, and where the Unit Trust model would fail once more products were introduced.

This early phase focused on two things. First, understanding the impact of the new products with the business team โ€” each product introduced different transaction rules, lifecycle needs, and display requirements. Second, reviewing the existing platform from a system perspective to assess which patterns could be extended, which needed a full redesign, and how a more scalable structure could be introduced without losing familiarity.

These discussions confirmed that the redesign needed to happen at platform level, not only at screen level.

๐Ÿ–ผ
ORDER LIFECYCLE โ€” BEFORE REDESIGN
Original Unit Trust-only order cycle screen โ€” showing how the current flow assumed one grouped order with one final submit action
DESIGN PRINCIPLES

Four principles guided the redesign.

01
Make work easier to scan
Break complexity into clearer sections so users can find relevant work faster.
02
Keep the structure familiar
Use a shared information model across products wherever possible, even when transaction rules differ.
03
Design for expansion
Create patterns that support future products and more complex journeys, not only the current scope.
04
Make the next step obvious
Define a clearer action hierarchy so primary, secondary, and utility actions remain understandable at every stage.
๐Ÿ–ผ
PRINCIPLES STRIP
Simple horizontal visual with the four principles โ€” a visual pause before the design decisions
DESIGN DECISIONS

The redesign focused on three key areas.

01 Rethinking the overview as a workbench
โ–พ

The original overview behaved like a long order feed โ€” all order types in one scrollable page under separate sections. As more product types and order states were added, this became harder to scan and prioritise.

The redesign shifted the page toward a more structured workbench. Work was grouped first by transaction family โ€” Buy or Switch orders, Sell orders, Order instructions โ€” then narrowed further by lifecycle state. This created a stronger navigation model and a clearer mental model for future growth.

๐Ÿ–ผ
EARLY NAVIGATION EXPLORATION
Side-by-side exploration of different navigation mental models before landing on the final structure
๐Ÿ–ผ
FINAL OVERVIEW NAVIGATION
Final overview page with callouts: top-level transaction family, second-level lifecycle state, consistent product grouping
02 Creating a shared structure across products
โ–พ

The redesign did not force all products into one generic table, nor did it split the experience into separate product silos. Instead, it introduced a common structural pattern across product sections, while allowing product-specific fields and transaction details where needed.

This was especially important because some products supported bulk actions while others did not. The interface needed to stay consistent without pretending all products followed the same logic. The shared structure helped the platform feel familiar even as transaction behaviour became more varied.

๐Ÿ–ผ
PRODUCT GROUPING STRUCTURE
Cropped section of the final overview showing multiple product groups under the same work context โ€” shared structure with product-specific variation
03 Building a scalable action system
โ–พ

The action pattern was redesigned to create a clearer hierarchy. The previous design had accumulated tertiary buttons in inconsistent places as more products and states were introduced โ€” making actions harder to scan and weaker in priority.

The redesigned approach separated primary, secondary, and utility actions more explicitly. This made the next step easier to understand and gave the platform a more scalable action model across different lifecycle states.

๐Ÿ–ผ
ACTION HIERARCHY MAPPING
Button and actions mapping showing the logic behind the button system โ€” not only the final UI
VALIDATION & ITERATION

The work developed through repeated iterations across the seven-sprint timeline โ€” briefing sessions with the business team, internal design critiques, regular reviews with the design head, walkthroughs to validate decisions, and check-backs with business stakeholders.

One example of negotiation involved checkboxes and bulk actions. These were originally kept only for Unit Trust, since other products didn't support the same behaviour. Later, they were added back to unify the display logic from a system perspective โ€” agreed after negotiation, particularly after a separate scope intended to change the sell interaction model was dropped.

๐Ÿ–ผ
ITERATION OR CRITIQUE SNAPSHOT
Exploration board, critique screenshot, or mid-fidelity comparison โ€” showing this was an iterative platform redesign, not a one-pass screen update
OUTCOMES & LEARNINGS

The redesign moved the platform away from a Unit Trust-shaped workflow and toward a more scalable investment transaction platform. Instead of extending legacy patterns one product at a time, the work created a stronger foundation for handling more product types and more complex transaction journeys.

The biggest learning was that scaling a banking platform is not only about adding new flows. It also requires redesigning the underlying structure that helps users find work, understand status, and take action with confidence.

It also reinforced that consistency does not mean forcing every product into the same flow. It means building a system that stays coherent while allowing product-specific rules where they are needed.

๐Ÿ–ผ
BEFORE VS AFTER SUMMARY
Before: UT-shaped logic ยท long-scroll overview ยท scattered actions
After: broader product support ยท structured workbench ยท clearer action hierarchy
KEY CONTRIBUTIONS
Project Framing & Ideation
Led the briefing stage and early ideation for the redesign direction.
UI/UX Direction
Defined the experience approach for the platform's most critical scaling areas.
Stakeholder Alignment
Worked with stakeholders and PM to align scope, priorities, and timeline across delivery.
Platform Redesign
Shaped core experience changes across overview navigation, action hierarchy, and scalable design patterns.