TLDR | Project Overview:
A launch-ready messaging system for wire payment workflows
0→1 Design | Fintech Platform | Embedded Messaging | Workflow Acceleration | MVP Launch
A launch-ready messaging system for wire payment workflows
0→1 Design | Fintech Platform | Embedded Messaging | Workflow Acceleration | MVP Launch
The problem
Bank staff lacked a reliable way to communicate inside the wire transfer system.
To compensate, staff sent $0.00 transactions — or even copied responses from sticky notes and documents.
To compensate, staff sent $0.00 transactions — or even copied responses from sticky notes and documents.
What looked like a small messaging gap exposed a larger workflow breakdown.
Communication was fragmented, manual, and disconnected from regulated decision paths.
Communication was fragmented, manual, and disconnected from regulated decision paths.
Time + Team
Timeline: 2-week sprint cycle
Breakdown: 1 day interviews • 1 day usability testing
UX Design & Research Lead (me) • Product Manager • Engineering (design-dev pairing)
Timeline: 2-week sprint cycle
Breakdown: 1 day interviews • 1 day usability testing
UX Design & Research Lead (me) • Product Manager • Engineering (design-dev pairing)
My role
I was the sole UX designer for this initiative.
I owned the UX foundation for PortX’s first live Payment Manager module (Wires), a 0-to-1 experience that informed broader platform standards.
I was the sole UX designer for this initiative.
I owned the UX foundation for PortX’s first live Payment Manager module (Wires), a 0-to-1 experience that informed broader platform standards.
What I learned
Questioning and observing real behavior changed the direction of the work.
Staff were not just missing messaging. They were compensating for missing tools.
Questioning and observing real behavior changed the direction of the work.
Staff were not just missing messaging. They were compensating for missing tools.
The biggest opportunity was not replacing memos.
It was reducing context switching and repeated manual effort during wire approvals and exceptions.
It was reducing context switching and repeated manual effort during wire approvals and exceptions.
My approach
I designed a two-layer system:
I designed a two-layer system:
▶ A foundational embedded messaging tool to replace $0.00 transaction notes
▶ QuickNotes, a pre-filled response layer surfaced directly inside the messaging interface
▶ QuickNotes, a pre-filled response layer surfaced directly inside the messaging interface
Both were embedded at the moment of decision, not added as side tools.
The work prioritized speed, consistency, and traceability without expanding scope.
The work prioritized speed, consistency, and traceability without expanding scope.
Why it matters
This work shows how small features can unlock large gains when real workflows are understood.
It demonstrates product judgment, mid-sprint course correction, and designing for how work actually happens.
This work shows how small features can unlock large gains when real workflows are understood.
It demonstrates product judgment, mid-sprint course correction, and designing for how work actually happens.
Core question
How can close observation turn a simple fix into a high-impact workflow improvement without slowing delivery?
How can close observation turn a simple fix into a high-impact workflow improvement without slowing delivery?
q Read the full story to see how it all came together. q
Intro / Background:
When a small internal tool becomes a critical workflow
When a small internal tool becomes a critical workflow
PortX Cloud’s Payment Manager was an early-stage platform with wires, checks, ACH, FedNow, RTP, and SWIFT planned as modules.
I was responsible for the first live module (Wires) — a 0-to-1 experience that would define UX patterns for all future payment types.
I was responsible for the first live module (Wires) — a 0-to-1 experience that would define UX patterns for all future payment types.
Within Payment Manager, the Wires module included a basic internal messaging concept. On paper, it was a small feature meant to reduce back-and-forth during wire processing. In practice, it exposed a much larger workflow problem.
I worked as the founding product designer on this initiative, leading 0-to-1 design for the MVP. While initial direction came from Product, I translated concepts into a working experience and conducted informal user conversations to understand how staff actually handled wire approvals and exceptions.
Early research surfaced a clear pain point.
When staff needed clarification on a wire, there was no reliable way to communicate within the system. To leave a record, teams sent $0.00 wire transactions with short notes. These messages were limited, hard to track, and easy to misinterpret.
The original plan was to replace this workaround with a simple embedded messaging tool. But once I observed how staff were working day to day, it became clear that messaging alone was not the real problem.
This case study focuses on what happened next.
This case study explores a core question:
How can a small, scoped feature evolve into a high-impact solution when real user behavior reshapes the problem mid-sprint?
The Problem:
A simple fix exposed a broader workflow need
A simple fix exposed a broader workflow need
The initial problem seemed straightforward.
Staff needed a better way to communicate during wire processing than sending $0.00 transactions with short memos.
That assumption changed during a call with operations staff at Choice Bank.
As they described the memo workaround, another behavior surfaced.
Staff were maintaining sticky notes and desktop documents filled with copied approval and rejection language. They routinely toggled out of the system to paste responses back in.
Staff were maintaining sticky notes and desktop documents filled with copied approval and rejection language. They routinely toggled out of the system to paste responses back in.
This insight was not part of the original research.
It came from observing how work actually happened.
It came from observing how work actually happened.
The issue was no longer just missing messaging.
Communication was fragmented, manual, and spread across tools that were never designed for regulated financial workflows.
Communication was fragmented, manual, and spread across tools that were never designed for regulated financial workflows.
This created daily friction, slowed approvals, and increased the risk of inconsistency.
Any solution needed to be fast, compliant, and embedded directly into the workflow staff already used.
Any solution needed to be fast, compliant, and embedded directly into the workflow staff already used.
Where the workflow broke down
▶ No integrated communication
Legacy wire tools lacked a clear way to message within the process.
Legacy wire tools lacked a clear way to message within the process.
▶ Low signal in transaction notes
Short memos were hard to scan, easy to misinterpret, and offered little context.
Short memos were hard to scan, easy to misinterpret, and offered little context.
▶ Manual workarounds
Staff relied on personal notes and copied text to keep responses consistent.
Staff relied on personal notes and copied text to keep responses consistent.
This was not just an inconvenience.
It was a systemic gap between how the system was designed and how work was actually done.
It was a systemic gap between how the system was designed and how work was actually done.
Research Goals + Methodologies:
Discovery that surfaced real workflow behavior
Discovery that surfaced real workflow behavior
PortX was an early-stage company, so research needed to be fast and practical.
I conducted short Zoom conversations with early banking partners to understand how wire transfers were reviewed day to day and where communication broke down.
The focus was not validation. It was exposure.
Research goals
The research aimed to answer three questions:
The research aimed to answer three questions:
▶ How do staff review and approve wire transfers in practice?
▶ Where does collaboration slow down or introduce risk?
▶ What workarounds do teams rely on to keep work moving?
▶ Where does collaboration slow down or introduce risk?
▶ What workarounds do teams rely on to keep work moving?
These conversations revealed a gap between how the system was designed and how staff actually worked.
What the research made visible
Staff were not just struggling to communicate.
They were actively compensating for missing tools by copying and pasting approval and rejection language from personal notes and documents.
Staff were not just struggling to communicate.
They were actively compensating for missing tools by copying and pasting approval and rejection language from personal notes and documents.
That behavior directly informed the design of QuickNotes.
Instead of forcing staff to leave the system, common responses were embedded directly into the messaging interface and available with a single click.
Instead of forcing staff to leave the system, common responses were embedded directly into the messaging interface and available with a single click.
This reduced context switching, improved consistency, and supported faster, more reliable wire decisions without expanding scope or complexity.
My Role + Scope
I worked as the sole UX and UI designer on this initiative.
My responsibilities included:
▶ Defining the foundational UX for PortX Cloud’s Payment Manager by leading design on the first live module (Wires). This work established the interaction system for a multi-rail payments platform, shaping future modules including Checks, ACH, RTP, FedNow, SWIFT and RTP.
▶ Leading user conversations with partner bank stakeholders (Choice Bank), which directly informed the QuickNotes feature
▶ Running remote usability tests using Figma prototypes to validate flows and language
▶ Translating insights into user flows, wireframes, and interaction logic
▶ Designing the embedded messaging experience and supporting UI patterns
▶ Collaborating closely with product and engineering throughout sprint cycles
Tools used:
Figma • Balsamiq • Miro • Jira • Zoom
Figma • Balsamiq • Miro • Jira • Zoom
The Solution:
How the workflow came together
How the workflow came together
The work focused on validating core behavior quickly.
Given the MVP timeline and my role as the sole designer supporting three product teams, the priority was clarity, speed, and alignment.
The screens shown are from a Figma prototype using placeholder content.
While they do not reflect final branding, they accurately represent the layout, task flow, and interaction logic defined for the MVP.
While they do not reflect final branding, they accurately represent the layout, task flow, and interaction logic defined for the MVP.
Medium-fidelity wireframes allowed the team to build and test the experience without blocking delivery.
Visual refinement and a full UI system were intentionally deferred until after launch, once feedback and stability could guide iteration.
Visual refinement and a full UI system were intentionally deferred until after launch, once feedback and stability could guide iteration.
Supporting wire review without leaving the system
The flow centers on how bank staff review, message, and decide on wire transfers within Payment Manager.
The flow centers on how bank staff review, message, and decide on wire transfers within Payment Manager.
After launch, users land on a shared activity dashboard that surfaces all active payment tasks.
Wires appear alongside other transaction types, keeping work consolidated in one place.
Wires appear alongside other transaction types, keeping work consolidated in one place.
From queue to decision
(A) – Staff select Take to open a wire for action.
Selecting View opens the record in read-only mode.
(A) – Staff select Take to open a wire for action.
Selecting View opens the record in read-only mode.
Inside the wire record, all relevant details are visible, including originator, beneficiary, and transaction data.
Messages and memos appear in a dedicated panel, keeping communication tied directly to the transaction.
Messages and memos appear in a dedicated panel, keeping communication tied directly to the transaction.
Embedded communication at the moment it’s needed
(B) – Selecting Add new memo (+) opens the messaging interface.
(C) – The messaging tool behaves like a simple chat.
Message history remains visible, while the input field stays anchored at the bottom.
Staff type a note and post it without leaving the workflow.
Message history remains visible, while the input field stays anchored at the bottom.
Staff type a note and post it without leaving the workflow.
(D) – Messages appear in the memo panel with timestamp and sender details, creating a clear audit trail.
Decisions without delay
Decisions without delay
(E) – Approval and rejection actions are surfaced as clear, primary actions at the bottom of the screen.
QuickNotes is layered on top of the same messaging surface.
This allowed fast deployment while keeping interaction patterns consistent.
Staff can select common responses without toggling to external documents or personal notes.
QuickNotes is layered on top of the same messaging surface.
This allowed fast deployment while keeping interaction patterns consistent.
Staff can select common responses without toggling to external documents or personal notes.
Why this mattered
This workflow replaces fragmented communication with a single, traceable system.
It keeps context intact, reduces manual effort, and supports faster decisions without adding complexity.
It keeps context intact, reduces manual effort, and supports faster decisions without adding complexity.
By focusing on behavior and timing instead of polish, the MVP delivered immediate value while leaving room to evolve.
Above: Payment Manager supports several high-risk payment scenarios, including repairs, drawdowns, and OFAC checks.
Each carries different rules, urgency levels, and regulatory constraints.
Each carries different rules, urgency levels, and regulatory constraints.
The goal was not to simplify the work itself.
It was to make decision paths clear and consistent across situations that already carry stress and consequence.
It was to make decision paths clear and consistent across situations that already carry stress and consequence.
Patterns across different payment states
Early audits showed that staff regularly encountered complex decision moments:
Early audits showed that staff regularly encountered complex decision moments:
▶ Repairs
Triggered by input errors such as incorrect account numbers.
These interrupt processing mid-stream and require guided correction without losing context.
Triggered by input errors such as incorrect account numbers.
These interrupt processing mid-stream and require guided correction without losing context.
▶ OFAC checks
Compliance holds that can raise concern or confusion.
These require precise, transparent messaging that explains what is happening and why.
Compliance holds that can raise concern or confusion.
These require precise, transparent messaging that explains what is happening and why.
▶ Drawdowns
Recipient-initiated transactions that depend on trust, visibility, and clear confirmation before funds move.
Recipient-initiated transactions that depend on trust, visibility, and clear confirmation before funds move.
While the causes differed, the interaction needs were similar.
A shared interaction language
These flows reinforced the need for a unified action model across payment types.
Status changes, permissions, confirmations, and recovery paths needed to behave the same way, even when outcomes differed.
Status changes, permissions, confirmations, and recovery paths needed to behave the same way, even when outcomes differed.
The approach focused on:
▶ Consistent action placement and labeling
▶ Clear state transitions from review to decision
▶ Explicit confirmation steps for irreversible actions
▶ Messaging that balances regulatory precision with human clarity
▶ Consistent action placement and labeling
▶ Clear state transitions from review to decision
▶ Explicit confirmation steps for irreversible actions
▶ Messaging that balances regulatory precision with human clarity
The result is an interaction system that helps staff stay oriented and confident, even when handling exceptions.
It treats complex decisions as part of normal operations, not as breakdowns in the experience.
It treats complex decisions as part of normal operations, not as breakdowns in the experience.
Competitive audit from EWIRE
These screenshots are from EWIRE, a long-standing competitor in the digital banking space.
As part of early audits and competitive review, I analyzed EWIRE to understand prevailing industry patterns and where usability was breaking down.
As part of early audits and competitive review, I analyzed EWIRE to understand prevailing industry patterns and where usability was breaking down.
The goal was not comparison for its own sake.
It was to identify gaps that PortX could meaningfully improve upon while staying compliant and familiar to bank staff.
It was to identify gaps that PortX could meaningfully improve upon while staying compliant and familiar to bank staff.
EWIRE remains widely used, but its interface and workflows reflect legacy assumptions.
Those constraints helped clarify where Payment Manager could raise the bar on clarity, efficiency, and daily usability.
Those constraints helped clarify where Payment Manager could raise the bar on clarity, efficiency, and daily usability.
What the screens reveal
Left: EWIRE’s primary portal for managing incoming and outgoing wires.
The dense layout, minimal hierarchy, and dated styling make it difficult to scan, prioritize, or quickly understand what requires attention.
The dense layout, minimal hierarchy, and dated styling make it difficult to scan, prioritize, or quickly understand what requires attention.
Middle: The wire detail view.
Information is tightly packed with little visual separation, increasing cognitive load during review and decision-making.
Information is tightly packed with little visual separation, increasing cognitive load during review and decision-making.
Right: The messaging experience attached to a transaction.
Communication is functional but fragmented, requiring extra effort to read, write, and track context.
Communication is functional but fragmented, requiring extra effort to read, write, and track context.
Why this mattered for PortX
These examples provided clear contrast for what Payment Manager needed to improve.
They reinforced the importance of:
These examples provided clear contrast for what Payment Manager needed to improve.
They reinforced the importance of:
▶ Clear visual hierarchy
▶ Embedded communication at the point of action
▶ Reduced cognitive load during high-stakes decisions
▶ Embedded communication at the point of action
▶ Reduced cognitive load during high-stakes decisions
They also validated the direction behind PortX’s messaging system and QuickNotes.
The opportunity was not to reinvent banking workflows, but to make them easier to navigate, faster to execute, and less mentally taxing for the people who use them every day.
The opportunity was not to reinvent banking workflows, but to make them easier to navigate, faster to execute, and less mentally taxing for the people who use them every day.
Challenges + Learnings:
What this work reinforced about product decision-making
What this work reinforced about product decision-making
This work required making space for a new idea mid-sprint without slowing delivery.
PortX was moving fast, and the default path was to ship what had already been defined.
The opportunity was not to add scope.
It was to question whether the existing solution fully addressed how work actually happened.
It was to question whether the existing solution fully addressed how work actually happened.
QuickNotes emerged from revisiting an assumption that felt “done.”
A short follow-up conversation surfaced a behavior that reframed the problem and shifted the direction of the work.
A short follow-up conversation surfaced a behavior that reframed the problem and shifted the direction of the work.
This reinforced an important principle.
Good UX is not only about executing solutions.
It is about staying attentive to real behavior, even after a path appears settled.
Good UX is not only about executing solutions.
It is about staying attentive to real behavior, even after a path appears settled.
The outcome was not just a feature.
It was a better decision.
One that reduced manual effort, respected existing workflows, and delivered value without disrupting momentum.
It was a better decision.
One that reduced manual effort, respected existing workflows, and delivered value without disrupting momentum.
Impact + Results:
What changed once the system shipped
What changed once the system shipped
Baseline messaging foundation
▶ Replaced $0.00 transaction memos with an embedded messaging layer inside wire workflows
▶ Reduced confusion caused by short, cryptic notes
▶ Improved internal tracking and auditability of communication tied to each wire
▶ Reduced confusion caused by short, cryptic notes
▶ Improved internal tracking and auditability of communication tied to each wire
QuickNotes workflow acceleration
▶ Introduced QuickNotes, pre-filled responses for common wire approvals and rejections
▶ Saved an estimated 4–6 hours per employee per week by eliminating copy-and-paste work
▶ Reduced context switching and manual effort during high-volume review tasks
▶ Introduced QuickNotes, pre-filled responses for common wire approvals and rejections
▶ Saved an estimated 4–6 hours per employee per week by eliminating copy-and-paste work
▶ Reduced context switching and manual effort during high-volume review tasks
Overall outcome
▶ The combined messaging system was quickly adopted by operations staff
▶ QuickNotes emerged as a standout MVP capability, frequently cited for improving speed and consistency
▶ The combined messaging system was quickly adopted by operations staff
▶ QuickNotes emerged as a standout MVP capability, frequently cited for improving speed and consistency
Postface:
Where this work set direction
Where this work set direction
My involvement concluded around the MVP launch as the company navigated internal changes.
Even within that window, early adoption and feedback showed that the messaging system and QuickNotes delivered clear value.
Together, they reduced manual effort, streamlined communication, and established a stronger foundation for workflow-focused UX across PortX Payment Manager.
QuickNotes shipped mid-sprint to support the MVP deadline.
The goal was to validate the direction quickly and leave room for iteration based on real usage.
The goal was to validate the direction quickly and leave room for iteration based on real usage.
If the work had continued, the next phase would have been to iterate and focus on refinements.
Specifically:
▶ Moving the chat input out of a modal and anchoring it to the message pane for continuity
▶ Allowing users to create and edit QuickNotes directly within the messaging interface
▶ Supporting inline edits through simple affordances, such as an edit icon, without breaking flow
▶ Moving the chat input out of a modal and anchoring it to the message pane for continuity
▶ Allowing users to create and edit QuickNotes directly within the messaging interface
▶ Supporting inline edits through simple affordances, such as an edit icon, without breaking flow
These changes were not feasible within the initial development constraints, but they represented clear next steps.
The system was designed with this evolution in mind.
The system was designed with this evolution in mind.
This work reflects an intentional balance between speed and quality.
It shipped a meaningful improvement while leaving room to grow based on real usage and feedback.
It shipped a meaningful improvement while leaving room to grow based on real usage and feedback.
Interested? Let’s connect.