Revitalizing PNC's Spending & Budgets Tool for Modern Banking
Project Overview:
The Spending & Budgets tool at PNC Bank is designed to empower users to take control of their finances. It addresses common issues such as money management, overspending, and difficulty saving. A key aspiration for this tool is to foster wealth growth and deepen the user's relationship with PNC over time.
This project was a significant undertaking to align the tool's user experience with the broader redesign of PNC's online banking website and mobile app. Our goal was to create a more intuitive, engaging, and accessible financial management experience for our users. Our target audience primarily consisted of lower-affluent individuals and young adults seeking to improve their financial health.
Role:
Product Designer
Tools:
Figma, Figma, InVision, Sketch, Jira, Confluence
Project Length:
2 years
Problem Statement
The core problem we aimed to solve was that a significant portion of users who had access to the tool were not engaging with it, indicating issues with discoverability, usability, or perceived value. This resulted in missed opportunities for users to improve their financial well-being and for PNC to strengthen customer relationships through valuable financial tools. The tool's interface and features were also not in sync with the modern design language and user expectations being set by the overall digital banking redesign.
Objectives and Goals
Our primary objectives were to create a modernized, user-friendly, and accessible Spending & Budgets tool that would drive increased adoption and engagement. We aimed to elevate the user's ability to track spending, manage budgets, and save effectively. Specifically, we set out to:
- Modernize the tool's interface to align with the new PNC digital experience.
- Improve the usability and intuitiveness of financial tracking and budgeting features.
- Increase user adoption and engagement with the Spending & Budgets tool.
- Ensure the tool is fully ADA compliant and highly accessible.
- Enhance user satisfaction, as measured by NPS scores.
Design Process
Research
I joined the project with the web redesign already in progress and much of the user research completed. My initial task involved migrating web designs from Sketch and Invision into Figma. Soon after, I was entrusted with the responsibility of translating the web learnings and feedback from the old mobile app's Spending & Budgets tool into a redesigned experience for the new PNC Mobile App. My process began with deeply familiarizing myself with the existing research.
Ideation & Prototyping
Following this, I started crafting low-fidelity wireframes to explore various layout and interaction possibilities. A crucial part of this phase involved close collaboration with my lead designer, content designer, accessibility designer, and the PNC Design Systems team. Together, we iterated extensively to define the vision for the tool within the new mobile app. This collaborative effort led to high-fidelity prototyping and navigating the internal approval processes.
Test & Iterate
We then conducted validation testing, incorporating user feedback to refine the design further before handing it off to the development team, which included an AI agent. Throughout the development phase, I maintained daily communication with product managers, business analysts, developers, and AI developers to ensure the seamless integration and realization of the tool in the new app.
Challenges and Solutions
One of the primary challenges was to create a tool that was not only user-friendly and accessible but also more appealing to a broader audience, even with reduced prominence in the app's navigation compared to other features. Because discoverability would likely be down in the new app, we focused intensely on enhancing usability to drive engagement.
Another significant hurdle was finding accessible color palettes for the 28 distinct categories and their subcategories. To overcome this, we developed a systematic approach where each main category received a base color, and its subcategories were represented by variations ranging from dark to light hues of that base color. This system ensured visual differentiation while maintaining accessibility standards.
Metrics for Success
We defined and measured success through key metrics focusing on user adoption and engagement. The primary metrics included the overall adoption rate of the new mobile application and the month-over-month active users of the Spending & Budgets tool both before and after the redesign implementation. We also tracked user satisfaction through Net Promoter Score (NPS) as a crucial indicator of the redesign's impact.
Outcomes
The redesign of the Spending & Budgets tool was a resounding success. We observed a significant increase in user engagement with the tool, rising by 12%. Furthermore, the overall Net Promoter Score (NPS) for user satisfaction saw an uplift, reflecting a more positive user experience. The tool achieved full ADA compliance, making it substantially more accessible than before. Crucially, the adoption of the new mobile application has reached nearly 100%, indicating a successful transition for our users. This project not only modernized a key feature but also demonstrably improved its value and usability for our target audience.
Learnings and Reflections
This project reinforced the importance of iterative design and close collaboration across multiple disciplines. Working through the challenges of balancing feature discoverability with enhanced usability taught me valuable lessons in prioritizing user needs and business goals. The process of finding accessible color solutions for complex category systems was a great learning experience, demonstrating that creative problem-solving can lead to both aesthetic and functional improvements. If I were to embark on a similar project, I would advocate for even earlier and more frequent user testing cycles to validate design hypotheses. I also learned the immense value of fostering strong partnerships with development and AI teams from the outset to ensure a smoother implementation and a more robust final product. The success of this redesign has fueled my passion for creating intuitive and impactful financial tools that truly empower users.
Conclusion
The modernization of PNC's Spending & Budgets tool represents a significant step forward in our commitment to providing exceptional digital banking experiences. We focused on user-centric design, accessibility, and seamless integration with the broader digital ecosystem, delivering a tool that not only meets but exceeds user expectations. The positive outcomes in user engagement, satisfaction, and adoption are a testament to the collaborative efforts of the team and our dedication to solving real user problems. This project has successfully empowered users to better manage their finances, contributing to their overall financial well-being and strengthening their relationship with PNC Bank. The next steps involve continuous monitoring of user feedback and further iterations to ensure the tool remains at the forefront of digital financial management.
More Projects
PNC TotalRewardsEnd to end design of a banking loyalty program
Mylo - Aires' Internal Relocation Management SystemFull redesign of a 20 year old complex system
MobilityX 4.0 - Aires' Client and Transferee Facing Relocation SoftwareA modernized redesign of Aires' customer facing dashboard
Springboard - Aires' Client Facing Lump Sum SolutionA product providing transferees access to lump sum payment and service recommendations