img
Header Sidebar Info
  • Date: November 2024 -
  • Client: USAA Bank
  • Category: UI/UX
Financial Wellness Zone

Client: USAA Bank
Role: Senior UX Designer
Timeline: November 2024 – Present
Tools: Figma, FigJam, UserZoom
Team: Enterprise Design, Product Owner, Business Partners

Project Overview

The Financial Wellness Zone is a new feature within USAA’s digital banking experience designed to help members build financial confidence and literacy.

By introducing data visualizations — such as Balance Over Time and Spending Over Time charts — we aimed to give members a clear, engaging view of their financial patterns and progress.

This initiative not only empowers members but also serves as a foundation for future financial health tools within the USAA ecosystem.

The Challenge

USAA’s existing Account Summary page provided raw numbers but no visual insights.

Members had no way to:

  • See how their balance changed over time
  • Track spending patterns
  • Understand trends at a glance

Additionally, USAA’s design system lacked data visualization components, making it difficult to build and scale such experiences consistently across the platform.

Our challenge was to design an intuitive, compliant, and scalable solution that met both member needs and business goals — while aligning with Enterprise Design and the Reveille Design System.

Goals

  • For Members: Improve financial awareness and engagement through visual storytelling.
  • For Business: Increase member engagement and MSAT (member satisfaction) metrics.
  • For Design: Establish foundational data visualization patterns within the USAA design system.

Target Users

Our users were USAA members — service members, veterans, and their families who seek clarity and control over their financial lives.

They value trust, transparency, and simplicity, and they expect tools that respect their time while helping them make informed decisions.

Research & Insights

We used a combination of qualitative and quantitative methods to guide our direction:

  • Unmoderated testing in UserZoom to gauge engagement across early visualization concepts.
  • Moderated interviews exploring members’ financial wellness habits and needs.
  • Competitor analysis to identify opportunities for differentiation and best practices in financial data visualization.
  • Carousel usability research to optimize limited layout space without overwhelming users.

Key Findings

  • Members were highly receptive to the visual approach — it made data feel more meaningful.
  • They wanted more personalized and customizable visualizations to match their budgeting and saving styles.
  • Data transparency increased trust and re-engagement with the app.

Design Strategy

Our approach centered around simplicity, scalability, and visual storytelling.

We collaborated closely with:

  • Enterprise Design to ensure brand alignment.
  • The Reveille Design System team to define and standardize data visualization components.
  • Business partners to align user value with measurable business outcomes.

We also followed USAA’s Foundation Review process, requiring deliverables like:

  • User Personas
  • Journey Maps
  • Information Architecture

This ensured every decision was compliant, traceable, and backed by user research.

Ideation Process

We used FigJam for early brainstorming and cross-functional alignment. Each workshop focused on how to visualize financial trends effectively within limited screen real estate.

Key explorations included:

  • Determining which metrics members found most actionable.
  • Evaluating carousel interactions and animation pacing.
  • Exploring different data visualization types (bar, line, area charts) for accessibility and clarity.

Design Execution

We followed an iterative design process with multiple feedback loops.

Low-Fidelity

  • Wireframes focused on structure, hierarchy, and storytelling.
  • Explored visual balance between text and charts.

High-Fidelity

  • Fully interactive prototypes built in Figma.
  • Tested across multiple devices for accessibility and responsiveness.
  • Integrated early Reveille tokens to maintain consistency.

Core Features

  • Balance Over Time and Spending Over Time charts
  • Carousel navigation for compact data exploration
  • Contextual tooltips and hover interactions
  • Personalization options for user-preferred metrics

Challenges & Trade-Offs

The biggest challenge was alignment — across design, business, and system teams.

  • Enterprise Design: Ensuring consistency in look and feel.
  • Business Partners: Balancing speed-to-market with long-term scalability.
  • Reveille Design System: Building components flexible enough for future use cases.

Each iteration required negotiation between immediate product needs and the larger strategic vision for USAA’s design ecosystem.

Impact & Outcomes

Early UserZoom tests revealed that members:

  • Spent more time interacting with the visualization prototypes.
  • Expressed higher satisfaction with data-driven insights.
  • Requested expanded visualization features for saving goals and budgeting.

Internally, this project became a catalyst for establishing data visualization standards within the Reveille Design System — paving the way for future experiences focused on financial health.

Reflection

This project reminded me of the power of data when it’s made human. Through collaboration, research, and strategic design, we transformed abstract financial numbers into a clear story that empowers members to take control of their financial journey.

“Design isn’t just about aesthetics — it’s about giving people clarity, confidence, and control.”