Optimizing EQ Bank's Secure Product Page
Enhancing Product Discovery and Conversion through Improved Card Design
EQ Product page (secure) design from 2016-2023
Quick Summary
EQ Bank is a Canadian Schedule I digital bank (like the big 5 bank) launched in 2016 and now has more than $8.2 billion in deposits with more than 400,000 customers (as of December 2023). EQ Bank was named the #1 Bank in Canada on the Forbes list of World's Best Banks 2021 and 2023.
Since 2016, EQ Bank has grown in their product offering from a their star high interest saving account, to USD account, TFSA, RSP, GICs, and recently launched EQ Card and FHSA in 2023. With increase in new products and categories, we need to optimize the product page that is user friendly (scannable, comparable, and differentiated) and scalable (accommodate more product and categories releases in the future) to help customer find the right product and increase conversion.
-
In development - TBD
-
Acted as product owner and product designer of this initiative. Here’s what I did:
Started the initiative, help drafted business proposal with other PMs, presented the design demo, and got buy-in from stakeholders
managed expectations from key stakeholders and feedback from different teams; CX, marketing, analytics, and small business.
worked with PM to create product timeline, wrote user stories & PRDs, and defined key metrics and goals
designed the experience & interactions and worked on UI with visual designers
Designing the experience
✨
Designing the experience ✨
What are the problems?
The current design page has many design challenges that negatively affect on product discoverability, scannability, and usability, which directly impact product conversion. From a design & experience perspective, here are some key issues;
Dense content: Repeated value proposition across multiple products that brings little to no value to customers who are looking to find the right product for them. This requires high effort of reading to look at product details, benefits, and use cases. (1, 2)
Repeated CTAs and links: in every product adds little value to the product themselves and acts more of a distraction than helpful guides. (3)
No product hierarchy: Mix of different products with different use case. The design doesn’t showcase it’s wide range of offering (everyday account, registered account, investment, and payment). (4)
Long page length: with 9 products, the page is extremely long (7 full scrolls). The long page length reduces product discoverability and scannability, while increase cognitive load and greater attention span for customers to scan key information to open an account. (5)
When you collapse multiple learn more, the content shifts and becomes very disorientating and disturbs reading pattern.
The page is extremely long for 9 products. It is really difficult to scan and compare multiple products.
The main problem I’m looking to solve is to help customer build confidence in finding and choosing the right product for them.
Let’s look at some numbers and understand how is it performing today.
As for it’s current performance, we pulled data to look at:
Traffic per visit (Number of customer visits and conversion rate per month)
Time spent per session (what’s the average time spent on the page per session)
After looking into the numbers, we concluded that:
55% of all customers that visits the product page converts to a product and use the page as intended when they know what they want, however they’re still spending a long time on the page (5 min).
Customers who goes to the product page to explore new products
they’re spend more time (8 min) on the page, looking for information (lot of clicking and scrolling), bouncing off the page, and not converting. This means they’re not confident in opening the product and are looking for information to validate their decision (Google, Reddit, EQ public page) while keeping the product page tab open.
for users who doesn’t convert or click, they’re still spending a long time (2.5 min) on the page. They’re looking for value but not able to find the conversion requirement for them to take the action to open an account.
After examining the data and insights, here are the design goals to help optimize for conversion:
One of the key design goal is to significantly reduce conversion time on the page and increase it’s usability, which is to get people open account with more confidence and spend less time on this page. This means re-evaluating product positioning, presenting simple design and value content that increase product comprehension and user confidence.
Let’s design it
With the design goal in mind, I start solving the experience problem by dissecting the existing product card information architecture. Looking at each product to see if it answers any of these fundamental questions:
What is the product?
What does it do?
What are key benefits?
Are there any hidden fees?
How do I open this?
The new product card strips away all unnecessary information and focus on it’s absolute core values to increase scannability and clarity in product comprehension. This means outlining each product for what it is, why should you open it (benefits), and how it works.
Here’s the finalized design for web MVP using the new updated card pattern.
Some of the refinement on the product card include:
Default state: icon, product name, use case, and interest rate, and simplified CTA (reduce visual noise & density).
Hover state: additional benefit of the account, ‘more detail’ (public site), and “Open”
Compare state: Show expected earning, tax benefits, and contribution room. Only applies to registered products (compare details toggle)
We also made some revision on some of the features on the page.
Primary filter (1)
toggle between personal and small business
Secondary filter
within primary filter that shows the types of product offering; All, Everyday banking, Registered products, GICs
Account limit (3)
Show how many accounts are available to open for Everyday banking
Product category (4)
Separate categories that is easy to scan and quickly differentiate
Compare registered accounts (5)
Instead of having compare feature as a new page, it’ll be a toggle with an expanded state, so the user doesn’t have the leave the page to get more information.
GICs (6)
A new product category that came as the result of the new page design. It was initially a singular product (EQ GICs) but it didn’t show the various types of GICs that’s available and can be purchased. Displaying it as a new product category this way helps customer to scan quickly their GIC options.
Measuring success; TBD (update soon!)
Once there’s enough data, this will be updated!
