Mobile App Redesign
Navy Federal Credit Union
I've had the pleasure of working on the UX Design Team at Navy Federal Credit Union for 6+ years. I've worked on many different high level projects for NFCU, but the mobile app redesign released October 1, 2018 is one of my most memorable. We had a team working on the redesign in a workshop style process. It consisted of 2 UX Designers, 2 Visual Designers, a UX Researcher, 2 Business Analysts, a UX Writer, a Systems Analyst, and a handful of iOS and Android Developers.
Background
Our team worked together alongside multiple business units in a collaborative year-long workshop to release our MVP. The efforts consisted of simplifying our top used features into a bottom navigation, while relocating the additional features to a secondary menu. We relocated some of the entry points to help with discoverability based on extensive user-testing. The app was also treated with a full visual design refresh which targeted some core ADA needs.
Reasearch and Discovery
MRID findings and journey maps, site map
Features
Here are a few examples of my wireframes that were used to create visual mocks in order to deliver a finished product for our members.
NAVIGATION
We moved our navigation to a bottom navigation with core features exposed for quick access. We chose these top level screens based on user feedback and our analysis of most used features. We added a more menu for the less frequently used features.
MORE MENU
We condensed our menu and removed some items that were redundant to reduce confusion as to where features live. Having multiple entry points for the same feature can be disorienting for users. This also makes the screen easier to scan.
The most used features were made into large buttons at the top of the screen.
The sign out button was enlarged and moved to a more accessible location.
CARD MANAGEMENT
1 - User feedback indicated that some of our card features were not discoverable. We found that having the account details mixed in with card features was a lot for the user to scan and made it difficult to quickly find what they were looking for. Another thing to consider is that the most used card features have to do with either losing the card or needing to report it lost or stolen. These are features that we want our members to be able to access quickly while in panic mode. Imagine you just lost your card and you need to freeze it quickly.
We found that having a designated area for managing debit and credit cards would help with discoverability. We separated account features from card features by adding a button just for card features at the top of the screen. This button takes you to the Card Management Screen where the user has access to all card related features.
​
2 - The visual redesign includes a large image of the card with notable attributes for easy recognition, for example, the color, name of the card, and the last 4 digits. We also included some micro interactions for swiping and scrolling to add more appeal.
​
3 and 4 - We held user testing sessions for getting user feedback to determine exactly how to group the card features. We wanted to make sure we weren’t assuming anything and that this would make sense to our members for better discoverability. Having just the right amount of groups was also important for scnability.
Outcome
Between October 1-14, there was an increase of 1.78 million in digital usage and 92% of that was via the mobile app
​
Interaction with features increased 6x. Some of those features include opening new products like Certificates and IRAs, the use of move money feature Zelle, set notifications, redeem credit card rewards, and freeze card.
​
There were also significantly less calls to our contact center.