ariat-bag-checkout.jpg

Ariat.com My Bag & Checkout


Home / Ariat.com / My Bag & checkout redesign

Ariat.com My BAG & Checkout redesign

One area of Ariat.com I was chomping at the bit to redesign was the My Bag & Checkout experience. I created a new experience for both the Ariat International US site as well as the Ariat Europe sites.

What was I trying to solve?

  • Better usability through the My Bag and checkout process

  • Incorporate cross sells and products that are on top-of-mind for our customer (Saved for Later)

  • Modernizing the overall look and feel of the checkout process (best practices)

  • Reducing the amount of clicks it takes the user to get through checkout, which will theoretically increase AOV

  • Force customer that enters an email registered in our system to sign in to their account so their purchase history is kept together (today using a pre-existing email and not signing in doesn’t automatically add the order to the user account)

  • Push for the customer to create an account, not required, but having the option to add a password at any step of their checkout process may increase our customer database and retention for those customers

  • Give a clearer understanding of split shipments to set the expectation that an order may not come all at once

  • Need to make payment options more transparent and scalable for the customer so they know what to expect when selecting an option

  • Increase visibility on AfterPay/Klarna/etc. 

  • Incorporate a scalable experience for the implementation of a membership experience in future iterations

  • Make mobile My Bag & Checkout experience as streamlined as possible for a more seamless transaction

  • Make wishlist more integrated into My Bag to keep at top of mind for the user.

Research: Competitor research

After doing extensive research on both competitors and non-competitors to get a baseline of what needed to happen in order to increase usability and conversion of the site, I identified some key takeaways of what must be included, at a minimum, in the redesign of the My Bag & Checkout Experience:

  • My Bag:

    • Include simple shipping delay messaging with a link to our delivery details

    • Allow user to edit the products they’ve added to their cart (size, color, etc.)

    • Allow the user to move product to a Saved for Later list

    • Incorporate Saved for Later list in My Bag to keep products the customer is interested in accessible at all times

    • Include relevant cross sells on My Bag

    • Allow users to enter promo - make sure it’s visible and not easily overlooked

    • Maybe include link for users to check gift card balance? (this can be done in an overlay so they don’t leave the page or site)

    • Include Order Summary

    • Allow user to checkout as a guest

    • Include PayPal button

  • Checkout:

    • Keep all the steps of the checkout process clear and concise

    • Include Order Summary

    • Include a clear way for customer to use gift card and allow for a gift message

    • Add in military discount option

    • Include clear delivery options and any shipping delays

    • Remain transparent on delivery timelines and average time in which they should expect their order to ship

    • Include order summary for the customers to validate their order prior to submitting

    • Include any disclaimers to help ease any questions the customer may have after they place their order

Measurement of Success:

  • Increased conversion from My Bag redesign by 5.99%

  • Increased customers to continue shopping and having a higher average order value (AOV) by 47.06%.

  • Customer signups increased by 150% in the first week of launch. This was attributed to the email step within checkout.

Functionality:

  • Allow customers who already have an account to be alerted to sign in, vs. today’s experience where a recognized email address doesn’t force a customer to sign in, which makes the order they placed in the signed out state not pair up with the email address

  • Allow customers to create an account through various touch points of the My Bag and Checkout experience

  • Display shipping thresholds for signed in and signed out members

  • Incorporate a step-by-step checkout experience that funnels the customer seamlessly to fully checkout

  • Display a signed in experience that shows the discounts and membership benefits, as well as a signed out state where it promotes the member benefits and allows for the customer to sign up from this screen so we don’t take the customer out of the checkout funnel

 

MOBILE
LEFT: BEFORE | RIGHT: AFTER

VIEW MOBILE PROTOTYPE
(OPENS ADOBE XD EXPERIENCE IN NEW TAB)


DESKTOP
LEFT: BEFORE | RIGHT: AFTER

VIEW DESKTOP PROTOTYPE
(OPENS ADOBE XD EXPERIENCE IN NEW TAB)