top of page

Bloomberg Checkout Redesign

Optimizing the checkout experience
top3.png

Background

The Subscriptions Payment team wanted to redesign the flow of our checkout experience to require users to log in and verify their accounts before completing the purchase of a subscription.

Opportunity

Requiring login before checkout will:

  1. Allow us to have a singular post-checkout experience in contrast to the several different experiences we have today for each user type.

  2. Create healthy friction to protect our payment endpoint.

  3. Give us more user insight, allowing us to provide informed pricing recommendations during checkout.

  4. Send better-quality emails (e.g., Abandon cart, Address the over 8k subscribers with bounced transactional emails)

Duration

April 2024-May 2024

Role

Lead Product Designer

Skills

  • Product Strategy

  • Competitive Analysis

  • Interaction & Visual Design 

Problem Statement

How can we redesign the checkout experience to require upfront account verification with the least amount of friction possible?

Original Checkout Experience

The old checkout experience was one long page with three sections:

​

  1. Personal information

  2. Billing period

  3. Payment

​

The purchase button was its own section outside of these three steps.

Competitor Analysis

Before jumping into design exploration I looked at what our competitors are doing with their checkout experience. This helped us identify industry standards and decide on elements we may or may not want to include in our design.

Competitive Analysis Learnings

When it came to competitors we saw a mix of both forced and non forced account verification experiences within their checkout flows. We also saw a heavy use of progress bars or visual elements that allow users to track where they are in the experience. The best checkout flows were quick, seamless, and limited the amount of information the user had to absorb so we kept this in mind as we moved into design exploration.

Design Exploration

We knew that adding account verification to our checkout process could make the experience cumbersome and we wanted to explore how we could communicate the checkout journey to users upfront so that they felt like they knew what they were getting into. Our goal was to figure out how we can reduce abandon cart which had been the biggest concern from the business.

Idea #1 Progress Bar

The first direction I explored was a progress bar checkout experience. This would allow users to see what each step of the journey is and hopefully mitigate any intimidation around how many steps they’d have to get through to finish. They would hopefully have a very clear and focused experience showing one step at a time.

Idea #2 Collapsible Sections

The next idea was a one page checkout experience similar to what we used to have, but in this approach each section expands and collapses. This idea creates a seamless accordion style interaction and keeps the entire checkout process on one page. This layout lets the user see every step of the journey at once and makes the experience look and feel very brief.

Solution

The team ultimately landed on idea #2 because we felt the one page layout was not only a familiar UI for online commerce, but it provided a quicker more seamless experience for our users versus the multi-page experience the progress bar idea created.

*Insert prototypes for web and mobile here*

So what exactly changed?

1. Collapsed sections: The biggest visual change in this redesign are the now collapsible sections within the page. We felt strongly as a team that this interaction made the flow feel seamless, less cluttered, and overall made the page feel shorter.

bottom of page