NDA Project
Private Content
This case study is protected under NDA.
Enter passcode to continue.
Incorrect password. Please try again or email sayali.ux@gmail.com for access.
Need access? Email me at sayali.ux@gmail.com
Return to Home
NDA Project
Case Study
JP Morgan Chase
Trade Processing Channel · Loan Setup & Collections
Due to confidentiality and NDA restrictions, the designs shown here represent a partial and curated selection of the work completed for JPMorgan Chase. Certain details, data, and flows have been intentionally omitted or anonymized. The screens included focus on illustrating key UX patterns, interaction decisions, and problem-solving approaches rather than the full system.
Overview
Two workflows.
One global trade operation.
Global trade finance operations involve complex, high-risk financial transactions that must be processed with precision, regulatory compliance, and speed. JPMorgan Chase's Trade Processing Channel supports internal operations teams in setting up trade loans and managing collections across global markets.
The goal was to reduce operational friction, minimize errors, and support users working with dense financial data under constant time and compliance pressure.
Workflow 01
Loan Setup
Creating and configuring trade finance loans, entering party details, loan terms, credit information, payment instructions, and regulatory data before releasing into downstream systems.
Workflow 02
Collections
Managing incoming payments related to trade finance transactions, capturing payment instructions, handling split or partial payments, applying forex details, and ensuring funds are settled correctly.
Part 01
Loan Setup
Context
What Is Loan Setup?
Loan Setup enables operations teams to configure trade finance loans by entering party details, loan terms, credit information, payment instructions, and regulatory data before releasing the loan into downstream systems.
The workflow involves many sequential, interdependent steps, each requiring precision before the next can begin. A single missed field or incorrect entry at this stage can have cascading effects across the entire transaction lifecycle.
High-Risk Workflow
Any error at this stage can result in settlement failures, compliance issues, or financial loss. Operations teams work under regulatory constraints with zero tolerance for ambiguity or unclear system states.
The Problem
Five pressure points in
a high-stakes workflow.
The workflow involves many sequential, interdependent steps that must be completed in exact order, creating a complex chain of dependencies that's easy to lose track of.
Errors are often discovered late in the process, after significant time has been invested, forcing costly rework and delaying downstream teams waiting on completion.
Users need constant awareness of progress and completion status across a long, multi-stage workflow, yet the existing system offered limited visibility into where they stood.
Dense financial terminology increases cognitive load significantly. Analysts must process complex domain language while simultaneously managing accurate data entry under time pressure.
The UX challenge was not simplifying the business logic, but making complex steps predictable, structured, and error-resistant, preserving the full depth required while reducing friction.
User Group
Primary Persona
Goals
- Complete loan setups accurately on the first pass
- Maintain steady throughput without sacrificing quality
- Quickly identify missing or incorrect information
- Avoid last-minute compliance or settlement issues
Pain Points
- Repetitive data entry across multiple steps
- Complex dependencies between fields and steps
- Errors surfacing late in the process
- Limited tolerance for ambiguity or unclear system states
- Pressure from downstream teams waiting on completion
Responsibilities
- Set up and configure trade finance loans accurately
- Validate counterparty information and compliance requirements
- Work with country-specific regulations and tight timelines
- Accuracy is critical; errors can delay settlements
Needs
- Clear progress indicators across all workflow stages
- Inline validation to catch errors before submission
- Structured navigation that enforces required sequencing
- Consistent layouts across all form-heavy sections
"These workflows are complex; I rely on the system to guide me through every required step."
Workflow Architecture
Loan Setup Flow
Loan Setup follows a structured sequence where each step must be completed accurately before moving forward. The flow was designed to enforce this sequencing while giving users clear orientation at every stage.
Structured loan setup flow: each stage must be completed in sequence before the next becomes active, enforcing compliance-critical ordering.
Design Approach
Three principles that shaped
every design decision.
01
Error Prevention Over Error Correction
- Mandatory fields clearly marked and visually distinct
- Validation occurred inline, not on submission
- Users could not proceed without completing required steps
- Reduced downstream rework and manual check dependency
02
Guided Step-Based Navigation
- Clearly show completed, current, and upcoming steps
- Enforce required sequencing for compliance-critical actions
- Allow users to focus on one logical section at a time
- Reduce cognitive load by breaking workflows into parts
03
Clear Information Hierarchy
- Logical field grouping across all sections
- Consistent layouts from screen to screen
- Clear labels and contextual hints throughout
- Reduced scanning effort on dense, form-heavy screens
Foundational Screens
Establishing core patterns
for consistency across the workflow.
The initial focus was on establishing core screens that users interact with repeatedly. These screens set the tone for clarity, structure, and consistency across the entire workflow.
Min width: 748px · Max width: 1838px
Core foundational screens: establishing grid structure, component patterns, and layout consistency used throughout the loan setup workflow.
Drawer components: used for contextual information and secondary actions without disrupting the primary workflow progression.
Annotated Mockups · Loan Setup
Selected UI patterns
and design decisions.
Error Prevention Patterns
Mandatory fields are clearly marked and validated inline, preventing users from advancing with incomplete or incorrect data before it causes downstream issues.
Guided Step Navigation
Key identifiers are selected via search and lookup tools rather than free text. Clear role-based grouping of parties, with primary parties displayed side-by-side to help users understand relationships at a glance.
Annotated Mockups · Full Loan Setup Screen
Annotated walkthrough of the loan setup experience, showing field groupings, validation states, progress indicators, and contextual labels across the complete workflow.
Authoriser Experience
The final gatekeeper:
clarity, accountability, audit readiness.
This screen supports the authoriser role as the final gatekeeper in the workflow. Each section retains its individual decision outcome. Every action is logged with who, when, and why, ensuring accountability across all roles in the approval chain.
The authoriser experience was designed to support high-stakes final decisions by prioritizing clarity, accountability, and audit readiness, without introducing unnecessary interaction complexity.
Part 02
Collections
Context
What Is Collections?
Collections is the workflow used by JPMorgan Chase operations teams to manage incoming payments related to trade finance transactions. This includes capturing payment instructions, handling split or partial payments, applying forex details, and ensuring funds are settled correctly against the right loan or trade record.
Unlike Loan Setup (which is creation-focused), Collections is execution-focused and often happens under tighter timelines, with dependencies on external parties such as correspondent banks and clients.
Execution-Focused Workflow
Operations teams managing collections face different challenges: payments may arrive in parts or require adjustments, multiple data sources must align, and errors can cause settlement delays, client impact, or reconciliation issues.
Primary Persona
Goals
- Process incoming payments accurately and on time
- Handle partial and split payments without data loss
- Maintain alignment across SWIFT, FX, and internal records
- Clear compliance checks efficiently under time pressure
Pain Points
- Need quick access to sections without stepping through every prior stage
- Payments may arrive in parts requiring adjustments mid-workflow
- Multiple data sources (SWIFT, FX, internal references) must align
- Errors cause settlement delays and reconciliation issues
Responsibilities
- Capture and validate incoming payment instructions
- Apply forex details and manage currency settlement
- Ensure funds are matched against correct loan or trade record
- Complete compliance screening before releasing transactions
Needs
- Save-and-resume capability across sessions
- Structured payment tables matching mental models
- Contextual tools accessible without disrupting primary flow
- Clear consolidation view for compliance screening
"Collections move fast; I need the system to keep up without making me search for what I need."
User Flow
From identification
to compliance clearance.
The collections workflow guides users from identifying transactions that need attention, through reviewing payment details and taking action, to completing compliance checks before release.
Collections user flow: transaction identification → payment detail review → action and adjustment → compliance screening → release.
Annotated Mockups · Collections
Design decisions under
execution pressure.
Collections · Payment Details
Critical financial terms are surfaced first to anchor the transaction context. Payment instructions are presented in a structured, spreadsheet-like table to match users' mental models for financial reconciliation. Primary actions (Save, Route, Send for Processing) remain accessible throughout to support save-and-resume behavior.
Collections · FX & Extended Details
Contextual tools and references accessible without disrupting the primary task flow. Forex contracts are added as a separate, optional section to keep the primary payment flow focused while supporting FX-dependent settlements.
Compliance Screening
Transaction data consolidated into a single review for sanction and compliance screening. Document completeness status (OCR page count) surfaced inline. Risk alerts scoped to party and role. Mandatory reconfirmation requires explicit acknowledgment of AML and blacklist checks before progressing.
Business Impact
Measurable outcomes across
both workflows.
Reduced operational risk by enforcing structured, step-based data entry and role-based approvals across loan setup and review workflows.
Minimized downstream errors and rework through inline validation, required field enforcement, and early detection of missing or inconsistent data.
Improved processing efficiency by giving users clear progress visibility and reducing time spent navigating complex, multi-section forms.
Strengthened compliance and audit readiness via built-in approval workflows, section-level authorizations, and a transparent decision history with who, when, and why for every action.
Enabled faster decision-making for authorisers, with clean read-only summaries with clear approval states and risk indicators. Scaled across global markets with region-specific requirements (e.g., India Special Info) within a consistent, reusable UX framework.
Collections persona research: understanding the operational context, mental models, and workflow constraints of trade finance collections analysts.
Conclusion
Precision by design.
Compliance by default.
This project focused on improving two of the most critical workflows in JPMorgan Chase's Trade Processing Channel: Loan Setup and Collections. Both flows sit at the core of global trade operations, where accuracy, compliance, and speed are non-negotiable.
By breaking down complex, high-risk processes into structured, guided experiences, the system now supports operations teams in entering, reviewing, and approving large volumes of financial data with greater confidence. The redesigned workflows balance flexibility with control, helping users move efficiently while ensuring compliance requirements are met at every step.
This work reinforced the importance of designing for real operational constraints, including time pressure, regulatory oversight, and downstream dependencies, and showed how thoughtful UX decisions can directly support business reliability at scale.
Key Learnings
Clarity beats simplicity in enterprise UX
In complex financial systems, the goal is not to "simplify" the work, but to make complexity manageable. Clear structure, consistent layouts, and visible progress mattered more than reducing the number of fields or steps.
Error prevention is more valuable than error recovery
Designing guardrails, including required sequencing, inline validation, and review checkpoints, reduced downstream issues and rework. Preventing mistakes early proved far more effective than correcting them later in the process.
Progress visibility builds user confidence
Step-based navigation and completion indicators helped users stay oriented in long workflows. Knowing where they are and what remains reduced cognitive load and increased confidence during high-stakes tasks.
Compliance should be integrated, not layered on
Compliance checks worked best when embedded naturally into the workflow, rather than treated as a final gate. Integrating screening, approvals, and audit visibility into the core experience made compliance feel supportive instead of obstructive.
Enterprise design is a team sport
Close collaboration with product managers, engineers, and operations stakeholders was essential. Understanding domain terminology, real-world edge cases, and regulatory constraints directly shaped more practical and trusted design outcomes.