American Tire Distributer

Cart & Checkout

UX Design Consultant
March 2021 - present

CLIENT BACKGROUND

American Tire Distributors (ATD) is one of the largest tire distributors in America. They have several digital products that are used by their customers to sell tires and manage their tire shops.

OPPORTUNITY

In 2021, ATD set out to enhance their digital experience. They teamed up with DMI to rethink their online and mobile experiences. This led to the creation of their ATD mobile app and ATD Pay app, and the complete redesign of their ATD Online experience. While revamping their online experience, some areas of focus were a cleaner search function, proper product listing pages, and a modernized checkout experience. This project required continuous collaboration between Product Owners, stakeholders, and the UX team.

ATDO Cart & Checkout

CHECKOUT EXPERIENCE

Initially this project started because the business decided to allow users to start using credit cards to pay for their purchases rather than billing to their account. The business saw this as a simple ask, but adding a UX lens, we were able to identify additional areas of impact to the larger system. To accommodate a good experience, the scope increased to allowing users to add credit cards to their account, add them during the checkout process, set default cards, and more.

Screen Shot 2023-05-16 at 8.07.56 PM.png

Understand - Define, Explore, & Ideate

NEW REQUIREMENT

A new business requirement came in that we needed to allow users to use a credit card to make purchases through ATD Online. Previously when a user checked out, they would get billed to their account and have to pay it off later. The new requirement asked that the UX team look at allowing users to add credit cards to their account.

CREATION OF USER FLOWS

Started by creating a flow to gain understanding of how it would work on the account level, and also how the user would be able to do it during the checkout process.

These first explorations of adding credit cards are what lead to us proving that we needed to take a deeper dive into our checkout process. It was a poor experience as is, but adding another element to the process pushed it into another level of outdated, clunky, and just a bad user experience.

ALIGNING WITH PRODUCT OWNERS

Working with Product Owners, we all agreed that the cart and checkout process needed to be looked at deeper for a better user experience. I created user flows for the cart and checkout process, which now included the ability to use credit cards.

Screen Shot 2023-05-16 at 8.16.26 PM.png

Wireframing

IDENTIFYING DESIGN NEEDS

How might we handle users checking out with a credit card and be able to save them during the process?
How might we allow users to switch their payment method during checkout?
How might we handle shipping and delivery information?
How might we design the flow so it’s fast yet efficient for the users?

DESIGN ITERATIONS

Benchmarked ecommerce platforms to inform our designs for wireframe iterations.
Created low fidelity wireframes to iterate on designs and ideas.
Narrowed down ideas and create high fidelity screens.
Met with Product Owners to review and align on a solution.