Перейти к содержимому

napolke. B2B marketplace web platform

Shopping cart

Full rework shopping cart UX and UI
with AI ordering features. Created based on business analytics and metrics.
Platform:
web
Year, duration:
2024, 8 weeks
My role:
Product Design, UX research
Team:
Product Designer (1), Manager (1), Developer (2)

na_polke — a wholesale marketplace for independent retailers and HoReCa.
The shopping cart and checkout are key pages for the customer and the service.

Problems and research

In a B2B marketplace cart, products from different suppliers are grouped into separate orders per supplier for checkout.
User can check out all orders at once or individually, proceeding with each as it becomes ready for finalization.

10-12 orders

from different suppliers in Cart

2-3 orders

on average are ready for checkout

7-8 items

on average per order
Shopping cart old version
Problems with the old cart version:
  • No navigation: This made it difficult to find a specific order in the general list.
  • Confusing sidebar: It duplicated a preview of all orders, leading to user confusion due to information overload.
  • Unclear checkout process: Not all users understood how to proceed with a specific order.
  • Cumbersome 4-step checkout flow: The sequence «Cart -> Order Details -> Organization info -> Order Confirmed» had too many steps and poorly structured information, resulting in a high cart abandonment rate.

Implementation

To address these issues, the following solutions were implemented:

  • Introduced order navigation tabs with status indicators (Ready / Not Ready).
  • Added a view toggle for the cart (grouped by order or by readiness).
  • Redesigned the order card for better readability and structure.
  • Updated the sidebar to show only orders ready for checkout, eliminating clutter.
  • Developed the auto-reorder feature.
  • Added onboarding for the updated cart interface.
  • Streamlined checkout by merging the second and third steps into one and restructuring the information flow.
Shopping Cart navigation
The order card now features a new row with order information in cards, a new product list structure, and an updated summary.
Order’s card
Sidebar become lighter to read, it is have a new order’s preview cards with dropdown info.
Sidebar
User has only 1 step to enter all the information in the personal blocks.
Sidebar

Finalization

final variants
The final cart redesign led to significant improvements in key performance indicators:
  • 17% reduction in cart abandonment (completed within one week).
  • 12% increase in users proceeding to the second checkout step.
  • 21% increase in users completing their purchase within 24 hours.
  • 36% of users engaged with the onboarding in the first month, contributing directly to these metric improvements.
back to projects
Let’s make
something great
hello@maaxdsgn.com
linkedin
telegram