Axos Bank Website Enhancement
Designing for a better banking experience
Role
UX Designer, User Researcher
Duration
3 months (June 2019 - Sept 2019)
Skills
User Research, Prototyping, UI/UX Design
Tools
Sketch, Invision
Overview
Axos Bank (formerly Bank of Internet) is a federally chartered digital bank headquartered in San Diego, California. Its technology-driven financial services provide a diverse and ever-growing range of innovative banking products and services for personal, business, and institutional clients nationwide.
This summer, I joined Axos as their UX Design Intern, where I tackled projects ranging from graphic design to UX and product design. I had the opportunity to work alongside another fellow intern to redesign the company website's primary flow, focusing on redesigning the checking account comparison page and the product page.
Goals
BUSINESS
Improve enrollment conversion within our primary .com to enrollment flow and landing page to enrollment flow.
PERSONAL
Practice real-world experience regarding the UX process from research and ideation to execution.
Design Process
Understand
We started the project with a kick-off meeting where we invited the project manager, stakeholders, and design team on board to understand the project objective from high-level. We identified the project goal, created the user journey map and empathy map, and brainstormed some How Might We statements in this session.
User journey: the thought process of opening a bank account with us
Empathy map: what do our users think/say, see, hear, and do in the process of opening an account with us?
How Might We:
Journey Map HMW's
To identify problem areas that pose challenges to our users, the team brainstormed some How Might We statements to turn those challenges into opportunities for design. The most selected HMW's are:
-
Getting the users to the products they are looking for
-
Gaining user's confidence in our products
-
Conveying the advantages to bank with Axos
A year ago, Axos did a full-scale rebrand from their previous brand, Bank of Internet, to the current new brand. This involved a complete redesign of their brand identity, company website, and consumer products. Although the transition resulted in an upgraded website with better visual design, it also came with critical usability problems. Here is an overview of the current website flow:
The Problem
Funnel and data of the existing enrollment flow
The website was proven to be confusing and difficult to use from our research. During user-testings, it took users a lot of clicking and searching to get to the products they are looking for. After conducting a thorough audit for the website, the following pain points were identified:
-
Unclear call-to-actions
-
Confusing information hierarchy
-
Lack of visual consistency (eg. illustration vs. image, buttons vs. hyperlinks, etc.)
-
Lengthy landing pages with filler content
The most important component the users were looking for but had troubles finding was the checking account comparison. Currently it is very hidden under the checking accounts page, and there is no CTA to exit the page or move forward with the user's choice of product. This is a very problematic UX error that negatively affects the enrollment flow, which became our top priority to fix.
Competitive
Analysis
To improve the checking account comparison flow, we researched competitors' product comparison pages. The prominent layouts are cards, tables, and drag-and-drop tool.
Cards/ Expanded Cards
Cards (McAfee)
Expanded Cards (BoA)
Tables
Product Comparison Table
.png)
Drag and drop
Drag and Drop Comparison Tool (Wells Fargo)
Drag and Drop Comparison Tool (CompareCards)
Ideation
Wireframes
Final Design
Takeaways
01
Implement user research early and often
It's natural to use our assumptions and judgement when approaching design solutions. However, I'm aware that my decisions are not necessarily the best design solutions for the users. Because I'm familiar with the products I created, the internal decisions without proper user research are often biased and negligent to the user's need, which is why user research should be implemented and revisited at every stage of the design process.
02
Good designs = many iterations
An iterative design process is the essential to the making of any good product. Reaching out for feedback from fellow designers and developers for a fresh pair of eye and technical feasibility always provides new insights for different ways to approach the design and optimize the product.
03
Usability > visual design
While crafting pretty designs and cool animated transitions is always fun, at the end of the day, the product's priority is to be user-friendly and easy to use in order to help users find what they need and finish their tasks. Sometimes usability can be overlooked when designers are too focused on the visual design, rather than solving the problem. This very crucial principle helped us finalize the table design in the final deliverable to cater to what the majority of our users favor for the account comparison feature.
Conclusion
3 cups
Blueberries
ADAM
Motion Designer
LUCINDA
Sr. UX Designer
RYAN
UX Designer
SAMANTHA
UI Designer
HEBAH
UX Design Lead
ME & KATYA
UX Design Interns
ANDREW
UX Designer
MAURI
UX Designer
GERALD
UX Designer
Hover over the photo to meet my lovely team!
In these three months as a UX Design Intern at Axos, not only had I strengthen my design and research skills and gained valuable experience of working in a big financial corporation, I also got the opportunity to work with a team of amazingly supportive and talented designers. They inspired me to take initiative and be resourceful and curious about every design decisions I make. Coming from a visual design background, this is extremely helpful because I am now more aware of optimizing the usability of a product over the creation of good visual designs. This is a great experience that honed my skills as a UX and product designer.
Moving forward, I would like to test out this new product comparison feature with real users and gather data on the conversion rate once it is officially rolled out on the company's website.