Learn More !

The Less & More: Aligning Information Hierarchy with User Intent for Bank of America

The Less & More: Aligning Information Hierarchy with User Intent for Bank of America

The Less & More: Aligning Information Hierarchy with User Intent for Bank of America

Timeline
August 2025 - December 2025
Role
Research & Strategy Lead
Prototype Facilitator
Responsibilities
UX Research
Prototyping
Design System
Disciplines
User Experience Design
Information Science
Tools
Adobe Creative Suite
Figma
Figjam
UX Metrics
Illustration
Notioly
Methods
Literature Review
User Interview
Persona
Card Sorting
Tree Testing
Usability Test
Prototyping
Teammate
Christina Lu
(Project Manager & Design System Facilitator)
Advisor
Prof. Rahaf Alharbi
Associated with
Master of Science
Department of Information Experience Design (IXD) at Pratt Institute

Project Highlight

Overview

If Time is Money, Bank of America Users are Paying a Hidden Tax of Digital Friction Every Day

This case study details a strategic redesign aimed at eliminating this usability debt. Through rigorous user research and Information Architecture (IA) validation, we architected a new system centered on clarity. Our key finding, "The Less & More," reveals that financial confidence isn't achieved by minimalism, but by strategically matching information density to the user's specific intent.

Outcome Preview

Eliminating Usability Debt: A Strategic UX Redesign of Bank of America Website

In the 14 feedback survey and moderated remote usability testing conducted by Yung-Wei after the design phase, 92% of users reported an increase in their financial confidence, while 84% found it easy to adapt to the system. Furthermore, over 77% of participants completed the financial tasks with high accuracy, resulting in a decrease of over 21% in time spent on unnecessary navigation and a reduction in user flow loss.

The strategies that led to the success includes:

Unified Banking Ecosystem

Consolidated previously fragmented tools (like account opening vs. management) into a single, standardized framework, align with user's financial knowledge and mental model, reducing the cognitive load required to relearn interfaces.

Consolidated previously fragmented tools (like account opening vs. management) into a single, standardized framework, align with user's financial knowledge and mental model, reducing the cognitive load required to relearn interfaces.

Utility Over Clutter

Successfully balance the bank's marketing agenda from the user's workspace. By shifting distracting cross-sells into uniform layout, users can now focus entirely on task completion.

Successfully balance the bank's marketing agenda from the user's workspace. By shifting distracting cross-sells into uniform layout, users can now focus entirely on task completion.

Context-Driven Action

Bridged the gap between financial information and user action by introducing contextual links (e.g., proactive Requirement Checklists) right at the point of need, designed to significantly reduce application drop-off rates.

Bridged the gap between financial information and user action by introducing contextual links (e.g., proactive Requirement Checklists) right at the point of need, designed to significantly reduce application drop-off rates.

Design Artifact

Curing the Usability Gap: Transforming Bank of America’s Digital Experience

The final artifacts represent a transition from fragmented legacy banking to a cohesive, user-centric ecosystem:

Hi-fi Prototype

Delivers a complete structural overhaul of the web experience. By implementing a standardized "Grid & Hub" system, the interface remains predictable and supportive across all services. Every interaction is refined to eliminate "hidden taxes" in navigation, ensuring a seamless flow that feels secure and intuitive.

Delivers a complete structural overhaul of the web experience. By implementing a standardized "Grid & Hub" system, the interface remains predictable and supportive across all services. Every interaction is refined to eliminate "hidden taxes" in navigation, ensuring a seamless flow that feels secure and intuitive.

Try Prototype

Design Iteration Breakdown

This breakdown highlights the critical pivots where user feedback reshaped our system. By comparing early wireframes to the final results, we demonstrate how we solved for "choice paralysis." The iterations show the evolution of our Category Entry Points, proving that every design choice was a direct response to identified friction.

This breakdown highlights the critical pivots where user feedback reshaped our system. By comparing early wireframes to the final results, we demonstrate how we solved for "choice paralysis." The iterations show the evolution of our Category Entry Points, proving that every design choice was a direct response to identified friction.

Review Key Changes

What My Collaborators Say

Teammate

Christina Lu

Product Design Intern @ Tiktok

Working with Amy (Yung-Wei) is a genuine highlight — she creates beautiful designs with thoughtfully considered flows, and brings real visual sensibility and work ethic to everything she touches.

During our BofA redesign, she made a habit of reorganizing our shared notes so they stayed legible and useful long after the initial brainstorm.

She's not afraid to share her perspective, but equally open to others', and the way she carries herself makes everyone at the table feel comfortable speaking up.

This kind of collaborative presence is rare, and it’s why I still look for any excuse to work with her again!

Working with Amy (Yung-Wei) is a genuine highlight — she creates beautiful designs with thoughtfully considered flows, and brings real visual sensibility and work ethic to everything she touches.

During our BofA redesign, she made a habit of reorganizing our shared notes so they stayed legible and useful long after the initial brainstorm.

She's not afraid to share her perspective, but equally open to others', and the way she carries herself makes everyone at the table feel comfortable speaking up.

This kind of collaborative presence is rare, and it’s why I still look for any excuse to work with her again!

Advisor

Prof. Rahaf Alharbi

Assistant Professor at Pratt Institute, School of Information

Amy (Yung-Wei) stood out not only for her strong technical skills, but because of her superpower to effectively communicate design techniques and concepts.

She engaged deeply with course materials and took the extra mile to independently advance her prototyping skills in Figma.

Amy (Yung-Wei) stood out not only for her strong technical skills, but because of her superpower to effectively communicate design techniques and concepts.

She engaged deeply with course materials and took the extra mile to independently advance her prototyping skills in Figma.

The True Story Behind this Project

The Case Study Author

Yung-Wei Chen

Something I wanna share before you dive into my design story…

Like many international students, Bank of America was my first "hello" to the U.S. financial system. Without any roots in this new land, BofA was the door that opened for me. I was lucky to meet my agent, Miss Brice, who guided me through the maze of opening accounts and credit cards with so much patience. She was the human bridge in a system that felt overwhelming.

But I also saw the reality — the friction. Whether you are the customer (B2C), the agent (B2B), or the system itself, there is a constant back-and-forth that drains your energy. Witnessing that struggle, both for me and for Miss. Brice, is what drove me to choose BofA for my first UX project at Pratt. I wanted to take the "Less & More" logic we built in class and turn it into a digital experience that actually supports the human behind the screen.

This project is a tribute to my first steps here, and a reminder of why I design: to build for people, forever.

Like many international students, Bank of America was my first "hello" to the U.S. financial system. Without any roots in this new land, BofA was the door that opened for me. I was lucky to meet my agent, Miss Brice, who guided me through the maze of opening accounts and credit cards with so much patience. She was the human bridge in a system that felt overwhelming.

But I also saw the reality — the friction. Whether you are the customer (B2C), the agent (B2B), or the system itself, there is a constant back-and-forth that drains your energy. Witnessing that struggle, both for me and for Miss. Brice, is what drove me to choose BofA for my first UX project at Pratt. I wanted to take the "Less & More" logic we built in class and turn it into a digital experience that actually supports the human behind the screen.

This project is a tribute to my first steps here, and a reminder of why I design: to build for people, forever.

Background & Why this Important

Why 26 Billion of Financial Interactions Mean 1/5 of Users Fail

Bank of America’s influential market position and inclusive policies open the crucial door to the US financial system for diverse people. However, this massive scale also amplifies the problem when the underlying digital experience creates friction.

Market Leadership of BofA

BofA holds a top spot in the US financial industry. Its inclusive policies establish it as a vital gateway to the financial system for first-time users and immigrants.

The VR games should be in the sports or arcade category, consistent with The Climb 2.

Digital Impact through BofA

While BofA recorded an enormous 26 billion digital interactions in 2024, nearly 20% of users cite usability issues, confirming that this mass scale creates a significant design debt.

The VR games should be in the sports or arcade category, consistent with The Climb 2.

Our project recognized that a lack of usability acts as a "hidden tax" on users, directly undermining the positive impact of BofA's inclusive banking philosophy.

Design Value & Goals

From Chaos to Confidence: The 3-E for a Better Digital Experience

The core problem defined our solution mandate: to move the user experience from confusion to confidence by focusing on three non-negotiable design goals.

The core problem defined our solution mandate: to move the user experience from confusion to confidence by focusing on three non-negotiable design goals.

Easy Come

Ensures users can easily find and understand information (Clarity & Discovery), essential for financial beginners.

Ensures users can easily find and understand information (Clarity & Discovery), essential for financial beginners.

Easy Go

The tasks must be smooth and intuitive to complete (Usability & Delivery), minimizing cognitive load and action steps during high-stress moments.

The tasks must be smooth and intuitive to complete (Uasbility & Delivery), minimizing cognitive load during high-stress moments.

Easy Feel

Users from all financial backgrounds and literacy levels can feel supported (Inclusive & Competent), making the platform genuinely welcoming.

The VR games should be in the sports or arcade category, consistent with The Climb 2.

Persona & The Who

Digital Fluency ≠ Financial Fluency: Defining the Needs of the Web-First User

Our primary user group centered on the young, digital-first generation, spanning both savvy web-first banking customers and critical segments like financial beginners and international immigrants.

Our primary user group centered on the young, digital-first generation, spanning both savvy web-first banking customers and critical segments like financial beginners and international immigrants.

Digital-first Generation

The key insight here is that digital fluency does not equate to banking fluency, underscoring the universal need for a confident guide in financial navigation.

Savvy Investor

Savvy Investor

Sam (27yr)

Sam (27yr)

International Worker
International Worker

I have several different accounts with Bank of America, so managing my finances has become a critical task for me.

I often feel confused when checking my credit card reward details, and I easily forget my bill due dates.

When I make a payment mistake, the process of disputing a transaction is frustrating and stressful.

Banking Beginner

Banking Beginner

Banking Beginner

Wendy (20yr)

Wendy (20yr)

Wendy (20yr)

International Student
International Student

Bank of America is my first bank. I use my savings account to receive the money my parents send me from abroad, and I use the automatic settings on my checking account to pay my rent and tuition.

Bank of America is my first bank. I use my savings account to receive the money my parents send me from abroad, and I use the automatic settings on my checking account to pay my rent and tuition.

As a college student, I only have debit cards right now. I am planning to get a credit card after graduation, but the application process does not seem clear to me.

As a college student, I only have debit cards right now. I am planning to get a credit card after graduation, but the application process does not seem clear to me.

Our design decision focused on creating a system that eliminates ambiguity for all users, ensuring the platform fosters seamless onboarding and transparent financial control.

Problems & Solutions

The Clutter-Confusion-Error Trap: Unpacking the Triple Threat of the Legacy System.

By conducting semi-structured interviews with 5 participants, we explored their general financial journey using BofA’s website system. We also examined their user pain points through financial UX industry standards, assessed usability via cognitive walkthroughs, and gained insights into modern financial design preferences and trends.

By conducting semi-structured interviews with 5 participants, we explored their general financial journey using BofA’s website system. We also examined their user pain points through financial UX industry standards, assessed usability via cognitive walkthroughs, and gained insights into modern financial design preferences and trends.

Our user research revealed that the legacy interface and content actively work against users. We identified 4 key problems and propose the following solutions to create meaningful design impact:

Our user research revealed that the legacy interface and content actively work against users. We identified 4 key problems and propose the following solutions to create meaningful design impact:

Problems
Problems

The Needs of Dynamic Flow

The Needs of Dynamic Flow

High-stress tasks like disputing charges or setting up auto-pay feel "unstable" because steps are rigid and unclear. Users often hit dead ends, losing track of progress when they need control most.

The VR games should be in the sports or arcade category, consistent with The Climb 2.

Solutions
Solutions

Eliminating the Dead-Ends in Critical Workflows

Eliminating the Dead-Ends in Critical Workflows

The solution is a visible, dynamic flow that guides users step-by-step, ensuring they always know where they stand. Also provide various entry points for start their task.

The VR games should be in the sports or arcade category, consistent with The Climb 2.

Problems
Problems

The Need for Feature Consolidation

The Need for Feature Consolidation

Users face disjointed experiences when switching between tasks, such as opening a new account vs. managing an existing one. Currently, these feel like separate ecosystems, forcing users to relearn interfaces constantly.

The VR games should be in the sports or arcade category, consistent with The Climb 2.

Solutions
Solutions

Unifying Fragmented Tools into a Consistent Experience

Unifying Fragmented Tools into a Consistent Experience

We identified the need to consolidate these tools into a unified framework, by providing similar layout, standardizing requirements and steps across all banking products.

The VR games should be in the sports or arcade category, consistent with The Climb 2.

Problems
Problems

The Need for Content Strategic Splitting

The Need for Content Strategic Splitting

A major pain point was the "cluttered UI and upsell content" distracting users from their goals. Users explicitly preferred "simpler, focused experiences" over having ads mixed with their financial data.

The VR games should be in the sports or arcade category, consistent with The Climb 2.

Solutions
Solutions

Divorcing Marketing Clutter from User Action

Divorcing Marketing Clutter from User Action

The critical need is to split the interface: mentally and visually separating the bank’s marketing agenda from the user’s utility workspace.

The VR games should be in the sports or arcade category, consistent with The Climb 2.

Problems
Problems

The Need for Contextual Links

The Need for Contextual Links

Onboarding research revealed users are often blindsided by document requirements (e.g., Tax ID, Proof of Identity) after starting an application. Showing the financial knowledge gaps between information and action.

The VR games should be in the sports or arcade category, consistent with The Climb 2.

Solutions
Solutions

Bridging the Gap Between Information and Action

Bridging the Gap Between Information and Action

To prevent drop-off, we need contextual links, like a "Requirements Checklist", surfaced before and during the "Launch" step, rather than hidden in a separate FAQ.

The VR games should be in the sports or arcade category, consistent with The Climb 2.

Ideation

Bento Box Banking: Architecting Clarity with a Modern, Adaptable Grid

Thus, our low-fidelity ideation phase was driven by 2 core design decisions aimed at establishing a strong, perceivable structure.

Content Hierarchy

We completely revised the Information Architecture ,which was validated through card sorting and tree-testing. Ensure the navigation structure is aligned directly with user mental models and task goals.

Visual Conveyance

We introduced a Bento Grid layout for key feature pages. This design decision and layout standard allows users to quickly adapt to its visual distinction, predictable digital map, and modern feel.

This foundational work created an operable framework for clear workflows, ensuring consistent experiences for critical actions by laying out requirements and steps transparently from the very beginning.

The Overview of Lo-Fi Prototype Screens.

Synthesis

The Unintentional Oversight: When Simplicity Undermines Clarity

The user evaluation of the low-fidelity prototype yielded critical insights that refined our entire design trajectory.

Simpler ≠ Clear

While the Bento Grid layout and new IA were validated as highly operable and quick for user adaptation, a deeper truth emerged: the pursuit of simplified, minimal UI often led to an unintentional oversight of informativeness and authenticity.

The VR games should be in the sports or arcade category, consistent with The Climb 2.

Content = Action Clue

Users needed richer content to "Feel Smart", not just less visual clutter. This pivotal insight demonstrated that clarity requires dense, authentic information for context, proving that a purely minimalist approach would fail our primary goal of supporting financial novices.

The VR games should be in the sports or arcade category, consistent with The Climb 2.

Iteration

The Less & More: A Strategic Framework for Density and Flow

The lo-fi insights catalyzed the mid-fidelity iterations, which was defined by the strategic adoption of the "The Less & More" framework.

The Less

The "Less" (Sparse, Action-oriented) information in the task pages, which were deliberately clean and quiet to guide the user quickly through high-stress actions like money transfer.

The More

Intentionally create "More" (Dense, Informative) overview pages that provide the educational content, action posibility and even more categories of the global navigation, which meet our target users' mental model.

The design impact of this iteration was a system where clarity was achieved by matching the information density to the user’s specific intent, a richer guide at the start, and zero friction during the task itself.

The design impact of this iteration was a system where clarity was achieved by matching the information density to the user’s specific intent, a richer guide at the start, and zero friction during the task itself.

The Overview of Iteration into Mid-Fi Prototype Screens.

Design System

Familiarity is the Shortcut to Financial Confidence: Blending Global Standards from Google Material Design with BofA's Brand Heritage.

To ensure the redesign felt intuitive from the first click, we adopted Google Material 3 as our foundational framework. By leveraging a design language users interact with daily, we utilized existing "digital background knowledge" to lower the barrier to entry.

We strategically balanced this with Bank of America’s color principles, by prioritizing "BofA Red" for primary navigation and "Trust Blue" for action, which creates a synergy between global usability standards and brand identity. This consistency ensures the UI never becomes a "tax" on the user's focus, allowing their financial goals to take center stage.

We strategically balanced this with Bank of America’s color principles, by prioritizing "BofA Red" for primary navigation and "Trust Blue" for action, which creates a synergy between global usability standards and brand identity. This consistency ensures the UI never becomes a "tax" on the user's focus, allowing their financial goals to take center stage.

The Overview of Iteration into Hi-Fi Prototype Screens.

Prototype

The proof of a top-tier banking system can be both data-dense and effortlessly navigable

Try the prototype on Figma ↗

Try the prototype on Figma ↗

The high-fidelity prototype transforms the "Less & More" philosophy into a functional reality. It serves as an interactive bridge between complex financial data and user-centric action, replacing the legacy "information tax" with a streamlined, intent-driven flow.

Key Changes Break Down

Key Decision #1: A Home that Teaches the Financial System in One View

The home page is designed for immediate information discoverability, financial system scaffolding, and the dashboard prominently displays key actions and account overviews upfront. This approach helps users build a mental model of the system without having to navigate through menus.

The home page is designed for immediate information discoverability, financial system scaffolding, and the dashboard prominently displays key actions and account overviews upfront. This approach helps users build a mental model of the system without having to navigate through menus.

The Hi-fi Prototype of Home Page.

Before - Original BofA's Home Page

After - The Financial Home Hub

Key Decision #2: Making Debit Cards Tangible on Screen with Account

The account page seamlessly connects checking accounts to their physical debit cards. By displaying card controls and routing details side by side, it reinforces the strong link between the service and financial management.

Additionally, the presence of an account switcher at the top allows users to easily track information from various accounts with a consistent architectural design.

The account page seamlessly connects checking accounts to their physical debit cards. By displaying card controls and routing details side by side, it reinforces the strong link between the service and financial management.

Additionally, the presence of an account switcher at the top allows users to easily track information from various accounts with a consistent architectural design.

The Hi-fi Prototype of Accounts Page.

Before - Original BofA's Individual Account Page

After - Manage Multiple Accounts Conveniently within the Same Page

Key Decision #3: The Credit Card Paradigm Shift to Align IA for User

In the original Bank of America’s information architecture and financial framework, credit cards were considered equivalent to and belonged to accounts, placing them alongside other savings and checking accounts.

However, user testing with card sorting revealed that 90% of users did not align with this mental model. They perceived credit cards and accounts as separate entities, which differed from BofA's understanding of banking terminology.

Recognizing this gap, we separated credit cards from accounts and placed them at the top level of the information architecture to better suit user needs. However, this separation could also raise another potential issue in the future. The inner bank system and B2C systems use different languages, which could lead to further communication issues. This should be addressed in a more comprehensive ecosystem in the future.

In the original Bank of America’s information architecture and financial framework, credit cards were considered equivalent to and belonged to accounts, placing them alongside other savings and checking accounts.

However, user testing with card sorting revealed that 90% of users did not align with this mental model. They perceived credit cards and accounts as separate entities, which differed from BofA's understanding of banking terminology.

Recognizing this gap, we separated credit cards from accounts and placed them at the top level of the information architecture to better suit user needs. However, this separation could also raise another potential issue in the future. The inner bank system and B2C systems use different languages, which could lead to further communication issues. This should be addressed in a more comprehensive ecosystem in the future.

The Hi-fi Prototype of Credit Cards Page.

The Credit Cards screen is a context-aware interface that focuses on credit management and benefits. While visually consistent with the rest of the app, it highlights specific needs, such as payment due dates, rewards tracking, and security locks.

The Credit Cards screen is a context-aware interface that focuses on credit management and benefits. While visually consistent with the rest of the app, it highlights specific needs, such as payment due dates, rewards tracking, and security locks.

Before - Original BofA's Individual Credit Card Page

After - Manage Risk, Limits, and Benefits Together with Credit Card Hub

Key Decision #4: One Place for Every New Product, from Request to Delivery

The Apply screen offers complete transparency by consolidating all “new business” into a single view. Users can easily track the entire process of their requests, from submission to card delivery, without having to search through individual account settings.

The Apply screen offers complete transparency by consolidating all “new business” into a single view. Users can easily track the entire process of their requests, from submission to card delivery, without having to search through individual account settings.

The Hi-fi Prototype of Apply Page.

Before - Original BofA's Application Status Center

After - Proactive Transparency of Real-time Tracking across All Services

Key Decision #5: From Scattered Actions to a Unified Payment Center

The Transfer & Pay page serves as a central hub for managing payments, consolidating all transfer options and credit card payments in a single location. It offers convenient shortcuts and pre-populated fields to expedite transactions, while grouping actions into intuitive sections to facilitate quick task completion.

The Transfer & Pay page serves as a central hub for managing payments, consolidating all transfer options and credit card payments in a single location. It offers convenient shortcuts and pre-populated fields to expedite transactions, while grouping actions into intuitive sections to facilitate quick task completion.

The Hi-fi Prototype of Transfer & Pay.

The Hi-fi Prototype of Credit Card Payments.

Before - Original BofA's Transfer & Pay

After - Minimizing the "Decision Tax" in Credit Fulfillment

Key Decision #6: A Calm Space for Future Financial Decisions

The original Bank of America’s website’s Spending & Budgeting section was buried as subpages under each account. By elevating these pages to the top of the information touchpoints, users can conveniently view all changes without navigating through each account individually. This centralized page consolidates planning insights and budgeting tools that were previously spread across multiple pages. It allows users to manage their finances in a single location and provides quick links to more advanced controls when needed.

The original Bank of America’s website’s Spending & Budgeting section was buried as subpages under each account. By elevating these pages to the top of the information touchpoints, users can conveniently view all changes without navigating through each account individually. This centralized page consolidates planning insights and budgeting tools that were previously spread across multiple pages. It allows users to manage their finances in a single location and provides quick links to more advanced controls when needed.

The Hi-fi Prototype of Spending & Budgeting.

Before - Original BofA's Spending & Budgeting

After - The Zero-Step Discovery of Spending & Budgeting

Key Decision #7: Rewards & Deals: Turning Hidden Value into Visible Actions

To eliminate the "fragmentation tax" caused by BofA’s originally disparate reward programs, we consolidated multiple separate offer pages into a singular, action-oriented hub. This unified "Bridge" ensures that users can manage their cash back, points, and merchant deals within a single, cohesive mental model.

By centralizing these incentives, the design transforms a scattered discovery process into an "Easy to Go" experience, making it intuitive for users to realize their card’s full value without the friction of navigating disconnected sub-menus.

To eliminate the "fragmentation tax" caused by BofA’s originally disparate reward programs, we consolidated multiple separate offer pages into a singular, action-oriented hub. This unified "Bridge" ensures that users can manage their cash back, points, and merchant deals within a single, cohesive mental model.

By centralizing these incentives, the design transforms a scattered discovery process into an "Easy to Go" experience, making it intuitive for users to realize their card’s full value without the friction of navigating disconnected sub-menus.

The Hi-fi Prototype of Rewards & Deals.

Before - Original BofA's Rewards & Deals

After - Unified Value Ecosystem of Rewards & Deals

Key Decision #8: From Vague Answers to Actionable Search Results

The search interface functions as a "Safety Net," designed to catch users who feel lost or overwhelmed by the complexities of the financial system. By prioritizing deep-linked action related question over static FAQ documentation, the search serves as a direct bridge to task completion rather than just another layer of information.

This "Pre-Agent" resource empowers users to resolve their needs independently, help centers and ensuring that the path to a solution is always "Easy to Go."

The search interface functions as a "Safety Net," designed to catch users who feel lost or overwhelmed by the complexities of the financial system. By prioritizing deep-linked action related question over static FAQ documentation, the search serves as a direct bridge to task completion rather than just another layer of information.

This "Pre-Agent" resource empowers users to resolve their needs independently, help centers and ensuring that the path to a solution is always "Easy to Go."

The Hi-fi Prototype of Searching Page.

Before - Original BofA's FAQ

After - Actionable Search

Reflection & Lessons Learned

The Informative Bridge: The Essential Role of Context in Financial Empowerment

This project taught me that great financial design isn't about making everything "simple". It’s about knowing when to provide detail and when to provide speed. I realized that users need a two-stage journey: one to learn and one to act.

The Informative-oriented

Informative pages are the foundation of user confidence. I learned that stripping away too much detail in the name of "minimalism" can actually create anxiety.

By prioritizing clear terminology and comprehensive content, we help users understand complex systems and adapt to the language of banking.

The goal here isn't to hide information, but to organize it so users feel empowered to make a decision.

The Action-oriented

Action-oriented pages are the destination. Once a user has the context they need, the interface should become a quiet, high-speed path to completion.

These screens are meticulously refined to remove any secondary noise, ensuring the user can finish their task as quickly as possible.

When it’s time to pay a bill or move money, the design’s only job is to stay out of the user's way.

Our ultimate design impact demonstrates that clarity in financial UX is not about minimalism, but rather a thoughtful strategy that aligns information density with the user’s current needs. This approach creates more paths, ultimately reducing friction.

Our ultimate design impact demonstrates that clarity in financial UX is not about minimalism, but rather a thoughtful strategy that aligns information density with the user’s current needs. This approach creates more paths, ultimately reducing friction.

Our ultimate design impact demonstrates that clarity in financial UX is not about minimalism, but rather a thoughtful strategy that aligns information density with the user’s current needs. This approach creates more paths, ultimately reducing friction.

Post-Design Outcome

Design Impact: From Fragmentation to Flow

The redesign transformed a fragmented legacy system into a structured ecosystem where users feel in control. By separating learning from doing, we achieved three core outcomes:

Accelerated Task Completion

By stripping action-oriented pages (like "Transfer & Pay") of unnecessary clutter and using time-based logic, we reduced the time required for high-frequency tasks. Users no longer have to navigate through multiple sub-menus to complete a basic payment, moving from intent to execution in seconds.

By stripping action-oriented pages (like "Transfer & Pay") of unnecessary clutter and using time-based logic, we reduced the time required for high-frequency tasks. Users no longer have to navigate through multiple sub-menus to complete a basic payment, moving from intent to execution in seconds.

Increased User Confidence

The introduction of the "Informative Bridge" ensures that users, especially those new to the U.S. banking system, aren't forced to guess.

Providing clear terminology and context before an action is taken reduces errors and minimizes the anxiety often associated with moving large sums of money.

The introduction of the "Informative Bridge" ensures that users, especially those new to the U.S. banking system, aren't forced to guess.

Providing clear terminology and context before an action is taken reduces errors and minimizes the anxiety often associated with moving large sums of money.

Scalable System Consistency

The unified dashboard and side-panel patterns created a predictable environment. This consistency doesn't just help the user. It creates a scalable framework for BofA. New features can be added into existing "grids" without breaking the user’s mental model, ensuring the platform remains easy to navigate as it grows.

The unified dashboard and side-panel patterns created a predictable environment. This consistency doesn't just help the user. It creates a scalable framework for BofA. New features can be added into existing "grids" without breaking the user’s mental model, ensuring the platform remains easy to navigate as it grows.

The Future

The Unfinished Business: Why Support and Mobile Are Our Next Mandate

Our roadmap identifies two critical frontiers for future iteration to fully eliminate user friction.

Scaling the Help & Support Ecosystem

Data shows that 88% of banking customers now value their overall experience as much as the financial products themselves. This makes support a critical pillar of long-term retention. Our future roadmap includes building a more proactive support environment, integrating AI-driven assistance and contextual help directly into the workflow, ensuring users never have to "leave" their task to find an answer.

Data shows that 88% of banking customers now value their overall experience as much as the financial products themselves. This makes support a critical pillar of long-term retention. Our future roadmap includes building a more proactive support environment, integrating AI-driven assistance and contextual help directly into the workflow, ensuring users never have to "leave" their task to find an answer.

The Mobile-First Transition

With 54% of US customers preferring mobile apps over web or branch access, our next challenge is translating these high-density web workflows into a mobile-first environment. Unlike the web, which supports deep research and complex management, mobile must prioritize "Everyday Money" actions. This will require a distinct design approach that favors extreme speed and thumb-friendly interactions while maintaining our core visual language.

With 54% of US customers preferring mobile apps over web or branch access, our next challenge is translating these high-density web workflows into a mobile-first environment. Unlike the web, which supports deep research and complex management, mobile must prioritize "Everyday Money" actions. This will require a distinct design approach that favors extreme speed and thumb-friendly interactions while maintaining our core visual language.

Aligning the Internal Bank System

A significant gap remains between how the bank categorizes products (B2B/System-oriented) and how customers perceive them (B2C/User-oriented). For example, users don't view a credit card as just another "account" in the same way a bank system does. Resolving this misalignment requires a deep-tier overhaul of the inner banking logic, aligning the "Agent View" with the "Customer View", a task that sat outside our current scope but remains vital for a truly frictionless future.

A significant gap remains between how the bank categorizes products (B2B/System-oriented) and how customers perceive them (B2C/User-oriented). For example, users don't view a credit card as just another "account" in the same way a bank system does. Resolving this misalignment requires a deep-tier overhaul of the inner banking logic, aligning the "Agent View" with the "Customer View", a task that sat outside our current scope but remains vital for a truly frictionless future.

People are also interested in…

People are also interested in…

The Climb 2

Description

The Climb 2

Description

YouBike

Description

YouBike

Description

1＋1 ＞ 2

Description

1＋1 ＞ 2

Description

© 2026 All rights reserved by YUNG-WEI CHEN

E-mail

Medium

LinkedIn

© 2024. YUNGWEI CHEN

E-mail

Medium

LinkedIn

© 2026 All rights reserved by YUNG-WEI CHEN

E-mail

Medium

LinkedIn