Informational redesign for onboarding experiences

I designed a generic informational page for Capital One’s business cards including the Spark Cash Plus card and the Venture X Business card for customers to receive and view during their onboarding experience.

April 2022

Product design / Prototyping

Figma

Background

The primary objective of this page is to ensure customers clearly understand the unique features of a no preset spending limit product. Discovery research was conducted to evaluate various design components within the Capital One design library to assess their suitability for creating a seamless and intuitive experience.

By experimenting with different layouts and integrating diverse elements, the final design delivers a visually compelling and user-friendly informational page to customers.

User problem

Newly acquired customers of a no preset spending limit product don’t fully understand the no preset spending limit construct or how to build their spending power. The current information page refers specifically to one of the two business products, which necessitates the need to update the page to a general educational page for both products.

Hypothesis

If newly acquired customers are educated with information general to no preset spending limit products, they will be more likely to use a tool to check your purchasing power and build their spending power greater than or equal to their stated spend within the first 90 days of approval.

Design discovery

In order to be successful with creating a revamped design, I started out with creating the existing informational page in Figma since all of the previous generation support files were PDF attachments. The current base elements served as a foundation within our Figma design library for this page within a customer’s onboarding experience.

How does the current experience look like?

  • The current information hierarchy in the page does not highlight general no preset spending limit terms, only highlights features pertinent to the Spark Cash Plus card. Venture X Business customers are more likely to skip this onboarding step since the page provides irrelevant information.

  • The video takes up a lot of visual space and causes customers to overlook the card features and benefits section of the card. Customers are likely to not add an additional minute of their time during an onboarding experience by viewing a video.

  • Big purchase instructions section does not provide any interactivity on how a customer would actually try this out. Customers are more likely to overlook this since they do not see the feature in action.

The original page struggles to convey the key benefits and unique features of the no preset spending limit products effectively. Customers often are leaving without fully understanding the product’s value proposition.

Proposed approach

Step by step interactive elements will allow customers to learn how to interact with product features unique to their card

Foundations

Design

Leveraging the existing design library, I evaluated components such as:

  • Accordions: To organize information into digestable chunks.

  • Banners: To communicate key messages quickly and add visual emphasis.

  • Hero section: Introduce the page to immediately convey the value proposition

  • Icons: To visually represent features and add aesthetic appeal.

I carried over the accordion element from the previous design for space efficiency, improved usability, interactive engagement, and improved visual hierarchy. Users can easily scan commonly asked questions and secondary questions are tucked away but still accessible. Adding an interactive element can enhance user engagement and users feel in control of their browsing experience as they choose what to expand.

I explored two banner layout options: one featuring the definition of "no preset spending limit" and the other incorporating a visual of the cards. Ultimately, the banner with just the definition proved more effective, offering a cleaner and more focused presentation.

I experimented with different hero layouts to highlight the page’s theme. One approach featured visuals of small business owners in their element, another showcased the cards themselves, and another incorporated a desk setting to convey a workspace vibe. Each hero section serves as an introduction for the page and sets the tone for the rest of the page. It immediately conveys the value proposition during an onboarding process.

I experimented with different card weights and various icons to explain the card features. While the added weight brought a tactile dimension to the design, ultimately, the version without weight proved to be more effective, offering a cleaner and more streamlined presentation when piecing all the elements together.

Interactive elements were a key focus in the redesign to enhance user engagement and ensure an intuitive, seamless onboarding experience. Rather than a video, being able to go through different steps with dedicated images highlighting a key feature of no preset spending limit products where you can figure out whether purchases would go through based on a certain amount creates a dynamic and memorable experience that aligns with modern design trends and accessibility standards.

The redesigned page includes:

A Hero Section: A concise headline and a brief value proposition, supported by a visually engaging hero image.

Feature Highlights: Key features presented in a grid layout with icons and short descriptions.

Banner: To define no preset spending limit and bring the value at the forefront of the page.

Interactive Step by Step Instructions: Clear instructions with detailed images on checking your purchasing power.

CTA Placement: Strategically positioned button to encourage further exploration in a user’s account.

Explorations and design decisions

Learnings

The learn more page serves as an educational page for newly acquired customers to no preset spending limit products. They view this page during their onboarding experience and it allows them to learn about the features of their card and try out a unique feature. The data showed that the page was a hit within just a month after the launch. In the first month alone, there were 92% total unique views of the page.

Results include:

  • 3,688 page views within one year

  • 2,526 scrolls of the entirety page within one year

  • 132 clicks on trying out the purchasing power tool themselves within one year during the onboarding process