Program Redesign
COMPANY
Bank of America
ROLE
Project Lead
Lead Designer
SUMMARY
I lead the design and expansion of a current Bank of America program into a new experience that unifies the space and introduces new functionality. I guided the team through research, strategy, user testing, design and delivery.
Some information and details have been changed or omitted for confidentiality.
Project Overview
PROBLEM STATEMENT
The existing program design was unable to accommodate the increasing complexity and volume of offerings and failed to build relationships with key customer segments. Bank of America wanted the experience to be redesigned into a scalable platform that not only held robust functionality and usability but served users across the market and drove engagement and brand loyalty.
GOALS
1
Unify several of the portfolio programs into one platform
3
Accommodate a large increase in offer volume and complexity
2
Expand targeting to key clients across broad customer segments
4
Drive engagement and build customer relationships
Stakeholder Interviews
FOCUS
We talked to 20 stakeholders to better understand the goals, vision, metrics of success, technical constraints or program limitations, and created a definitive model for the design and strategy. This also gave us an opportunity to build relationships with our business partners, clearly listen to and understand how the project could be a win to each stakeholder, and encourage active participation with the design process.
METHOD
Structured 1:1 interviews
Moderation guide
Observation & templatized note taking
Clustering & synthesis
Interview synthesis
Defining + Understanding Users
CUSTOMER SEGMENTATION
The target users were a broad spectrum supported by the content and offer types that would be available. To understand behaviors across users we conducted market research and collected existing internal research across the target segments.
USER FEEDBACK
Leveraging the existing customer base, we utilized prototypes and surveys to gather usability data and pull out pain points and program opportunities.
Internal research, customer segmentation, KPIs and customer feedback synthesis
Experience Evaluations
CURRENT PLATFORM
We wanted to see how customers were using the existing platform in order to understand their behaviors, expectations and experiences today. We mapped the current mobile and web flows, created prototypes, tested usability through core tasks, and collected qualitative data through unmoderated interviews. We also looked at insights from the website, AI chatbot and call centers to look for trends in what customers were looking for or failing to find.
COMPETITOR + COMPARATIVE EXPERIENCES
We looked at similar offerings from other financial institutions as well as best-in-class loyalty and rewards programs and eCommerce experiences that were setting and shaping users' expectations. Across these experiences, we gathered existing public customer feedback and design inspiration – from big picture overall strategy to creative treatments and specific functionality.
Existing mobile + web experiences
Research Synthesis
KEY FEATURES + REQUIREMENTS
Combining the goals of the business, user feedback, pain points discovered in the existing experience, expected functionality in industry standards, and opportunities uncovered in competing products, we formulated the programs' key features and functionality with which to begin ideation and sketching.
Rose bud thorn, clustering and prioritization matrix
Design Sprints
TEAM
I was the project lead and lead designer over a team of three other designers, an analyst, content strategist and collaborated with research consultants and members of the line of business whom participated in ideation, design and user testing in two week sprints.
COLLABORATION
We held open working sessions to sketch, present, discuss, share inspiration and ideate on concepts. After presenting, the group would highlight features to move forward for user feedback and consideration, collect those treatments, and combine them into contrasting concepts for testing.
Freehand sketching session (Cycle #2)
Features for testing
Resulting dashboard concepts for testing
Wireframing
PROCESS
Early stages of low fidelity design were explored in wireframing along with rapid prototyping for testing. Eventually full flows were tested and documented as wires.
FEATURES
We iterated on and tested different information architecture, flows, functionality and content for value and usability. Some features included a landing page, save or favoriting functions, robust search and filter, categorization, offer details, education, activation flows, logic for offer presentment, browsing preferences and overall user behavior and response to the proposed platform.
User Testing
PROCESS
The team ran qualitative and quantitative testing and synthesis after each round of design in collaboration with research consultants from the XD Lab team. We tested and validated our designs and flows over a total of seven cycles through unmoderated usability tests via UserZoom with screeners for different customer segments. After running the tests, we reviewed the recordings as a group to take notes, synthesize and then determined key takeaways from each round to shape design moving forward.
METHOD
Success rates
Time on task
Click paths & tests
SEQ rating
SUS score
KANO
Testimony
Card sort
DETAILS
Wireframe prototypes
High fidelity prototypes
Test cycle approx. every 2 weeks
7 rounds of testing
2 card sorts
120+ participants
User testing overview + synthesis
One dashboard concept from user testing (Cycle #2)
T1: First impressions
Imagine you just opened your Bank of America app to view BankAmeriDeals. Explore this screen and explain what you see.
Remember to speak aloud and be detailed. Describe the screen as if you are explaining it to someone.
T2: Info at top (expected)
Note the highlighted space at the top of the screen in yellow. What information would you expect to see here? Be sure to think aloud.
T3: Info at top (choice)
What information would you prefer to be displayed here?
Post-Task Question: In a few sentences or less, please tell us why you chose your option order.
T4: Info at top (rank)
Rank in order of importance:
1: Total Yearly Savings
2: Savings to Date
3: Cash Back Summary
4: Total Monthly Savings
5: Featured Offers
6: Tips & Tutorials
7. Not sure.
8. Other: __________
T5: Browsing for deals
You’re going shopping this weekend and want to check for available offers. Imagine you opened the app to this screen. Where would you select first?
Post-Task Question: In a few sentences or less, please tell us why you clicked where you did.
T6: Favorites section
Note the section highlighted in yellow. What is it and what is it for? How would you interact with it if it was in your app? Be sure to think aloud.
T7: Recommended section
Note the section highlighted in yellow. What is it and what is it for? How would you interact with it, if it was in your app? Be sure to think aloud.
T8: Tap empty heart
Note the item(s) highlighted in yellow. What would you expect to happen if you tapped on this? Be sure to think aloud.
T9: Tap plus icon
Note the item(s) highlighted in yellow. What would you expect to happen if you tapped on this? Be sure to think aloud.
T10: Tap filter (rank)
Note the item(s) highlighted in yellow. What would you expect to happen if you tapped on this? Be sure to think aloud.
Post-Task Question: Imagine you have the ability to filter out deals according to category. What options would be helpful for you to browse by and why?
Design
PROCESS
Following the same design sprint + user testing cadence and structure as wireframing, the team continued to collaborate with partners on business and tech teams, and guest participants from other XD portfolios in regular working sessions. We brought in inspiration, continued to present, ideate, user test and move through requirements and screens as designs became more polished and final.
DESIGN SYSTEM + BRANDING
We worked with the Bank of America's DSM to design within the established patterns and identify new needs and scalable components in the project that could contribute. The team also collaborated with marketing and the branding agency working on the new program's look & feel across non-digital channels.
Old dashboard
CHALLENGES
We worked to find a visual balance between the business metrics that favored showing as many offers to a user as possible and users' ability to process and ultimately meaningfully engage with offers.
Old offer details
REDESIGN
1
Elevated look and feel with more inspirational imagery
5
Offer hierarchy to prioritize targeted categories and marketing campaigns
2
Improved readability and comprehension to offer lists and layout
6
Scalable template for 9 offer types, reducing complexity and learning curve for different offers
3
Robust search and customizable category filtering
7
Logic behind offer presentment or ordering based off user insights
4
Saved offers section for faster recall on POS offers
8
Ability to hide specific merchants and set alerts for favorites
New scalable offer template
New dashboard
New offer details
New saved offers page
New transactions page
Takeaways
RESULTS
The project received $20M in funding and is in pilot release.
NEXT STEPS
Continue exploration into North Star designs, testing, enhancements, collect data from original user feedback sources for benchmarking, additional enhancements...
LEARNINGS
Relationship building and early engagement with partners is not only key for design alignment and strategy but for business buy-in and empathy for the user, especially when working with subject matter experts.
NEXT TIME
At the core of this project the bank wanted to build better relationships and product engagement. It would be great to take a step back even broader than this project to examine all of the offerings and avenues to truly achieve that. We were also limited and unable to explore other concepts such as plugins which could have removed some of the friction with offer redemption and one of the biggest hurdles of so many offer types.
LIFE PLAN
Bank of America