A redesigned checkout funnel, from add-to-cart to payment

Les Raffineurs sells gifts and workshops to give as presents. Each order requires gift-specific information: wrapping per product, a note for the recipient, delivery of an experience by email or post, shipping or in-store pickup.

An add-to-cart popup that covered 40% of the screen on desktop and 90% on mobile, with no visible confirmation of the click, followed by long, wordy forms. The challenge was to keep all the information needed for the gift while reducing the number of clicks.

1. 1

   Confirm without interrupting

   A micro-animation on the buy button, then a side cart panel showing the whole cart, the free shipping threshold and complementary products.

2. 2

   Group the gift choices together

   Wrapping toggled product by product, a single note for the whole order, email or post for experiences, pickup method visible right from the cart.

3. 3

   Lighten the checkout

   Guest checkout by default, compact fields with address autocomplete, newsletter kept separate and a continue button always visible.

• 4 stepsfrom cart to payment, instead of one long page
• Mobile and desktopdesigned together, thumbs included
• 2collective members: Romain and Thomas

A checkout where buyers see at every step what they are giving, how, and for how much.

• 
  Romain PeltierUX research, journeys and checkout mockups
• 
  Thomas ThévenetMobile and desktop interfaces, add-to-cart micro-animation

Screens reconstructed from the brief and our 2021 mockups.