The Essential Membership Flow

〰️

The Essential Membership Flow 〰️

The Essential Membership Flow

Redesigning the entire checkout flow, creating multiple entry points to convert window shoppers to Essential members.

Role

Project Lead
Lead Designer

Year

2022

Disciplines

UX/UI
Visual Direction
Graphic Design

Introduction

Anyone can shop at TheEssential.com but in order to checkout, membership is needed which can be daunting to a new customer once they see the $95 membership fee in cart. This led to a deep drop-off and hurt overall conversion especially because there was no communication of any membership requirements in any point in the website.

In order to improve membership conversion, we decided to redesign the entire checkout flow creating multiple entry points to indicate that membership is needed.

I was the project lead and in charge of designing the membership flow - designing the pages, and working with team members on providing feedback.

Challenges

How can we isolate existing members from seeing the non-member checkout flow?

Clearly communicate the value of becoming a membership before prospects join.

How can we build trust through our tone of voice & visual style for a new prospects to sign on to be a member for an entire year?

How can we communicate that membership is needed to new prospects?

The Broken Flow

A flow that took customers on a multiple click journey to finally become a member

  • Step 1

    For new customers who are not logged in, the membership is automatically added to cart.

  • Step 1.5

    If they try to remove the membership, the whole cart deletes which leads to a steep drop off in signing up.

  • Step 2

    When hitting the check out button, new customers are led to a log in page and sees the “Become a member” CTA in small text at the bottom.

  • Step 3

    Customers are taken to a standard sign up page where they can create their account.

  • Step 4

    Once they hit join, new customers are taken to a intermediary page where they can see the member benefits of signing up.

  • Step 5

    After hitting join again, the next flow takes the new member to a log in page.

  • Step 6

    Finally, at step 6, the customer can check out. The next page takes them to filling out the billing and credit card information.

Metrics
old membership flow

Conversion Rate

Essential Members

Sketching a New Path

Creating a new flow path for members and non-members to make signing up to be simple and easy.

A New Flow

Creating enticing custom pages that is simple in design and linear in experience to ensure a new member conversion.

01

Members vs Non Members

We want to communicate clearly that membership is required to shop at The Essential with clear CTA’s to enter the membership flow. But for those who already have membership, they should not be bombarded with those CTA’s.

Create 2 versions of the website where non-members (logged out) see CTA’s and paths to enter the membership flow, and members (logged in) don’t see any of that.

02

Membership in Cart

When new prospects shop the store and are ready to check out, they can remove the membership in the checkout page. When that happens, that wipes out the entire cart which then hurts membership conversion.

Automatically add membership to cart when non-members shop and add products into cart. Remove the ability to remove the membership product in cart.

03

Membership Pitch

There is no soft landing for prospects that come from ads or social media to see what an Essential membership could offer.

Create a new landing page where non members can see the benefits of the membership.

A New Flow

Creating enticing custom pages that is simple in design and linear in experience to ensure a new member conversion.

  • Step 1

    For new prospects who are not logged in, they will see an orange CTA in the menu or a pop up that says become a member.

  • Step 2

    The second flow leads them to a pitch page where prospects can see the benefits of joining. To move on to the next step, an email address is required.

  • Step 3

    The next flow will lead to creating a password. The email address from the previous flow will be automatically filled in this step.

  • Step 4

    The last step will be the Shopify checkout and payment page with the membership in cart. Once the prospect is finished checking out, they will receive confirmation and sent back to home logged into their account.

  • Step 5

    As a member logged into theessential.com, they do not see the “Become a Member” CTA anymore and can now shop the website freely.

What Difference Was Made?

Metrics
new membership flow

Conversion Rate
+4.7% Increase

Essential Members
5.6k Increase

Conclusion

The previous flow was broken where if an interested customer entered, they would have to repeat filling in new account information or paths would lead to empty/error 404 pages.

With this new flow, it helps transition the customer smoothly by giving them earlier signs on membership as well as provide a softer landing into purchasing a membership through guiding them to the membership pitch page.

Through this improvement, we were able to increase conversion rate by 4.7% and gain new members by 5.6k.