← Michael Histen: UX & Product Design Leader
← Michael Histen: UX & Product Design Leader
As VP/Director of Experience Design at Digitas, I led a multidisciplinary team in creating Bank of America’s Spending & Budgeting tool, a customer-centric solution used by over 13 million users. Our agency already had an established relationship with Bank of America by working on their Better Money Habits financial education website, and they came to us when they wanted to bring that knowledge into the logged-in customer experience.
In this case study, I’ll describe how I approached this project, which won a FCS Portfolio Digital Media Award. The process can be broken down into 4 major steps:
Bank of America already had a wealth of knowledge on financial education available, however their Better Money Habits website lived outside of the logged-in customer experience, so there was not a direct connection between these insights and a customer’s actual finances. Bank of America tasked us with finding ways to integrate these two realms so that customers could more easily take actions that could improve their financial health.
To begin our work, I facilitated brainstorming sessions to explore all the potential ways financial education could be incorporated into the online banking experience. I assembled a team of nearly a dozen Experience Designers, who were then broken up into smaller teams which fleshed out potential concepts into several different ideas, each intended to help customers improve their financial health. This work involved a mix of ideation, industry research, and user testing to validate which functionality best resonated with our audience. We presented these as "north stars," showing a proof of concept for each so that our clients could see a vision for how these ideas could come to life.
From this brainstorming, it became clear that our strongest option was a spending & budgeting tool that automatically analyzed each customer’s transactions and helped them take control of their finances. (Another tool from our brainstorming, a goal-setting tool to plan ahead for major expenses, was also later developed to build off of our spending & budgeting work.)
Once we had decided to move forward with a spending & budgeting tool, we did a deeper dive into our audience to better understand their needs and how they thought about finances. We learned several key insights that shaped how we approached our design.
Many other budgeting tools begin by asking users to set monthly budgets for a number of categories. This proved to be an immediate roadblock for many users, who simply did not know how much they typically spent in any given category, and were left to make wild guesses about their expenses. Because of this, those who set budgets often found they were almost immediately off-budget once they started tracking finances, which was discouraging and led to many abandoning budgeting altogether.
Because our tool was already integrated into a customer’s actual transaction history, we were able to greatly reduce the friction of initially setting up a budget, because we could automatically reference their spending history and make suggestions. This allowed customers to modify their budgets using real data, making them more likely to stick to spending goals that were more realistic for their financial situation.
When setting a budget, categorizing expenses is a task unto itself. We knew we had to create categories that made sense to users, and that we had to ensure that transactions could automatically be assigned categories without users having to do that work manually. We took a two-pronged approach to achieving this goal.
First, we did extensive customer research, conducting card-sorting exercises with users to name and group their spending into categories and subcategories, which allowed us to see common patterns in how customers thought about their finances. We then analyzed the most common labels and groupings, refining a set of customer-facing categories that mapped to how users think.
Next, we analyzed a complete list of existing merchant codes that automatically associated transactions with particular spending types for different vendors. We compared this exhaustive list to the customer-facing categories, and mapped these "back-end" labels to our user-friendly category names, allowing every transaction to automatically be sorted into the appropriate category in each user’s budget. This automated another typically manual process, once again reducing friction for users.
Knowing that you are over-budget in a particular spending category is helpful information, but that only goes so far if you don’t know what to do to improve your financial situation. This is where our connection to Better Money Habits financial education content proved invaluable. We created extensive logic trees based on particular financial situations, and served up insights with links to educational content and actionable advice that could help keep users on track.
For example, if a customer was successfully under budget in a particular category for several months, we could congratulate them and serve up content about setting up an automatic savings plan to take advantage of their smart spending, while also recommending refining their budget to more closely match their new spending habits. Conversely, if a customer was consistently over-budget, we could offer educational content around methods to reduce spending in a particular category, and even provide additional tools and calculators that could show them the potential impact of making changes.
To bring the core functionality of our spending & budgeting tool to life, we needed to create a user interface that was intuitive, while also consistent with Bank of America’s existing app and website. This process involved auditing their various online customer tools and identifying existing design patterns and functionality. This allowed us to incorporate existing UI elements that customers were already familiar with, while also identifying areas where we needed to create new designs to accommodate the unique aspects of a budgeting tool.
In my case study about design systems at BondLink, I wrote about the process of creating a design system from scratch. Bank of America was a great example of the other end of the design system spectrum, where we had to work with a well-established existing design language and find ways to seamlessly merge into their existing design ecosystem.
To create intuitive visualizations, we combined pie charts with user-friendly category icons, ensuring clarity and ease of interpretation for diverse users. We referenced their existing design library, and created a handful of new icons using the same style to round out an icon set for the tool. We also carefully selected colors for our budget categories, recognizing that many colors have an imbued meaning already. For example, green is often associated positively with money, so we used shades of green to represent the most essential expenses, such as rent/mortgage and utility payments — subtly communicating that this spending was an expected and "okay" part of their budget rather than a luxury area to cut back on.
Turning our designs into a finished product was an immense undertaking, requiring extensive cross-collaboration. Integrating with Bank of America’s existing systems posed challenges, but proactive collaboration with their engineering team enabled smooth integration without compromising the design. Throughout this process, it was vital to not only have the customer in mind, but also to understand the experience of building relationships within our organizations to foster a cooperative atmosphere that could align us all on a common goal.
Ultimately we launched our spending & budgeting tool successfully, reaching over 13 million customers in our initial release. Follow-up analytics and user surveys showed that the tool could be directly attributed to an improvement in customer satisfaction scores, proving its value immediately after launch.
This project remains one of my proudest efforts in my career, as it was a tool genuinely aimed at helping people by improving their financial health, and it involved successfully coordinating the efforts of nearly 100 people across multiple organizations. I remain enormously proud of my team and the work we did to bring it to life. This project reinforced the value of user-driven design, shaping how I approach large-scale, impactful solutions in my career.