Bank Modernization

Discovery and Understanding >Strategic Design >Implementation >Ongoing Monitoring

Services

design systems
component architecture
Compliance-Driven design
legacy modernization
wireframes & prototyping
moderated Testing & Delivery
Industry
Financial Services & Banking
Timeline
2024
Client
UMB Bank
MY ROLE
Lead UX Designer

UMB Bank is a diversified financial services company headquartered in Kansas City, Missouri. I was brought in through TEKsystems for a 22-week engagement to provide strategic direction and to lead the UX design for the modernization and unification of 5 internal investment applications while creating a new design system to run across organization.


Their applications were running on DOS/AS400 — green-screen, command-line interfaces that employees with 30+ years of tenure had been using their entire careers. The challenge was designing a redesigned application for those internal financial investors which they could easily adopt while improving their efficiency in the process.


In this project I took the lead for discovery, research, interviews with SMS, design from scratch, working directly with the engineers, onsite moderated testing through delivery and presentation and finally delivering a successful adoption of the updated internal application.


Modernizing for clarity.

Built for adoption.

Five siloed investment applications. All running on DOS/AS400. Users who had been entering commands in green-screen terminals for 30 years. The Representatives were fast with tabbing and key board short cuts hardly ever looking at the screen.


The applications they utilized covered miscellaneous debits and credits, change mode operations, ticket views and history, add/maintain workflows, and end-of-day processing — all critical financial operations where accuracy matters and errors have real consequences.


As the sole UX designer working as lead with a newly formed team of 8 developers, a technical lead, and a business analyst my first task was to provide a successful path for us to collaborate together for a successful on-time delivery. This included a Kick off meeting where it was established an acceptable ways of working including an agile sprint schedule and delivery that would be be agreed upon by every member of the team prior to engagement.

User Experience Transformation

Modernizing for clarity.
Built for adoption.

Led the end-to-end redesign of UMB's Investment Banking Operations applications, replacing a legacy, green-screen experience with a modern, accessible, and scalable interface used across the enterprise.

Human-centered by design

Partnered with operations experts to understand real workflows and pain points.

Streamlined complex workflows

Simplifiex tasks, reduced clicks, and improved accuracy.

Accessible and globally usable

Bult to meet W CAG 2.1 AA standards for maximum usability

Driving adoption at scale

Designed for clarity and confidence, earning trust from expert users.

UMB investment banking operations dashboard on screen

Adoption & Change Management

The process of modernizing the UMB system was a matter of first understanding how the users performed their daily tasks and how to transfer their lengthy experience and ingrained patterns with an application that would deliver speedy results and satisfying experiences following adoption of the program.

1

Discover

Observed users and captured how they actually completed investment workflows. Produced personas and reviewed understanding.

Discover phase screenshot

2

Map Understanding

Mapping the tasks involved in performing the users work with a workflow. Performed micro-testing to ensure accurate 1:1 task to captured interface .

Discover phase screenshot

3

Translate in Design

Translated the validated workflows into designs that matched the cognitive and essential tasks. Feedback fueled design iterations.

Discover phase screenshot

4

Validate with Testing

Working interactive prototypes were tested onsite while users learned the benefits of adopting the newly designed mode of work application.

Discover phase screenshot

The employee personas revealed much.

The application modernization was much more than a redesign of an interface but the reimprinting of 30 years of patterns reimagined into an interface that would be welcomed not resisted.

Financial Advisor
Relationships and Accuracy

Financial Advisor

Meets with multiple clients to assist in managing their finanical concerns.

Cares & Pain Points
Persona

Cares & Pain Points

Cares About
• Understanding client needs
• Promoting bank specials
• Meeting investment goals
• Accurate and fast reporting

Pain Points: Technical issues with software, outdated technical, Financial downturns in market

01

Financial Advisor

Investment Operations Manager
Detail Oriented & Technical

Investment Operations Manager

Responsible for accuracy of all reports in her division. Hands-on with daily data entry and processing.

Cares & Pain Points
Persona

Cares & Pain Points

Cares About
• Correct details
• Staying compliant
• On-time reporting
• Efficient processing response

Pain Points: Bad data, missing data, technical issues holding up operations

02

Investment Operations Manager

Director of Investor Operations
Increase & Risk

Director of Investor Operations

Focused on success of financial investors and client relationships. His agreement and support of the modernization of the application was critical to the success of the application's adoption.

Cares & Pain Points
Persona

Cares & Pain Points

Cares:
• Financial end product success
• Efficiency in reporting
• Root-cause visibility
• Reliance on investment managers

Pain Points: Incomplete visibility into client relationships, Hard-to-spot-bottlenecks, Complex technology advances

03

Director of Investor Operations

Planning for Adoption with Cognitive Re-Patterning

Table Based Layouts

Preserved the data-dense DOD structure while creating modern table based sorting, filtering and search.

high contrast

Readability past accessibility requirements focused on larger font sizes, limited color palette and simpler navigation for ease of use and speed as well as reduced eye and brain fatigue.

Large click targets

To transition out users from DOS tab and enter user patterns ingrained for many years we provded analysis of the tasks to the the interface ineractions where users did not have to think to adopt the interface.

Table Based Layouts

Preserved the data-dense DOD structure while creating modern table based sorting, filtering and search.

Deliberate Friction

What had been previously a task based click entry - an F4 or an enter click became a confirmation dialogue or other means to prevent errors visually.

inline editing

The interface I created for the users enabled them to easily perform all of their regular tasks from one screen with simplified model matching DOS like mental model. It would be a very good first successful adoption to the modernized application.

Modernization was about the people who  do the work

Users with thirty years of muscle memory don't adopt a new interface because it looks better. They adopt it because someone took the time to understand their workflows, preserved what worked, and made the transition feel safe. That is what user-centered design actually means in practice — not a research phase you check off, but a constraint you design against.


I also learned how to lead UX in an engineering-heavy environment where the team was still building its design practice. My contribution was turning user evidence into a delivery system: an architecture the business could recognize, interaction rules engineering could reuse, and an efficient path from design through code—meeting the team where it was while raising the quality bar.


From memorized commands to visible action

Users with thirty years of muscle memory don't adopt a new interface because it looks better. Adoption was planned into the design. The mission of discovery to understand their workflows and how that applied to efficiency in their business processes made the modernization transition feel safe not pressured. By partnering with users and business throughout the design process we successfully  delivered an adopted product with repeatable processes to impact effeciency to code by 30%.

Before: legacy terminal
After: modernized interface

Reusable styles & Processes

Leading UX in the engineering-heavy environment a new design practice provided a challenge to partner with UMB to create repeatable processes replacing cyclical work with faster more on target deliverables.  I transformed user tasks and feedback into a reusable delivery system: business architecture, components and processes engineering would implement going forward, and an efficient path from design through code.

Before: legacy maintenance screen
After: confirmation dialog

See what we have been working on to extend UMB into the agentic future of design! 

We tested AI models, incorporated agents in compliance heavy interface, we modernized the visuals and crested a complete tokenzied scalable design system all with AI - and a little thought.

* Note: The UMB Extended AI case study you are about to see was for personal observation only and not a paid incorporation into UMB.