Unlocking Mixed Fulfillment Through Cart Consolidation
I led a redesign that moved fulfillment decisions directly into the Staples Print cart and checkout.
The previous flow relied on a separate upsell step before the shopping cart, which added friction and made it harder for customers to complete orders with different fulfillment needs.
By centralizing fulfillment logic in the cart and checkout, customers could manage different fulfillment needs, like shipping, pickup, or mixed-order delivery, within one transaction. The redesign reduced cart abandonment by 18% and created a more scalable pattern for handling complex fulfillment scenarios across the platform.
Category
E-commerce
Tools
Figma, UserTesting
HEAR THE STORY
Establish Financial Trust
Design for Systems Thinking
Humanize Complex Logistics
01
One Order, Many Ways
Redesigning the cart around how customers actually order.
The project started with a business decision rooted in customer reality:
People don't shop in one mode.
A customer ordering business cards for next-day pickup might also need posters shipped to their home.
The old flow
The existing flow forced customers to choose only one fulfillment method per order. So Staples took a business decision: Enable mixed-fulfillment orders and recover the conversion being lost at checkout due to a jarring "pre-cart" upsell page, driving a 22% drop-off at the most critical step.
Screenshot of old upsell page
Screenshot of old shopping cart
02
Benchmarking Complexity
Identifying industry standard interaction models.
I conducted a deep-dive competitive analysis of 6 major retailers like Walmart and Home Depot to identify how they handled "mixed mode" carts.
This research helped me define a mental model for Staples users: the "Item Level Agency" model, where users maintain granular control over each product’s destination without losing sight of the total order.
Screenshot of selected research questions in FigJam
Example of competitor analysis in FigJam
03
Navigating Constraints
Mapping a complex logic system
Because print products have physical constraints (e.g., large-format banners can't be picked up at all locations), I collaborated with two separate engineering squads and a Product Manager to map every edge case and restriction.
Scenarios
Interaction Exploration
To solve the "Mixed-Order" problem, I explored various interaction patterns to find the balance between density and clarity.
Global Model
Item Level Model
04
Iterative Refinement
Validating the flow through unmoderated testing
I used a mid-fidelity prototype to run unmoderated tests on Usertesting.com to see if the "Mixed Order" concept was intuitive.
Screenshot of prototype made on Figma
From Research Insights to Intentional Design
I synthesized the qualitative feedback from these sessions to identify structural friction points.
Problem
Iteration
04
The Final Mile
The Anatomy of a High Trust Component
I developed a modular fulfillment component that could be reused across the Staples ecosystem. At this stage, I focused on "Craft." For a payments visual hierarchy isn't just about aesthetics; it's about reducing the anxiety of commitment.
Real Time Feedback
When a user switches an item to "Store Pickup," the shipping fee is removed with a subtle animation, providing immediate confirmation of cost savings.
Color & Contrast as Signifiers
I used a specific color palette to distinguish between "Required Actions" (selecting fulfillment) and "Informational States" (pricing updates).
The Checkout Module for clear financial stettlement
The Order Summary was redesigned to be a "living receipt."
Grouped Itemization
I created a clear separation between product costs, shipping fees, and local taxes.
Zero-Distraction Payment
I refined the credit card entry fields with better auto-complete logic and non-punitive error states
06
Responsive Execution
Maintaining integrity across the full device spectrum.
Print solutions are often managed by busy professionals on the go. I ensured that the complex "Mixed-Order" toggles remained accessible on touch devices without cluttering the screen.
Usertesting sessions
07
The Impact
