Skip to content
gmartinezgmartinez

Bank of Chile

Foreign Trade Payments, from Analog to Self-Service

Bank of Chile is the country's largest financial institution, with a nationwide network of branches, ATMs and digital services. External Commerce is its corporate service for international payrolls and payments to the US and Europe, and until then it ran as a manual back-office process.

As the Senior UX Consultant, I owned the design end to end, from discovery to the shipped solution, acting largely as product owner alongside a highly technical Product Manager. After Term Deposits, I was brought in to take External Commerce from a manual service to a desktop application in three months.

Senior UX Consultant · end-to-end owner2018 · 3 monthsSole designer · client and back-officeTeam of 13 · PM, dev lead, developers

  1. 1Problem

    Foreign trade payments ran as a manual, spreadsheet-driven back-office service. The Bank needed it digital in three months, inside rigid UI guidelines and with no budget for user research.

  2. 2Approach

    As sole designer, I replaced formal research with operator access, the Product Manager's domain expertise and validated patterns from adjacent banking products. I worked directly with developers to design ahead of implementation.

  3. 3Result

    A full desktop application (payroll, approvals, real-time FX purchase) shipped in three months. Operators began onboarding corporate clients onto it.

3months to a full desktop application, on schedule
Adoptedoperators onboarding corporate clients after launch
Manual→Self-servicea back-office service turned into a digital channel for corporate clients
Project details Role · Scope · Team · Core challenge · Skills
Role
Senior UX Consultant and sole designer. At the Bank, UX consultants owned the whole process, so I acted largely as product owner, designing both the client-facing and the back-office screens.
Scope
External Commerce, the Bank's corporate international trade product, digitized from an analog service into a full desktop application: payroll creation, order management, approval workflows, real-time currency purchase, role-based messaging, and administrative controls.
Team
13 people: Product Manager, development lead and developers, plus senior management stakeholders and the Bank's External Commerce operators, who we met with regularly
Core challenge
Digitize a manual, spreadsheet-driven trade payments service in three months, inside rigid bank UI guidelines and regulatory requirements, with no budget for user research or validation
Skills
Complex Financial UX, Design Under Constraint, Design System Contribution, Domain-Driven Design Decisions, Developer Collaboration, Regulated-Industry Compliance
Back to top

Section 1 · The Problem

An Analog Service Inside a Digital Bank

A manual, spreadsheet-driven trade service had three months to become a digital product.

Corporate clients sent their international payrolls (batches of payment orders to the US and Europe) to the Bank in person, or emailed them to bank operators as .xls files in the format required by the SII (Chile's tax authority, the equivalent of the US IRS). The operators then processed every one by hand.

That meant overhead for the Bank on high-value transfers, and long days of spreadsheets for the operators: reconciling payrolls, tracking requests across files, and handling every exception themselves.

Three proxy sources stood in for user interviews

The Bank Operators

Embedded daily with the back-office team running the service—users who knew every spreadsheet workaround, edge case, and failure mode.

An Expert Product Manager

The PM had deep operational knowledge of foreign trade. Working closely with him let me absorb the mechanics quickly and design with accuracy rather than assumptions.

Borrowed Evidence

Applied validated behavioral research from adjacent corporate banking products sharing similar target personas and platform patterns.

What the sources boughtConfidence without interviews.Operator proximity, domain expertise and validated patterns, combined, gave us a reasoned method when direct client access was blocked.
Still openWere we solving the wrong problem?No proxy could answer that. The risk was building what the organization already assumed about its customers. I raised it, and the Product Manager, confident in his domain knowledge, made the call to go ahead.

Section 2 · Payroll

Designing the Payroll Application

Clients could keep sending their files, now through the platform instead of email, or build payrolls directly on it.

Payroll processing was the core engine of the platform, built for high transaction accuracy and operational clarity.

The user persona

Accountants and finance staff at medium-to-large companies.

They knowBanking software, and they are comfortable working with it.
They needStreamlined tools to handle heavy transaction loads.

Dual-Input Strategy

Some of the Bank's largest clients, including global players, preferred to hand over their .xls file and simply be told when the payments were ready for approval. Others were ready to work on the platform themselves. We needed both, without forcing anyone to change overnight.

Two inputsUpload an .xls file or build the payroll directly on the platform.

UI Design Style: Flat, minimalist aesthetic with clear spacing, built for data density and fast scanning while adhering strictly to Bank UI guidelines.

Payroll application interface
Payroll application interface

Data Entry Logic

For the web-native builder, I architected a form-based workflow modeled on shopping cart logic: users assemble multiple payrolls, place them on temporary hold, review line items, and execute when ready.

Payroll wizardBuilt explicit multi-step wizard stages (naming, company details, order creation, confirmation) to give users full visibility over irreversible international transfers.

Section 3 · Approvals

Approvals: The Right Control for Every Role

From payroll to release, each role got exactly the controls and visibility it needed.

From payroll to dispatch

Five steps, one chain — every payment approved and logged.

  1. Add the payroll (Finance staff)
  2. Register (Registrar)
  3. Authorize (Approver)
  4. Release (Releaser · finance or CEO)
  5. Bank dispatch (Bank)
Across every step Role-based message boards · urgent SMS alerts · automated audit log
Screens I designed (client + back office)Bank system step, no UI

I designed both sides of the chain: the client screens and the back-office screens.

Register

Corporate clients register each payroll with its beneficiaries and confirm it with their security token.

RegisterThe payroll summary with its beneficiaries, then confirmation with the security token. All data shown is placeholder content, because of NDA.

Authorization Inbox

After registration, the bank's back office verifies each payroll in the background. Verified payrolls then land in the authorization inbox, where a user with the right role authorizes them and moves them on to release.

Authorization inbox with verified payrolls

Authorization inboxVerified payrolls waiting for a user with the right role. Several can be authorized at once, as long as they share a currency.

Approval & Release

Approvers authorize each payroll with the exchange rate confirmed in real time, then a releaser sends the payments to the bank.

Approval & releaseAuthorizing a payroll: choose the account, confirm the exchange rate, sign with the token. Or reject it, with an optional reason.

Audit & Messaging

Audit & messagingAudit logging and the role-based message board that support every approval step.

Section 4 · Constraints

Designing Inside the Bank's Constraints

With the global layout off-limits, I made the data views adjustable instead.

Data-heavy screens consistently exceeded eight columns, causing severe horizontal scrolling and breaking operational scannability. Bank guidelines ruled out changing the global layout, so the fix had to live inside the tables themselves.

Column visibilityThe View tab: up to 7 of 11 columns at a time, with the three key columns locked.

Section 5 · UI Fixes

Fixes That Outlived the Project

Two problems ran through every screen, so I solved them for the whole platform.

Two problems affected everything on screen: secondary actions were hard to find, and the interface gave users little feedback. Using validated findings from adjacent projects, I secured approval to solve both within the Bank's UI guidelines:

Sub-Navigation & Discoverability — Sub-tabs had started to need sub-tabs of their own. I introduced capsule-shaped sub-tabs with a pointer arrow, clearly distinct from the main tabs, so secondary capabilities were visible at a glance.

Action Prominence & Feedback — The bell showed only a small orange dot and sent users to a separate inbox. I added a counter and a popover with the latest messages, and replaced light blues and grays with high-contrast alert states.

Platform-wide fixesThe notifications popover, the reusable currency exchange component, high-contrast alerts, file attachments on the message board, and capsule sub-tabs.

Section 6 · Impact

Business Impact & Outcomes

A manual service, now a digital product in use.

In an institution this size, operational metrics rarely travel back to design teams. What came back was qualitative: operators were happy with the results and were onboarding clients onto the platform, the first clients were pleased with it, and the project closed with thanks for a job well done.

  • External Commerce (digitization)

    A manual service, now a self-service application

    Corporate clients gained direct control over their transactions, and operators began onboarding them after launch

    How

    Digitized manual back-office workflows into a desktop application covering payroll, ordering, FX purchase, and approvals

  • Internal operations

    Uploads processed digitally, with a path forward

    Operators supervise .xls uploads on the platform, while clients can move to the web builder over time

    How

    Designed the operator interface directly around real back-office workflows

  • Delivery under compression

    Shipped in three months

    Delivered on schedule with a team of 13

    How

    Substituted operator access, the PM's domain expertise, and adjacent project research for formal research

  • Regulatory compliance

    Every high-value transfer approved and logged

    Explicit, role-based approval steps with a full audit trail on irreversible international transfers

    How

    Designed within Bank UI guidelines and SII requirements, with multi-tier approvals and automated audit logging

  • Platform-wide UI fixes

    Reused beyond the project

    Approved by UI QA and reused in later B2B applications at the Bank

    How

    Capsule sub-tabs, a notifications popover with a counter, and high-contrast alert states

Reflection

Learnings & Reflections

What a project without a research phase taught me.

  1. Much of discovery was already in the room.

    This was one of the smoothest projects I executed because of three factors: an expert Product Manager, clear business requirements, and daily access to operational staff.

  2. Confidence has more than one source.

    Formal research is one way to gain confidence; domain expertise, adjacent research, validated patterns and operator access also buy it. When the decision-maker skips users, name the risk out loud.

Related Work