Huntington Card Lock

2017–2018

Losing your debit or credit card is a pain. As you retrace steps, you worry that someone may find your card and drain your account. If you call and cancel, you'll have to change your accounts. With Huntington Card Lock, relax and simply lock it while you look for it.

role

ux lead
interaction designer

objective

Give customers peace of mind while they're looking for a card by delivering a fast, easy way to lock a card from the Huntington Mobile app. Reduce the number of cards reported as lost by 5%.

Background

Losing a debit or credit card can be a frustrating process.
A search mission ensues and that dreaded call to the bank must be made if the card doesn't turn up right away. After waiting for the card to arrive by snail mail, those nice little auto-fill card numbers and any associated bills need to be changed. Not only is replacing a missing card a painful experience for customers, but initiating replacement cards is costly for the bank as well.

Nine times out of ten, that pesky plastic ends up finding its way back in a few days.
At Huntington, looking out for customers and the bottom line meant that allowing customer to simply lock their card while they look for it was a no brainer for business.

Losing a debit or credit card can be a frustrating process.
A search mission ensues and that dreaded call to the bank must be made if the card doesn't turn up right away. After waiting for the card to arrive by snail mail, those nice little auto-fill card numbers and any associated bills need to be changed. Not only is replacing a missing card a painful experience for customers, but initiating replacement cards is costly for the bank as well.

Nine times out of ten, that pesky plastic ends up finding its way back in a few days. At Huntington, looking out for customers and the bottom line meant that allowing customer to simply lock their card while they look for it was a no brainer for business.

Losing a debit or credit card can be a frustrating process.
A search mission ensues and that dreaded call to the bank must be made if the card doesn't turn up right away. After waiting for the card to arrive by snail mail, those nice little auto-fill card numbers and any associated bills need to be changed. Not only is replacing a missing card a painful experience for customers, but initiating replacement cards is costly for the bank as well.

Nine times out of ten, that pesky plastic ends up finding its way back in a few days.
At Huntington, looking out for customers and the bottom line meant that allowing customer to simply lock their card while they look for it was a no brainer for business.

Losing a debit or credit card can be a frustrating process.
A search mission ensues and that dreaded call to the bank must be made if the card doesn't turn up right away. After waiting for the card to arrive by snail mail, those nice little auto-fill card numbers and any associated bills need to be changed. Not only is replacing a missing card a painful experience for customers, but initiating replacement cards is costly for the bank as well.

Nine times out of ten, that pesky plastic ends up finding its way back in a few days.
At Huntington, looking out for customers and the bottom line meant that allowing customer to simply lock their card while they look for it was a no brainer for business.

Losing a debit or credit card can be a frustrating process. A search mission ensues and that dreaded call to the bank must be made if the card doesn't turn up right away. After waiting for the card to arrive by snail mail, those nice little auto-fill card numbers and any associated bills need to be changed. Not only is replacing a missing card a painful experience for customers, but initiating replacement cards is costly for the bank as well.

Nine times out of ten, that pesky plastic ends up finding its way back in a few days. At Huntington, looking out for customers and the bottom line meant that allowing customer to simply lock their card while they look for it was a no brainer for business.

Competitive Audit

After assessing the user needs and the goal of the project, I conducted a competitive analysis to understand how other banks had implemented similar card control features to see what was working well and what wasn't.

CITI QUICK LOCK

• clear instructions provided — "tap to lock"
• accessible indication of status (red/green & active/locked)
• option to report card lost or stolen in close proximity

DISCOVER FREEZE IT

• heavy use of notification banners
• primary CTA in modal, "freeze account," is clear and highlighted
• too many cluttered screens without a clear hierarchy

CAPITAL ONE LOCK CARD

• not obvious that "card in on" is tappable to access locking feature
• no permanent location within the menu structure

• not obvious that "card in on" is tappable
• no permanent location within the menu structure

SIMPLE BANK CARD BLOCK

• combined view of card activities such as block card and pin reset
• clean visual language, particularly use of active/blocked banner

Current State Analysis

Finding a home for card lock within the Huntington Mobile app was the next step. The current card features such as 'activate card' and 'change pin' utilized different top navigation and the menu tab was poorly organized and visually outdated.

Finding a home for card lock within the Huntington Mobile app was the next step. The menu tab of the app was poorly organized and visually outdated. Additionally, the current card features such as 'activate card' and 'change pin' utilized different top navigation. The change pin page was wrapped into the app from the online banking site.

App Navigation Research

I advocated that we study the app's navigation in order to organize the existing features, accomodate a new one, and give the navigation a face lift. As part of the exploration, a UX research colleague and I conducted an audit of 30+ mobile apps. We documented the nav structure employed by each app to see which layouts were most common.

For iOS, combining bottom navigation with top tabs was the most common approach whereas Android apps frequently used a hamburger menu with optional top tabs. We learned, however, that Material Design would soon be moving away from the hamburger menu in favor of bottom navigation as well. We decided to stick with our current bottom navigation approach.

I advocated that we study the app's navigation in order to organize the existing features, accomodate a new one, and give the navigation a face lift. As part of the exploration, a UX research colleague and I conducted an audit of 30+ mobile apps. We documented the nav structure employed by each app to see which layouts were most common.

For iOS, combining bottom navigation with top tabs was the most common approach whereas Android apps frequently used a hamburger menu with optional top tabs. We learned, however, that Material Design would soon be moving away from the hamburger menu in favor of bottom navigation as well. We decided to stick with our current bottom navigation approach.

I advocated that we study the app's navigation in order to organize the existing features, accomodate a new one, and give the navigation a face lift. As part of the exploration, a UX research colleague and I conducted an audit of 30+ mobile apps. We documented the nav structure employed by each app to see which layouts were most common.

For iOS, combining bottom navigation with top tabs was the most common approach whereas Android apps frequently used a hamburger menu with optional top tabs. We learned, however, that Material Design would soon be moving away from the hamburger menu in favor of bottom navigation as well. We decided to stick with our current bottom navigation approach.

In our research, we also found that many apps used the last tab in the bottom navigation as a place to house additional menu options as Huntington's app did. Sticking with our current IA, I went about organizing the app menu and finding a home for the card lock feature. I explored the information architecture of the menu based on the usage of each of the menu pages, stakeholder input, and tree test findings. I combined similar features without burying high-usage pages below multiple landing pages.

In our research, we also found that many apps used the last tab in the bottom navigation as a place to house additional menu options. With this decision in place, I went about organizing the app menu and finding a home for the card lock feature. I explored the information architecture of the menu based on the usage of each of the menu pages, stakeholder input, and tree test findings. I tried to combine similar features without burying high-usage pages below multiple landing pages.

Wireframing & User Testing

After exploring three different flows for card lock, we chose an approach that combined card control functions like activate, change pin, report lost stolen, and, of course, lock card. With this approach, the activate card page would not display in the menu when there were no cards to activate. Additionally, combining all functions into a manage cards page allowed for a clean view of all of a user's cards in one place.