Redesigning the Quick Order flow for dealers in a B2B platform—where speed, accuracy, and control are key to everyday operations.
Design Timeline
12 weeks (Sept'23 - Dec'23)
Team
3 UXDs + PM + UXR
My Role
Senior Product Designer
Research Synthesis, Design System, UX, Visual Design, Interaction Design, Prototypes & Hand-off
47% increase in Saved Order usage after making it more visible and integrated
+38 NPS score for the Quick Order flow (compared to -4 in the previous version)
Fewer support queries related to repeat orders and credit info
1
Identifying products
Adding them to the cart
Proceeding to checkout
Lets analyze the naming of tires
Each product was represented as a card, and every time a new item was added, a new card appeared at the bottom of the list.
One Card, One Action
Dealers could search and add one product at a time. Once added, the product moved to the cart, clearing the card for the next input.
Separation of Concerns
To streamline the UI, we removed quantity and price details from the input card and moved them to the cart review page.
Centralized Review
All added products were consolidated in the cart, where dealers could review the complete list, check quantities, view a price breakdown, and proceed to checkout.
1
Adding product were cumbersome
34% of users found the product entry screen confusing.
The complexity stemmed from multiple dropdowns and toggles within the card, which created decision fatigue during a task that users expected to be fast and straightforward.
2
Frequent Cart Check
60% of users regularly opened the cart mid-way through ordering.
Why? To avoid duplicate orders. Users lacked visual confirmation of what was already added, which disrupted their flow.
3
Saved Orders Were Often Missed
68% of users didn’t notice the existing “Saved Orders” feature.
However, 84% responded positively to the idea of integrating Saved Orders within the Quick Order experience.
4
Credit info at the check out
One user explicitly asked to see credit information (e.g., credit limit, outstanding dues) at the time of checkout
When asked, most users reacted positively—highlighting how financial context helps them make faster purchasing decisions.
Users Land on the Cart Page First Dealers now land directly on an empty cart—setting the expectation that everything starts here.
Prominent Call-to-Actions to Add Products
We introduced clear, high-visibility CTAs for adding products via search or from saved lists. This reduced ambiguity and improved task flow.
Saved Orders Integrated Upfront
Given that 68% of users previously missed the Saved Orders feature—but 84% found it valuable when surfaced—we gave it prominent placement in the empty cart state. This allowed users to:
Import saved lists directly into their cart
Combine saved orders with new ones
Save time on repetitive purchases
With over 182+ size options, we prioritized a search-first experience.
For those who prefer browsing, the list is arranged in ascending order of tire width to support pattern recognition.
Dealers often identify products visually before reading names.
We leveraged product illustrations to aid recognition, speed up selection, and reduce reliance on text-heavy UI.
The use of actual product visuals at this step helped reinforce the selection, reducing errors and potential returns.
Dealers could quickly add quantity using a stepper or type it in directly for speed.
A lightweight confirmation displays:
Selected product
Quantity
Total price
Quick inline editing tools allow users to adjust quantity, change patterns, or remove items before checkout—without disrupting the flow.
Dealers can:
Create a Saved Order for future use
Load an existing one to save time on repeat purchases
A visible credit summary—pulled from their account—helps dealers make financial decisions in context, without needing to navigate to a different section.
Dealers can now review:
Full line items
Pricing breakdowns
Credit balance
And proceed to place their order with confidence.
Upon placing the order, the dealer receives a confirmation screen with Order ID, which they can easily copy and share with sub-dealers or for future reference.
Progressive Disclosure
We minimized cognitive load by only showing what’s necessary at each step.
Constant Visibility
Dealers can always see and manage what’s in their cart.
Supports Dealer Workflow:
The interface mirrors the real-world behavior of building and finalizing a list step-by-step.
Single-Page Flow Feel
The cart and product add experience live in the same interface, eliminating the back-and-forth between pages.
Reduced Friction
By combining add + review into a single space, we reduced complexity while increasing control.
47% increase in Saved Order usage after making it more visible and integrated
+38 NPS score for the Quick Order flow (compared to -4 in the previous version)
Fewer support queries related to repeat orders and credit info
Replicating the "to-order list" to cart was still time consuming
Design for the Expert User
This project reminded me that in B2B workflows, users are often power users who value speed, clarity, and control over aesthetics or exploration. Designing for their efficiency meant minimizing unnecessary UI and honoring their existing mental models.
Real-Time Feedback Builds Confidence
Allowing dealers to see their cart update in real-time without navigating away gave them a strong sense of control and reduced order errors.
Progressive Disclosure Reduces Friction
Showing only the necessary inputs at each step helped reduce overwhelm—especially important when the system has large data sets (like 180+ size options).
Surface Features Based on Context, Not Hierarchy
“Saved Orders” was a useful feature, but it was being missed because it was tucked away. By bringing it forward in the flow where it mattered, adoption increased significantly.
Small Tweaks Can Unlock Large Impact
Adding credit wallet info at checkout—a seemingly small change—helped dealers make faster decisions and reduced their need to check another system mid-order.
Download Resume