Estée Lauder Cart — Paige Walker

UI CART DESIGN / ESTÉE LAUDER CANADA

Cart design concepts for UI of Estée Lauder Canada. Utilizing transition to a new platform where a lot the information can be moved to checkout, we took this opportunity to explore how to elevate Estée Lauder brand to be cohesive with the luxury brand that has long been established. Considering Estée Lauder as one of the pioneers of the Gift With Purchase (GWP) feature, explored how to display this more prominently in cart, as well as when there are multiple tiers of gifts to claim.

ELEMENTS THAT CAN BE MOVED FROM CART TO CHECKOUT:

Donations
Gift Wrap / Message
Shipping Options
Shipping Info Notes
Fulfillment
Our Guarantee
Help Links
Express Payments

REMAINING OR ADDITIONAL UI ELEMENTS TO EXPLORE:

Free Shipping Threshold Bar
Gift With Purchase
Loyalty
Product Cards
Engraving Details
Samples
Cross-sells
Promo Code

UI EXPLORATION OF CART COMPONENTS

GIFT WITH PURCHASE STANDALONE

Unqualified

Qualified

GWP Added

COMBINED GWP + FREE SHIPPING BAR WITH TIERS

COMBINED GWP + FREE SHIPPING BAR (UI OPTIONS)

PRODUCT CARDS

Showing various explorations of product card UI design, including treatment and placement of items such as price, engravable items, Subscribe & Save, and removing items from cart.

CROSS-SELLS

Due to the long length of Estée Lauder’s product titles, it was a challenge to fit all elements in cross-sells without distracting from main product cards of items in cart. Tested one of their best-selling and longest product titles, along with different product types (sized vs. shaded). Explored different treatments of Add to Bag (ATB) to accommodate the longest product titles (such as Plus Icon instead of button or button combining price and ATB), as well as various layouts (carousel vs. stacked).