Cart & Checkout Discovery in E-Commerce

Packaging Industry | Sr. UX Researcher

Tools Used: Miro | Microsoft Teams | Qualtrics

Overview

The primary purpose of this study was to gain a deeper understanding of the specific areas where our users are experiencing friction during the purchasing process. By identifying these pain points, we aim to enhance the overall user experience and streamline the journey from selection to purchase.

Research Methods

  • UX Audit | A process used identify UX flaws, inconsistencies, missed edge cases, confusing copy and areas that research may be beneficial.

  • Secondary Research | Best UX practices for E-Commerce checkout experiences were examined and shared with the team.

  • User Interviews | A total of five user interviews were conducted in which users were asked a variety of questions related to the full cart and checkout process.

  • CX User Survey


UX Audit | My Process

For this research, I carefully analyzed the cart and checkout user experience. Before sharing my observations with the team, I gathered each screen and scenario in Mural for a detailed look. I’ve highlighted a few key areas I examined below.

UX Audit | Identified UX Improvement Opportunities

In summary, I was able to identify areas of improvement related to the following. Due to company privacy, I can only share these audit results at a high level but can speak to them further if requested. Addressing these areas will lead to a more intuitive and seamless user experience, contributing to higher satisfaction and conversion rates.

Shopping Cart and Checkout Pages

  • Visible Information | Increase the amount of visible information before the need to scroll. This can enhance user engagement and streamline the shopping experience.

Step Content Alignment

  • Visual Proximity | The specified step and corresponding input should be visually closer to minimize cognitive load for users navigating the cart and checkout process.

Duplicate Place Order Buttons

  • Reduce Redundancy | Evaluate the necessity of multiple "Place Order" buttons to streamline the checkout process.

Freight Eligibility

  • Clarity and Understanding | The current freight eligibility information is confusing. Simplify the user interface to clearly indicate how much more must be added to qualify for free freight.

Payment Method Location

  • Fixed Positioning | Maintain a consistent location for the Payment Method section between the Shipping Methods and Review & Payment steps to avoid user confusion.

Copy Inconsistencies & Repetition

  • Terminology Variations | Address inconsistencies in terminology, such as "Shopping Cart" vs. "My Cart" and "Quantity" vs. "Qty". Consistent language helps to eliminate confusion.

UX Banner Notifications

  • Consistency Issues | Review and standardize the size, color, and messaging of UX banner notifications to ensure a cohesive experience.

Date Picker UI

  • Improved Usability | Reassess the design of the date picker component to enhance clarity and user experience.

Checkbox Component & Asterisks

  • Correct Usage | Review the use of checkbox components to ensure they are used in the right context. Additionally, ensure that asterisks are only used to clearly indicate which fields are optional and which are required.

Modal Sizes and Font Selection

  • Uniformity in Design Elements | Ensure that modal sizes and font selections are consistent across the platform to create a polished look and feel.

Cart and Order Summary UI

  • Visual Consistency | Standardize the UI between the Cart Summary & Order Summary components, including elements such as font weight, spacing, and size.

Promo Code Functionality

  • Consistency in Behavior | Ensure that promo code copy, alerts, and behaviors are consistent across all relevant pages.


Secondary Research | UX Best Practices for Checkout

  • CTA buttons | CTA buttons help guide users on a website or app. Make sure they are easy to see and near related information. Research shows users pay attention to the top corners, so place buttons there for better visibility and clicks. Use contrasting colors, clear wording, and good spacing to grab attention and improve navigation.

  • Copywriting | Use the same terms for checkout fields, like “Credit Card Number” instead of “Card #.”

  • Required Fields | Clearly mark required fields without using asterisks.

  • Field Validation & Errors | Validate all input fields and show errors consistently, such as turning required fields red if they are blank.

  • Pickup vs. Shipping | Show the benefits of choosing "Pickup," like potential savings.

  • Simplify the Process | Let customers return to finish an order later easily.

  • Delivery & Shipping | Clearly present delivery options.

  • Cost Transparency | Make all costs clear, including hidden fees, to prevent cart abandonment.

  • Timeline Transparency | Clearly inform users of expected delivery times.

  • Help & Support | Offer easy access to timely assistance through phone, live chat, etc.

  • Promo Codes | Clearly show where to enter promo codes at checkout.

  • Minimalist Experience | Keep the layout clean and straightforward.

Useful Resources | How to Create the Perfect Checkout Experience in 9 Simple Steps / How To Improve Ecommerce Checkout: 14 Tips / Checkout UX: Designing the Experience Your Customers Deserve / Checkout UX Best Practices 2024 — Baymard Institute


User Interviews | Customer Demographics & Overall Feedback

A total of five customers who are actively involved in the protective packaging industry took part in this study. The roles that were represented in this research included individuals from both purchasing and management sectors, highlighting the diverse perspectives within the industry.

The onboarding experience is good but customers feel that we are forcing them to use the platform.

Although most customers expressed that their experience onboarding to the e-commerce purchasing platform went smoothly and without major issues, several customers still felt that the transition from traditional offline ordering to using the platform felt somewhat forced and often led to frustration; this was particularly true since it required the customer to engage in repetitive work when placing their orders, which did not align well with their previous, simpler ordering methods.

“But most of my conversations have been with [customer service] and how cumbersome we feel the system is and the response was essentially, it is what it is, this is the direction that [the company is going in and we have no choice but to use this portal.” - Customer

“Well for me using a purchasing system here, I guess my upfront thoughts were that it’s redundancy but I’ve gotten used to it. I enter it out on my system, it allows me to print it out and just use it as a cheat sheet… I guess you know to enter into your system.” - Customer


User Interviews | Buying Trends + Feedback on Cart & Checkout

Choosing the right items to buy and completing the purchase.

  • Overall, most customers felt that the process of adding items to their cart was quite straightforward and easy to navigate.

  • 100% of customers reported that they copy material numbers from their ERP systems to add products to their cart rather than searching by keywords. They also suggested that integrating with ERP systems could reduce repetitive tasks, such as importing their purchase orders to auto-fill some content.

  • 60% of customers said that they only complete purchases when they qualify for prepaid freight.

    • “There's very few times that we're going to purchase without prepaid freight.” - Customer

  • 60% of customers said that the estimated lead times highly affect what and when they order. For higher lead times vs. lower ones, customers often reach out to customer service requesting partial shipment. If items are not partially shipped, users expect the estimated delivery date to be based off of the higher lead time item(s).

  • 60% of customers indicated that they would prefer to reach out to sales representatives and/or customer service for assistance when searching for new products, rather than simply browsing through our Product Catalog on their own. This preference highlights the importance of providing accessible support and guidance to facilitate their purchasing decisions.

    • “… I think some of the biggest problems I find when I'm using it, especially since I'm not as familiar with all the product lines and buying everyday is sometimes really finding product…” - Customer

  • 60% of customers use the delivery appointment option when ordering. Additionally, all customers said it would be helpful to save a delivery appointment contact as default, so they don't have to re-enter the same information each time.

  • 100% of customers expect to be notified by email about delayed deliveries, and 60% also expect updates from the shopping platform.


User Interviews | Customer Confusion with Cart and Checkout

  • It’s important to note that 60% of customers found our freight eligibility interface confusing and unclear when trying to understand what the additional cost or materials needed was to qualify for prepaid freight. Customers also found the use of percentages in the interface unclear and confusing.

  • 80% of customers found the "Load Last" option in their cart confusing and unclear. One customer even thought it meant his selection might be short or that we would send extra if there was space in the truck. Note that the current interface forces customers to make a selection vs. defaulting to one.

  • 60% of customers had difficulty locating the “Clear Cart” option.


User Interviews | Identified Customer Service Touch-points

  • A customer might have ordered the wrong amount of a material and needs assistance changing their order.

  • A customer needs to request a delivery date that was not available to select on the platform when placing the order.

  • A customer may need to confirm that a product is in stock before ordering.

  • A customer has an overfilled truck & is unable to select Prepaid Freight without having customer service do it manually for them.

  • A customer tried searching for a product that is not available on purchasing platform for a variety of reasons; one being that it hasn’t been purchased within the last 12 months.

  • A customer may need to request we add a new “Ship to” aka delivery address to the platform to purchase materials for their end customer.

Many users often need offline assistance, as seen by their regular use of the platform's note feature.

At the time this study was conducted, the purchasing platform allowed customers three chances to share extra information during cart & checkout. They could enter details in Shipping & Delivery Notes, Customer Service Notes, and General Notes before placing their order(s). Although these note fields allowed customers to provide clarification, they also increased the workload for customer service since each note had to be reviewed post customer purchase. Stakeholders requested clarity on which note fields were most important and/or utilized most often.

  • 80% of customers said they utilize the Shipping & Delivery Notes.

  • 60% of customers said they use the Customer Service Notes.

  • 0% reported using the General Notes. *As a result the General Notes was removed shortly after this study.


CX User Survey Insights | 21 Total Responses

When evaluating user experiences with MySEE compared to other purchasing platforms, the feedback indicates a varied perception of usability.

  • 43% of customers found the purchasing platform to function similarly to other e-commerce platforms, suggesting a level of comfort for many.

  • 38% of customers reported that they found the purchasing platform more difficult to navigate, indicating room for experience improvements.

  • 19% of customers reported that they found the purchasing platform much easier to use.


Recommendations for Improving the Cart & Checkout Experience

  • Multi Add to Cart Functionality | Allow customers to copy and paste multiple material numbers when adding items to their cart.

  • ERP Integrations | Integrate with popular ERP systems to reduce workload duplication.

  • Provide clarity on why products may not appear if they haven't been ordered in the past 12 months; this message should be displayed during searches.

  • Delivery Appointment - Default Contact | Let customers save a default contact for delivery appointments during checkout.

  • Improved Communication regarding Est. Lead Times | Improve communication both within the platform and offline regarding estimated lead times. By doing so, we increase customer trust in our product and reduce confusion and frustration when customers speak with customer service.

  • Improved Communication regarding Delayed Shipments | Enhance communication about delayed shipments and their reasoning, including adding notifications to the platform.

  • Simplify the Freight Eligibility UX | Simplify the freight eligibility interface to provide clarity on what it takes to qualify for prepaid freight.

  • Increase size of the “Clear Cart” | Increase the size of the "Clear Cart" button and position it according to user experience standards.

  • General Notes | Remove the General Notes option.

  • Simplify Load Last | Consider defaulting one material in the customer’s cart as the “Load Last” selection vs. forcing the user to choose one. Instead, we can state in a top level banner that the user can select another material if they’d like to update.

  • Improve Customer Assistance Lead Time | Ensure customers receive timely assistance, especially since some may feel forced to use the platform.