Yoox Net-a-Porter

Tasks
Research, UX, UI, User retention

After Yoox acquired Net-a-Porter and its sub brands, there was a major project to migrate them all onto one unified platform. As part of the commerce team, I have worked on re-designing the My Account section, Shopping bag and Checkout journey.

Goal

The objective was to create a unified design journey across all brands and deliver a fully responsive application that provides an intuitive user experience. This involved working closely with business, analytics, delivery logostics, and the development teams in London and Italy.

Old design

Wireframe

We created a modular block style for each product which allows for responsiveness. We also stress tested for a variety of scenarios including multiple price reductions, shipping restrictions of products across different countries and communicating Out of stock products clearly.

New designs

It was important to create clear error messaging, with icons and colour to convey the action the user needs to take.

The new Shopping bag was intuitive and responsive, which allows for less friction on smaller screens with clear messaging and interactions.

Sold out items are clearly communicated, removed automatically from the main basket, placed in a section for the user to review. This help the user to focus on completing the journey.

Error messaging

Checkout

Challenge

The checkout experience doesn’t reflect YNAP’s luxury brands. The design is dated, it is not intuitive and the mobile design is not responsive which results in many users not completing their purchase.

Goal

Create a unified and fully responsive application checkout experience across all brands, with clear simple steps and feedback messaging.

Old design

  • Not responsive for mobile, the text is shrunk and too small to read

  • Unclear steps on web, there is a stepper at the top and numbered steps down the page

  • No stepper on mobile, so users don’t know how long it will take

  • Check out form is not optimised

Designs concepts

Using the mobile first approach we created a simple 3 step modular process that is responsive.

Final Designs

Please be aware this page is not linked on the main home page