True & Co Checkout. UXDi Student Project
Upcoming SlideShare
Loading in...5

True & Co Checkout. UXDi Student Project



Student project for General Assembly's User Experience Design Immersive program. ...

Student project for General Assembly's User Experience Design Immersive program.

We were tasked with improving the existing checkout flow to reduce the percentage of users abandoning the cart.

Designed by:
Jaclyn Leneé Anderson,
Phoebe Yang,



Total Views
Views on SlideShare
Embed Views



2 Embeds 96 95 1


Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment

True & Co Checkout. UXDi Student Project True & Co Checkout. UXDi Student Project Presentation Transcript

  • About True&Co True and Company is an online lingerie boutique that offers a free home try-on experience for their customers. Unlike department stores, users are sized for bras without the invasiveness of in-person measurements. Once the user completes a short fit quiz, a personal shop is created and they are given the opportunity to try before they buy. About the project As part of a student project for General Assembly’s UX Design program, we met with client True&Co to discuss real challenges they face in their business. True&Co was seeing a large drop off at step 2 in the checkout process. We were tasked with determining possible causes for this drop off and designed two solutions that best address those issues.
  • THE CHALLENGE True & Co is losing ⅔ of their customers in the final step of their checkout flow. Our goal was to optimize the process for their users in order to increase conversions.
  • Why do users abandon carts? • • • • Presented with unexpected costs! Return Policy hidden! Required to create account before checkout! Too many steps or clicks
  • Competitive analysis SOMA! " 2-step process (+)! " A Bold call-to-action draws the eye to the right to place the order, above the fold (+)! " Order is editable throughout the flow (+)! " Users may continue shopping throughout the flow (+) A A
  • Competitive analysis ADORE ME! " 1-step process is simple and may result in more conversions (+)! A" Return policy clearly stated under “place order” button (+)! " D Users are unable to edit/remove items in order summary (-) A E
  • Existing checkout flow WHAT’S WORKING! " 2-step flow! " Clicks are minimized! " A A Cart view after adding item shows up unobtrusively ! " Responsive website works well on mobile VIEW EXISTING SITE A A
  • User research findings ! " 20 users interviewed! Majority of users:! " 16 would like to edit items in cart before checkout! " 8 did not know upon first glance how many steps checkout would be! " 7 would like to checkout without registering for account! " 6 remarked on payment info being the first form fields (unusual) “I really like the idea of having a personal shop!”
  • “If I’m editing my cart and it takes me back to home page, I think there is a bug in the website.” “I always edit my cart before I checkout.” “(Step 2) looks like an order success page.”
  • Shopping cart (13 in. monitor)
  • Home try-on cart
  • DESIGN GOALS 1. Reassure users 2. Enable users to complete tasks easily
  • Suggested solutions " Provide the option to remove/edit things in the cart (on a separate page) before placing order! " Add reassuring message when hitting “Continue” on step 1 (“You will review your order details before placing your order on the next page)! " Show the cart summary clearly on each step of the process! " Move all call-to-action buttons and order details (shipping and billing addresses) above the fold
  • Proposed Solution 1: View cart " ! Easily remove unwanted items from cart! " Switch to home try-on if customer happens to be in ! “shopping cart” view ! " Option to review shipping and tax charges; prevent surprise upon seeing total charges. VIEW WEB PROTOTYPE VIEW MOBILE PROTOTYPE
  • Proposed Solution 2: One-Step A " A ! B " ! " Clear “place order” button above the fold! Reassuring messaging! 1-step flow minimizes clicks 1 VIEW WEB PROTOTYPE VIEW MOBILE PROTOTYPE B
  • THANK YOU Jaclyn Leneé Anderson | Phoebe Yang |