Research + Design to Curb Behavior

The Problem

Deposit account holders of USAA bank had little to no understanding of how non-sufficient funds, NSF fees, or overdraft protection worked
- And no source of truth existed for them to learn from
- This also led users to repeatedly and unexpectedly overdraft their accounts, creating frustration and real life pain
Stakeholders pushed for an updated FAQ page

The Solution

Conduct secondary research, utilizing data previously gathered
Create an interactive, quick-acting source of conversationally-given information to provide a pleasant experience for our members who are confused about how overdraft protection works

Strategy

Focusing on interaction and tone of voice, we partnered closely with our Content Strategists to recommend the types of information needed to have the experience be impactful for our members. While content was being written, we began wireframing for mobile first before desktop, as it was the device >60% of our members would be using to interact with the page.

The Result

Content was written in an approachable, casual tone of voice that explained potentially difficult subject matter and was laid out in a way that directly addressed the pain points uncovered in our research.

Upon testing the layout, test participants were able to easily navigate to and find specific information when given tasks to do so.

Pre-Design Work

Due to the potential high impact this product page could have on members, this was a perfect opportunity to step through the full UX cycle, beginning with research.

Member Research

After three rounds of interviews with the objective of learning about their experiences and knowledge around overdraft protection and its related fees, three main insights were observed after synthesizing:

Members didn't understand how overdraft protection worked at USAA
They struggle with bank terminology
They're unaware of when they've overdrawn their account

Design + Business Kickoff

The Design team sat with our Product stakeholders to present our research findings and set a roadmap of expectations. Out of the kickoff resulted:

Knowns vs unkowns
Problem statement and business goal
Agreement to use the new Design System
Next steps to meet with Content Strategists

Content Strategy

The Design team met with Content Strategists and SEO to discuss our research findings in order to allow Content to write the copy for our page with a tone of voice that matched the brand, as well as being informative to the following topics:

Educate on how overdraft protection works
Provide definitions for related bank terminology
Bring awareness to bank tools and services
Update and leverage existing FAQ content

Design Iteration

With Content furiously writing body copy, I began diving into wireframe explorations, focusing on how users could access crucial information on the page as quickly as possible.

Mobile-First Wireframes

We knew that over 60% of our members would be accessing this page on a mobile device, so naturally that's what I first explored.

Multiple layouts and interactions were drafted, and dot-voted on amongst my team to push forward the best layouts.

I was confident that once the mobile experience could get locked down, it would translate easily to a desktop format.

Mid-Fi Designs + Legal Approval

I had the preliminary layout ready when Content sent over their completed body copy, which I then inserted into the design.

From there we worked with Legal and Compliance to ensure the copy was accordance with financial regulations. This took some rewriting and compromise on both sides to be certain we were in good legal standing, but also building a product that didn't read like stereo instructions.

Approval + Launch

Ensuring that we provided an optimal experience across multiple formats, and in a considerably fast turn around for this MVE relied heavily on multiple departments having strong collaboration, communication, and compromise between partners.

Further Research Testing

Some of the terms of compromise between Design and Legal teams depended on continued testing being conducted to ensure comprehension of the content as well as any navigational blindspots.

Post-Launch Testing

Further testing via heat maps and task-based surveys confirmed that the design was performing as intended, with users successfully navigating the page for specific tasks and content.

Increased enrollment into Overdraft Protection

Members reported feelings of empowerment through education

USAA kept up with current best practices

USAA continued its reputation for helping its members

Other UX Projects

Surfacing Data Easily for Users