MISTER AUTO

MISTER AUTO

Mister Auto is an e-commerce platform, available on both website and mobile application, where individuals and professionals can purchase car parts.

Mister Auto is an e-commerce platform, available on both website and mobile application, where individuals and professionals can purchase car parts.

ROLE

UX/UI Designer

DURATION

2 months

GOAL

Reduce user drop-offs

How it works

After selecting the car part that matches their vehicle and meets their needs, users proceed to checkout. First Review the order, adjust quantities if needed, and apply any promotional codes. Second, Select a delivery method. And Finally Choose a preferred payment method to complete the purchase.

After selecting the car part that matches their vehicle and meets their needs, users proceed to checkout. First Review the order, adjust quantities if needed, and apply any promotional codes. Second, Select a delivery method. And Finally Choose a preferred payment method to complete the purchase.

Main Goal

Because the checkout process involves a lot of information, our goal was to create a clear hierarchy that would guide the user smoothly through each step, helping them make the best choices for their needs without confusion.

Because the checkout process involves a lot of information, our goal was to create a clear hierarchy that would guide the user smoothly through each step, helping them make the best choices for their needs without confusion.

Roadmap

Pain Points Identify

Complicated

The existing checkout flow lacked simplicity, making it difficult for users to complete their purchase.

Choose delivery option

Users struggled to select a delivery option and clearly understand the differences between the available choices.

The original checkout flow was overly complicated, especially when it came to the many delivery options available. Users found it difficult to understand the differences, so our challenge was to clarify the process and guide them toward the best choice for their needs.

Wireframe

After analyzing user pain points and studying checkout flows on other websites, we designed a wireframe to illustrate a more streamlined and intuitive checkout process for our users.

What we did

We clean the basket to have something simple to identify which product that match a a specific car, was in the basket.

Then on the other step of the check out process we use different element to make it easier for the user to choose which delivery process is better for him, by exposing clearly the options and the prices.

And finally on the last step for the payment that is a important step on the process because of the money aspect we simplify the flow and visually make it clear the different option of payments.

Final Mockup

Our goal was to make the flow simpler and shorter while still meeting all requirements. Instead of simply removing pages or overloading them with text, we focused on visual clarity, using images, icons, and short tutorials. This approach gave first-time users an immediate understanding of how the process worked.

Results

Simplified Checkout Flow

By the end of the project, the simplified checkout flow allowed users to complete their orders more easily and confidently.

Increased Order Completion

This improvement was reflected in a noticeable increase in completed orders.

Reduced Customer Support Requests

There was a reduction in customer service inquiries related to the checkout process.

Fully Responsive Improvement

These improvements are fully responsive, enhancing the checkout experience for users on both mobile and desktop devices.

Next Project

Next Project

r.margx@gmail.com

Copyrights by Margaux Rol

r.margx@gmail.com

Copyrights by Margaux Rol