Global Banking & Markets

DEER — Front Office Supervisory Tool across desktop and mobile

// THE CONTEXT

A One-Stop-Shop for compliance

Supervisors in HSBC's Global Banking and Markets division operate under intense compliance obligations — monitoring 50+ financial risk controls daily, signing off trades, managing escalations, and producing evidence trails. The problem: all of this happened across a constellation of disconnected tools — Outlook, Excel, internal systems, phone calls, and face-to-face meetings.

We set out to design DEER — a single, auditable platform that unified every supervisory workflow into one interface, making time-critical tasks faster, searchable, and fully evidenced for regulatory compliance.

Global reach: supervisors distributed across DMA sites in London, Hong Kong, New York, Paris, Singapore and beyond

// 01 — KNOWING USERS

Getting close to how supervisors really work

We opened with one-to-one interviews across all the user types — Traders, Supervisors, Sales, and Control Officers — to understand their daily task rhythms: how they handle data, manage supervision responsibilities, route escalations, and resolve trades. London users were interviewed face-to-face; remaining teams were reached via 45-minute tele-conference sessions over several weeks.

This was followed by Contextual Enquiry and User Shadowing sessions to observe behaviours in context — revealing the manual compensations and workarounds that had become embedded in daily practice. Collaborative Workshops brought teams together to surface pain points collectively, and we analysed data quality across source systems to understand what information supervisors could actually rely on.

DEER personas — tailored views for Supervisor, Trader, and COO roles

// 02 — CHALLENGES

Compliance scattered across too many channels

There are 50+ financial risk key controls to monitor daily — each requiring access to multiple systems, data sheets, and communication channels. The overall workflow was scattered across Outlook, Excel, internal applications, phone, and face-to-face meetings, leaving no reliable audit record of supervisory activities. Synthesising research across all user types surfaced six critical problem areas:

Role capability mapping — CEO/COO, Supervisor, and Control Office need areas visualised as radar diagrams

// 03 — IDEATION

Shaping the system together

We ran a cross-functional workshop to present research findings back to the team and align on a shared vision for the application. Product owners, business analysts, project managers, tech representatives, and stakeholders from each business line all contributed — breaking the system down into its core components:

The workshop produced a clear architecture: DEER at the centre, with Report, Inbox, Evidence, Escalate, and Help as the five pillars — each mapped to a specific supervisory need and connected back to the existing data sources and communication channels supervisors were already using.

DEER system architecture — five core modules mapped from the workshop to supervisory workflow needs

// 04 — PROTOTYPING & DESIGN

From workshop to high-fidelity, tested fast

Taking the workshop outcomes, I moved directly into high-fidelity wireframes for each DEER component — visualising the full system before committing to visual design. Each component was prototyped to key user scenarios for each persona and presented back to the wider team for early feedback, surfacing misalignments in scope and priority before they became expensive to fix.

Testing the clickable prototype with users yielded clear direction: supervisors needed an MI summary view for the leadership tier, a clear task hierarchy that matched their mental model of urgency, and global notifications that surfaced cross-business-line activity without overwhelming the interface.

Visual design built on HSBC's existing design system — extending rather than replacing it, to reduce engineering friction and ensure consistency with the broader product ecosystem. I created full visual screens and detailed handover documentation for the offshore development team, and reviewed front-end implementation at the close of each sprint.

Prototype flow — from wireframe iterations to supervisor task hierarchy mapping

DEER final design — supervisory dashboard with live trade data, risk controls, and MI reporting

// OUTCOMES

One platform, many roles, full audit coverage

Working across remote stakeholders and an offshore development team introduced real coordination complexity — but it also sharpened the design rigour. The outcomes of the project gave each role something they didn't have before: