PRODUCT + UX DESIGN
Untangling a Decision Workflow
Untangling a Decision Workflow
▋ Moving the money wasn't the design problem. The real problem was helping operators make and document decisions to approve or reject incoming bank wires.
In enterprise wire processing, operators work within strict processing deadlines, regulatory and anti-money-laundering (AML) requirements, and transactions involving substantial sums of money.
An ambiguous wire can require additional investigation across banking systems, internal communications, and reference materials containing the codes and descriptions used to document decisions.
Yet operators relied on information scattered across external tools and even handwritten sticky notes to act on a single flagged wire.I redesigned a fragmented workflow by bringing communication into each wire transaction through Integrated Messaging.
However, by learning how operators actually worked, I uncovered an opportunity beyond the original brief. That discovery became QuickNotes, a one-click way to reuse the codes and descriptions needed when approving or rejecting a wire. ▋
PROJECT AT A GLANCE
When bank wire transactions required additional review, operators often relied on information scattered across outdated banking systems, email, Word documents, and handwritten notes to make and document their decisions.
▶ Integrated Messaging brought communication into the wire workflow. QuickNotes extended the experience by bringing commonly used decision information into the same environment.
🅐 QuickNotes
Contextual decision codes and descriptions surface during approval or rejection, reducing repetitive searching and manual entry.
Contextual decision codes and descriptions surface during approval or rejection, reducing repetitive searching and manual entry.
🅑 Integrated Messaging
Questions, responses, and notes stay together with the wire in chronological order instead of being scattered across separate tools.
Questions, responses, and notes stay together with the wire in chronological order instead of being scattered across separate tools.
▶ ROLE
Founding UX/UI Designer (Sole Designer • Research to Delivery)
Founding UX/UI Designer (Sole Designer • Research to Delivery)
▶ TIMELINE + TEAM
2-Week MVP Sprint (Partnered with Prod • 1 Frontend Eng • 1 Backend Eng)
2-Week MVP Sprint (Partnered with Prod • 1 Frontend Eng • 1 Backend Eng)
▶ PARTNER
Choice Bank (Early PortX Customer)
Choice Bank (Early PortX Customer)
▶ DOMAIN
Enterprise Fintech SaaS (Payment Manager MVP / Wire Operations)
Enterprise Fintech SaaS (Payment Manager MVP / Wire Operations)
▶ IMPACT
Shipped 2 MVP features (Integrated Messaging + QuickNotes)
Shipped 2 MVP features (Integrated Messaging + QuickNotes)
▶ BENEFIT
Operators could now communicate, find decision information, and document the outcome without needing to leave the wire.
Operators could now communicate, find decision information, and document the outcome without needing to leave the wire.
THE PROBLEM
Money Moves Fluidly. Decision-Making Doesn't Always.
Money Moves Fluidly. Decision-Making Doesn't Always.
▋ OVERVIEW
Bank operators had the wire transaction in front of them, but not the information needed to confidently act on it.
Bank operators had the wire transaction in front of them, but not the information needed to confidently act on it.
Background
In an age of instant payments like Venmo and Zelle, moving money can feel almost effortless:
Money leaves one account and arrives in another almost immediately.
In an age of instant payments like Venmo and Zelle, moving money can feel almost effortless:
Money leaves one account and arrives in another almost immediately.
But behind a bank wire transfer is an operational workflow that requires human oversight in the decision-making process while maintaining a traceable record.
At Choice Bank, operators routinely left the wire platform to verify information, resolve questions or problens, and document their reasoning. The work behind a single decision spanned multiple systems and reference materials.
▶ The transaction wasn't fragmented. The decision-making process was.
A single wire decision could send operators across banking systems, email, reference documents, and handwritten notes.
Why It Mattered
Approving or rejecting a wire isn't simply processing a transaction. It's making a decision that must be documented, traceable, and defensible.
Approving or rejecting a wire isn't simply processing a transaction. It's making a decision that must be documented, traceable, and defensible.
Operators sometimes needed to verify information with internal teams or other financial institutions before a wire could proceed. When a transaction required additional investigation, the limitations of the fragmented workflow became more consequential. Resolving an issue meant moving across disconnected systems to find information, communicate with others, and document the resulting decision.
Research + Discovery
The Brief Defined One Problem. The Work Exposed Another.
The Brief Defined One Problem. The Work Exposed Another.
▋ OVERVIEW
The original brief focused on fragmented communication across tools. Learning how the work actually happened uncovered a second problem that was never captured.
The original brief focused on fragmented communication across tools. Learning how the work actually happened uncovered a second problem that was never captured.
Phase I: Getting to know EWIRE
I started by reviewing EWIRE, Choice Bank's existing wire platform. Through walkthroughs and shared screens, I got familiar with what operators were working with.
I started by reviewing EWIRE, Choice Bank's existing wire platform. Through walkthroughs and shared screens, I got familiar with what operators were working with.
Operators also shared their frustrations with EWIRE:
Managing multiple separate windows, looking up cryptic four-character decision codes (e.g., ACSC, AC06) in external references, and abbreviating notes and decision rationale to fit limited text fields — all that effort just to resolve a single flagged transaction.
Managing multiple separate windows, looking up cryptic four-character decision codes (e.g., ACSC, AC06) in external references, and abbreviating notes and decision rationale to fit limited text fields — all that effort just to resolve a single flagged transaction.
▶ I saw usability problems ranging from poor information hierarchy and an archaic communication system to an outdated interface.
Reviewing EWIRE showed me what operators were working with. Learning the workflow revealed the realities surrounding it.
🅐 Disconnected Windows
Critical information opened outside the main transaction view, forcing operators to manage multiple windows.
🅑 Errors Without Guidance
Problem fields were flagged, but operators still had to figure out what was wrong and how to fix it.
🅒 Dense Information
Transaction data competed for attention with little visual hierarchy.
🅓 Easy to Lose Your Place
Lack of wayfinding, changing views, and closing windows made it harder to keep track of where you were in the transaction.
Critical information opened outside the main transaction view, forcing operators to manage multiple windows.
🅑 Errors Without Guidance
Problem fields were flagged, but operators still had to figure out what was wrong and how to fix it.
🅒 Dense Information
Transaction data competed for attention with little visual hierarchy.
🅓 Easy to Lose Your Place
Lack of wayfinding, changing views, and closing windows made it harder to keep track of where you were in the transaction.
Phase II: Understanding Communication Around the Wire
The brief called for both memos and messaging. But I needed a better understanding of how operators actually communicated about a wire.
The brief called for both memos and messaging. But I needed a better understanding of how operators actually communicated about a wire.
Most wires were straightforward and needed little additional attention. Others had issues, like missing account information or mismatched addresses, that operators had to investigate and resolve.
That's when communication and notes became part of the work. Choice Bank explained that operators primarily relied on email, Microsoft Teams, and phone calls with internal teams and other banks.
▶ Making a wire decision could mean jumping through a lot of external hoops.
Operators moved back and forth between different systems and people as they worked toward a decision on more complex wires.
Phase III: Walking Through a Real Wire
I understood the communication problem in pieces, but I wanted to see how it fit into the actual work.
I understood the communication problem in pieces, but I wanted to see how it fit into the actual work.
So I asked Choice Bank to walk me through a real incoming wire from start to finish. During the walkthrough, something caught my attention. When approving or rejecting a wire, operators relied on handwritten sticky notes or Word documents they created themselves to reference commonly used decision codes and descriptions.
I wanted to understand why. As we talked through how they used those codes, I learned that EWIRE didn't provide them.
▶ Operators had to look outside the wire platform for the information needed to document their decisions.
From detailed documents to handwritten reminders, operators kept their own external references to decision codes and descriptions.
Two problems. One workflow.
Communication and approval/rejection codes were different needs, but I realized they were both part of the same overall wire decision workflow.
I asked Choice Bank whether bringing those codes and descriptions into Payment Manager would be useful — and whether it could eliminate their external cheat sheets. They were excited about the possibility.
▶ What started as an effort to understand how operators worked had uncovered another opportunity worth pursuing.
The Solution
The Second Problem Changed the Direction.
The Second Problem Changed the Direction.
▋ OVERVIEW
The two problems called for different interactions, but not separate workflows. Integrated Messaging brought memos and communication into the wire. QuickNotes extended that experience with the codes and descriptions operators needed to document their decisions.
The two problems called for different interactions, but not separate workflows. Integrated Messaging brought memos and communication into the wire. QuickNotes extended that experience with the codes and descriptions operators needed to document their decisions.
Solution 1: Integrated Messaging MVP
Research Insight
When a wire needed additional review, operators relied on email, Teams, and phone calls to resolve questions. Those tools worked, but the discussions happened outside the transaction, separating important context from the wire.
When a wire needed additional review, operators relied on email, Teams, and phone calls to resolve questions. Those tools worked, but the discussions happened outside the transaction, separating important context from the wire.
Design Response
I started with the memo requirement, then moved into messaging. As I worked through both, I recognized that they could use the same simple posting interface and shared history rather than become separate experiences.
That became Integrated Messaging: a place to post messages and memos directly within a wire, with both appearing in the Messaging Pane.
The tight MVP sprint called for a lightweight approach, and the straightforward interaction suited when questions and notes needed to resolve problems in wires.
▶ Communication could stay connected to the wire instead of living entirely across separate tools.
Integrated Messaging brought communication directly into each wire transaction, keeping questions, responses, and notes connected to the work they informed.
🅐 Messaging Pane
The communication history remains visible alongside the active wire.
The communication history remains visible alongside the active wire.
🅑 Add a Memo
Operators can post questions, responses, or notes about the wire from the same interface.
Operators can post questions, responses, or notes about the wire from the same interface.
🅒 Integrated Messaging
Previous entries remain visible while an operator composes a new message or memo.
Previous entries remain visible while an operator composes a new message or memo.
Solution 2: QuickNotes MVP
Research Insight
Choice Bank operators relied on external reference notes to look up the codes and descriptions used when approving or rejecting wires. That meant leaving the transaction workflow to find information they needed to document their decisions.
Choice Bank operators relied on external reference notes to look up the codes and descriptions used when approving or rejecting wires. That meant leaving the transaction workflow to find information they needed to document their decisions.
Design Response
Part I: Contextual by Design
Part I: Contextual by Design
The workaround revealed an opportunity to bring those codes and descriptions directly into Payment Manager.
QuickNotes surfaces relevant, one-click options when an operator chooses Approve or Reject. Selecting a code inserts its full description, which the operator can edit or expand with transaction-specific rationale. They can also skip QuickNotes and enter their own explanation.
▶ QuickNotes made recurring decisions faster to document without taking control away from the operator.
QuickNotes surfaces a compact code + label, then inserts the full standardized description, which the operator can customize with transaction-specific information.
Part II: Shared Architecture, One Experience
As I explored QuickNotes, I recognized that documenting a decision had something in common with adding a memo: both involved recording information against a specific wire.
As I explored QuickNotes, I recognized that documenting a decision had something in common with adding a memo: both involved recording information against a specific wire.
With Integrated Messaging already taking shape, I could build on the same modal experience. The dimensions, layout, text field, and buttons stayed the same. QuickNotes added a contextual layer of code capsules in place of the communication thread.
Both paths use the same modal layout, text field, and buttons. QuickNotes adds context-specific code capsules during approval or rejection, and all entries appear chronologically in the shared Messaging Pane.
Part III: Expanding the Product Direction
After learning how Choice Bank operators referenced decision codes outside the platform, I began exploring with them how we could bring that information into Payment Manager. I asked whether it would be useful and help them get rid of the sticky notes on their monitors. They were enthusiastic about the possibility.
By the end of our 75-minute call, I told them I thought I knew how we could solve it, but needed to check with my team first. Later that day, I developed the one-click QuickNotes interaction and reviewed its feasibility with Product and Engineering.
The next day, we brought the prototype back to Choice Bank for validation.
▶ Choice Bank's feedback helped turn an unexpected opportunity into a feature worth adding to the MVP.
Identify. Prototype. Expand.
In two days, we turned an observed workaround into a validated product direction.
In two days, we turned an observed workaround into a validated product direction.
QuickNotes provided a one-click starting point for documenting decisions while allowing operators to add transaction-specific rationale.
Why Capsules Instead of a Dropdown?
A standard dropdown would have felt like the path of least resistance, but it broke down the moment I looked at the physical workflow.
In our shared modal, the upper half was sized specifically to show the message thread. Swapping that space for a collapsed select menu would have left the entire top of the modal empty and awkward.
More importantly, dropdowns introduce unnecessary friction.
Operators have to click to open the menu, scroll, scan, and click again. Surfacing recurring codes as visible capsules turned a multi-step chore into a single click, made the codes scannable the second the modal opened, and utilized the fixed dimensions of our shared architecture naturally.
Operators have to click to open the menu, scroll, scan, and click again. Surfacing recurring codes as visible capsules turned a multi-step chore into a single click, made the codes scannable the second the modal opened, and utilized the fixed dimensions of our shared architecture naturally.
▶ Capsules turned a multi-step dropdown into a single click while naturally maximizing the space within the fixed bounds of the shared modal.
One Workflow for Communication and Decision-Making
Integrated Messaging provided the foundation. QuickNotes extended the same modal experience to decision documentation rather than introducing a separate tool.
▶ Operators could now communicate and document their approval or rejection rationale within the same wire workflow.
Instead of building separate tools for team communication and wire decisions, every action runs through the same communication modal framework.
🅐 General Communication
Operators could ask or answer questions and leave notes to the wire through the communication modal.
Operators could ask or answer questions and leave notes to the wire through the communication modal.
🅑 Rejection
The thread swaps out for bank-regulated decision codes. Rejection-specific codes appear within the shared modal.
🅒 Approval
The thread swaps out for Approval-specific codes within the shared modal.
The thread swaps out for bank-regulated decision codes. Rejection-specific codes appear within the shared modal.
🅒 Approval
The thread swaps out for Approval-specific codes within the shared modal.
🅓 Conversation + Decision History
Regardless of which path an operator takes, every note, decision code, and timestamp lands in the same persistent right rail — giving anyone who opens the wire an immediate chronological paper trail.
Regardless of which path an operator takes, every note, decision code, and timestamp lands in the same persistent right rail — giving anyone who opens the wire an immediate chronological paper trail.
Boundaries
The Build Changed. The Goal Didn't.
The Build Changed. The Goal Didn't.
▋ OVERVIEW
The original goal was straightforward: bring messaging into Payment Manager. We had a two-week MVP sprint with one frontend developer and one backend engineer to build it.
The original goal was straightforward: bring messaging into Payment Manager. We had a two-week MVP sprint with one frontend developer and one backend engineer to build it.
My earlier concepts explored how messaging could work more broadly across Payment Manager, beyond Wire Operations. Building that broader experience would have required more development time and resources than the sprint allowed.
When QuickNotes emerged halfway through the sprint, I looked for an approach that balanced the operator experience with what we could realistically build. My exposure to frontend development helped me recognize that extending the Integrated Messaging modal was likely a manageable addition, rather than a separate interface requiring a larger build.
That kept the interaction familiar for operators while allowing Engineering to reuse much of the existing interface structure and code.
▶ Reusing the existing interface helped us address another operator need without adding the complexity of a separate experience.
Impact + Results
The Bigger Picture Starts Up Close.
The Bigger Picture Starts Up Close.
▋ OVERVIEW
Integrated Messaging and QuickNotes shipped in the Payment Manager MVP, bringing communication, decision codes, and documentation into the wire workflow. Together, they addressed two main sources of friction for operators and established patterns the product could build on as new needs emerged.
Integrated Messaging and QuickNotes shipped in the Payment Manager MVP, bringing communication, decision codes, and documentation into the wire workflow. Together, they addressed two main sources of friction for operators and established patterns the product could build on as new needs emerged.
User Impact: A More Coherent Experience
Operators could now complete the decision process within the wire instead of repeatedly leaving the workflow to communicate, find approval/rejection codes and descriptions, and document the decision.
Integrated Messaging
Brought communication and memos into the wire, with the conversation history showing who added each entry and when.
Brought communication and memos into the wire, with the conversation history showing who added each entry and when.
▶ Operators could resolve questions and add notes for themselves or their teams without breaking away from the wire they were reviewing.
QuickNotes
Surfaced approval and rejection codes with shorthand descriptions directly in the workflow, letting operators insert the full description with one click and add transaction-specific rationale as needed.
Surfaced approval and rejection codes with shorthand descriptions directly in the workflow, letting operators insert the full description with one click and add transaction-specific rationale as needed.
▶ QuickNotes gave operators access to decision codes and descriptions directly within Payment Manager, reducing the need to consult external references.
Choice Bank didn’t just like the idea — they endorsed the feature in the MVP.
Walking through the prototype, the operators confirmed that QuickNotes was useful and could eliminate the need for those external reference notes.
Walking through the prototype, the operators confirmed that QuickNotes was useful and could eliminate the need for those external reference notes.
▶ QuickNotes wasn't just a promising prototype. It became a shipped feature.
Communication, reference information, documentation, and decisions came together around the wire.
Combined Benefit
Instead of leaving conversations, notes, and decision rationale scattered across external tools, the Messaging Pane keeps that context connected to the wire.
▶ If a teammate needs to explain why a wire was rejected weeks later, they can revisit the conversation, notes, and documented rationale directly in the Messaging Pane.
Impact at Scale: Time Saved Compounds at Volume
Small time savings become substantial through repetition.
Small time savings become substantial through repetition.
Integrated Messaging
Saved operators' time by reducing the repeated tool switching involved in resolving questions and documenting information about the wire.
Saved operators' time by reducing the repeated tool switching involved in resolving questions and documenting information about the wire.
▶ Reduced the need to switch between tools by keeping conversations and operator notes directly inside the transaction.
QuickNotes
Turned the repeated process of finding and entering approval/rejection codes and descriptions into a one-click starting point.
Turned the repeated process of finding and entering approval/rejection codes and descriptions into a one-click starting point.
Based on the workflow I observed with Choice Bank, I modeled how that interaction difference could scale across repeated wire decisions
▶ Reducing routine decision logging from ~30s to ~2s is projected to save an estimated 195 hours annually at the illustrated wire volume.
Illustrative scale model using 100 documented decisions per day, 250 working days per year, and an estimated reduction from 30 seconds to 2 seconds per decision. Figures are hypothetical, not measured production results.
▶ At that volume, even small time savings could add up, giving operators more time for work beyond repeatedly finding and entering the same decision information.
Product Impact: Structures That Adapt and Extend
The MVP addressed the immediate operator needs while establishing interface patterns that could support additional functionality.
The MVP addressed the immediate operator needs while establishing interface patterns that could support additional functionality.
QuickNotes
QuickNotes extended the Integrated Messaging experience to support approval and rejection documentation without requiring a separate interface. The MVP accommodated an additional operator need while preserving a consistent interaction pattern.
QuickNotes extended the Integrated Messaging experience to support approval and rejection documentation without requiring a separate interface. The MVP accommodated an additional operator need while preserving a consistent interaction pattern.
▶ Reusing the messaging modal meant our two engineers didn’t have to build a brand-new component from scratch. We delivered QuickNotes alongside the originally planned Integrated Messaging feature within the same two-week sprint.
Extensible Pattern
The right rail provided a flexible area for contextual information and actions alongside the primary work area. It also became the foundational framework for more complex workflows later in other parts of Payment Manager.
The right rail provided a flexible area for contextual information and actions alongside the primary work area. It also became the foundational framework for more complex workflows later in other parts of Payment Manager.
▶ I later reused the pattern for OFAC Operations MVP, where higher-priority information took precedence while Integrated Messaging remained available below it.
Earlier and later OFAC designs using the same right-rail pattern.
Reflection
I Wasn't Trying to Solve It. I Was Trying to Understand It.
I Wasn't Trying to Solve It. I Was Trying to Understand It.
▋ OVERVIEW
The original brief gave me a problem to solve, but not everything I needed to understand. My curiosity about how operators actually worked led me to ask questions beyond the immediate requirements.
The original brief gave me a problem to solve, but not everything I needed to understand. My curiosity about how operators actually worked led me to ask questions beyond the immediate requirements.
Working with incomplete information wasn't unusual at PortX — it was just part of early-stage software.
My instinct has always been to look closer. Curiosity is essential when something is unfamiliar or incomplete, driving me to challenge assumptions, dig into underlying systems, and uncover what might otherwise go unnoticed.
That curiosity often leads to a deeper understanding, sometimes exposing a more meaningful problem than the one on paper. But recognizing an opportunity doesn't automatically mean it's worth pursuing. That takes judgment, too.
▶ Curiosity can reveal a better problem to solve. Judgment helps determine whether it's worth solving.
▋ If you’re building from zero, let’s talk about laying the foundation.