Top 5 U.S. Bank
Delivering the next generation customer engagement tool for a top 5 US bank
FINANCIAL INSTITUTIONS are highly motivated to maintain top tier customer service when clients come to a service center for financial advice.
So how do we help financial institutions uphold their in-person customer service when their demonstration tools are outdated and difficult to navigate?
The bank’s Customer Engagement Tool (CET) iPad application is a tool used by bank associates alongside clients to show pricing calculators, resources, and educational e-mailable handouts. We were charged with delivering the next generation CET to simplify associates’ interactions with clients and maintain their role as trusted advisors.
DELIVERY GOALS OF CLIENTS & DESIGN TEAM
Working with the client, we established goals that would improve the existing application and allow for smoother scaling in the future.
Unify disparate parts of CET that are built on separate applications
Encourage “conversion” in bank associates sending educational CET pdfs to clients after consultations
Address design debt, and provide additional design updates as an impactful value-add
Upon establishing goals, I dove into analyzing the site through mapping the existing information architecture, conducting a hybrid card sort, reviewing the site analytics, and consolidating findings to conduct a workshop with our stakeholders.
EVALUATION & WORKSHOP
IA Mapping
Site Analytics
Card Sort
Stakeholder Workshop
I began going through the site and mapping out all paths and their sub sections. I quickly discovered there were hundreds of links, many of which were broken, nested in unintuitive locations, links with duplicate names led to different locations, and many links would open in a poorly displayed modal; sometimes opening a modal inside a modal.
Information Architecture Mapping
With all parts of the sites mapped out, I chose representative card titles from the various site sections and opted for a hybrid card sort. The sort was distributed to our stakeholders and select users.
Card Sort Activity
Participants broke up and separated into different groups cards that were initially all categorized under the single section”Home Loans, Auto Loans & Small Business”
Participants consistently created a similar heading and grouped certain items together
The group “Mobile banking” was frequently created, not nestled under “Checking”
“Direct Deposit” was frequently grouped under the new created group, “Mobile Banking,” as opposed to its previous location, “Checking”
“Preferred Rewards Takeaway Tool” had no consensus on where it should be placed. Group names created by participants all held very different meanings; some of the suggested categorization names included: Preferred Rewards, Consumer Banking Solutions, Preferred Banking, Products, Core Personal Accounts
Participants agreed that items pertaining to “Small Business” should be kept as such including business-related accounts, and business-related credit cards
Most participants grouped together "Understanding Notary Services" with “Life Plan” either under existing heading of "Life Engagement" or created a new heading containing the word “Life”
Participants agreed that credit cards should be grouped together under a title such as “Credit Cards” or “Products”
Results
We were granted limited access to the client’s site analytics, specifically page view data. Keeping in mind this is not a comprehensive view of the site’s analytics, we were able to glean some general observations.
Analyzing Application Analytics
The most commonly viewed pages were “Checking” and “Credit Cards” at 64,266 and 31,981 lifetime views. The least commonly viewed pages were “Life Engagement” at 2,248, and “Loans” at 2,672 lifetime views.
There was almost no skip link usage on any page. The largest total use was the “Advantage Banking” section on the “Checking” page, which had 20 total hits out of 64,266 total hits to the “Checking” page.
The cart page had very few visits. There were 1,956 recorded hits to the “Cart” page of the 98,936 total hits the home page.
Of the tools, the most popular are the “Customized Cash Rewards Credit Card Calculator” with 1,332 hits, and the “Unlimited Cash Rewards Credit Card Calculator” with 1,187 hits. The Business Advantage tools are the lowest, which isn't surprising given the traffic to that page of the CET.
Based on overall month to month usage and discussion with our client, there were spikes in usage when a big update was rolled out and publicized within the organization.
Similarly, there was unsurprisingly an overall dip in application usage during the start of COVID in 2020 – associates were discouraged to use iPads to minimize touch and close contact
“Preferred Rewards” information was accessed roughly evenly through various different avenues
Upon performing the initial analysis and reviewing available site analytics, I consolidated the findings into a presentation to share to tee up discussions during the client workshop. The first day of the workshop was dictated by the client; they permitted us to ask pointed questions of several specific associates that interact most with the CET application. The second day of the workshop consisted of group exercises and several open forum discussion questions with primarily client leadership. The goal was to identify how associates and leadership thought about the CET, and where they saw areas for improvement.
Stakeholder Workshop
The activities I led during the workshop uncovered several themes and verified our initially established goals; allowing me to distill the findings into an actionable design plan with specific feature improvements.
Workshop Results
Simplicity and efficiency is paramount. Associates cannot be fumbling to navigate the application in front of clients
Personalization of the CET is the next step in encouraging associate usage and making it tailored to each users’s needs
Leveraging Technology to keep application current and exciting. Stakeholders were interested in integration of video and personalized promotions to appear regularly
Workshop Themes I Heard
“Associates should feel powerful when they have this application in their hands. They can have better conversations, make better recommendations, and feel more confident with customers.”
“There are so many great buried resources in this app, we’re excited to bring those to the forefront again”
“We want the app to be intuitive, easy to use, and wow the associates. We also want more engagement with the tool overall, and especially the cart page containing flyers.”
Projected Design Updates
Improve Navigation and Unify Information Architecture
Fine tune content grouping and refining labeling, create a single consolidated navigation to merge the consumer CET, small biz CET and other marketing app tools
Add in-app Notification Bar or Bell to Extend Notifications from Just E-mails
Explore Home Page Personalization Elements to Potentially Include
Ability to edit “favorites” on home page
Dynamically updated fields with links to most visited pages
Addition of welcoming text such as “Hello, User”
Homepage as potential entryway to general profiles such as “student,” “retiree,” “new parents”
Potential dedicated space for current promotion or engaging media
Improve Tools Page
Consolidate tools and calculator resources onto one page, grouped by new IA sub-headings
Reposition tools to be front and center
RECALLING that the initial delivery goals were to unify disparate CET site parts, encourage conversion on cart page, and address design debt, I established the following feature improvements for this project phase.
Using the features checklist I created from the workshop feedback, I got to work creating several wireframe design options. I designed two options for the homepage— completely adding the new elements: the update IA, the editable favorites section, the customer profile section, and the large “Consumer” and “Small Business” entry point links. I also explored the placement of text banners vs free text, and different copy styles. On the “Tools” page, which would later be renamed to “Calculators & Demos” I consolidated the items into a tidy drop down based on section type.
WIREFRAMES
Homepage Option 1
Homepage Option 2
Tools Page Drop Down
Edit Favorites
FINAL MOCKUPS
With sign off from the clients on the intended wireframes, I then passed along my designs to a visual designer to finish the delivery of a high fidelity mock up.
Home Page
Fields for an immediate entry point into the Consumer CET and Small Business CET
A space for a splashy hero image
Welcoming text to orient and contextualize the user
Customizable favorites based on employee profile that can hold up to 12 preferred links. The favorites section comes pre-populated with the most used links, and is marked whether they are a consumer or small business resource.
Navigation
New tiered navigational hierarchy, broken down into the three primary headers, “Consumer CET,” “Small Business CET,” and “Calculators & Demos,”
Calculators & Tools
Reorganization of links to tools, broken up into main headers “Consumer CET” and “Small Business CET,” and organized by new headers including “Checking,” “Savings,’ “Credit Cards,” “Preferred Rewards,” and “Home Loans & Auto Loans”
Cart Page
Consolidated & updated cart page, organized by “Consumer CET” and “Small Business CET
Home Page
Edit Favorites Modal
Consumer CET Navigation
Small Business CET Navigation
Calculator & Demos Navigation
Consumer CET Entry Point
Small Business CET Entry Point
Calculators & Demos CET Entry Point
Calculators & Demos Page - Consumer CET Tab
Calculators & Demos Page - Small Business Tab
Cart Page
DESIGN LESSONS
The project was largely a success in delivering our client a well-tested and streamlined ipad application, delivering above the initial design scope in providing certain Spanish translated pages, untangling the backend hosting and code, and upgrading the site-wide content management systems for standard legal speak on footers. However, there were certain challenges that required creative solutions and inferences.
Information Architecture - Certain sections that I wanted to nest into new sections based off of card sort results and click data were vetoed by the bank management. They had specific campaigns and products they wanted front and center which went against my discovery findings. However, balancing the needs of the business and the needs of the user is part of the give and take of working with clients.
Limited Access to Users - While the client was excited to work with us, agreed with our process and was on board with our findings, they imposed significant limitations on the associates we could interview and the time we had to expose them to the new designs. We worked with the time we were given and supplemented user testing with feedback from the bank management and internal CapTech reviews.
Initially, when I showed the client the wireframe, they had a difficult time conceptualizing how the site would look without a full color mock up. Afraid to lose the trust of the client, we resolved to continue workshopping ideas behind the scenes through our standard process of wireframes before high fidelity mockups, but to only show high fidelity mockups to clients — unfortunately sometimes creating rework for the visual designers.
The contract did not allow for much user testing. My project lead was granted a very short period of time to put mock ups in front of two associates before moving on to the next phase.