Luxury Retail

e-Commerce Redesign
for Luxury Retailers

NYC/Remote

As a freelance UX Designer for Publicis Sapient, I worked with a small team to redesign the e-commerce website of a luxury retail client.

  • Role: UX Research and Design
  • Industry: Luxury, Retail

decorative image for luxury retail

Publicis Sapient

Business management consultant

Publicis Sapient defines itself as a “digital business transformation company”. There are offices in North America, the Asia-Pacific region, Europe, and the UAE. Its headquarters are in Boston, MA.

Client Profile

The retailer is a multi-national, luxury fashion holding company. The three company brands specialize in luxury fashion retail, including shoes, handbags, and accessories.

Woman shopping for high-heeled shoes
A case of men's watches
A case of men's watches

Redesigning the e-Commerce Experience of a Luxury Retailer During a Planned Backend Migration

Screen shot of Baymard Institute website

E-commerce best practices from Baymard Institute. View more about this project in the deep dive, below.

The migration would impact 2 other sites so UX solutions needed to work for 3 sites in total. The solutions also needed to be ‘mobile first’.

I worked on a team implementing solutions in two phases. First conducting UX research. Second designing solutions.

2 Project Phases:

  • 1. Conduct UX Research on e-Commerce Best Practices

    In phase 1, I gathered e-commerce best practices from sites like Baymard Institute (left) or NNG.com.

    I also created a prototype to explore solutions to a specific design problem.

  • 2. Design Solutions in Sprints

    In phase 2, I created wireframes and workflows. These addressed specific product requirements and solved design issues identified in phase 1 or by product teams.

    The best practices identified in phase 1 helped influence the design choices in phase 2.

Phase 2: How Initiative and Collaboration Helped Build a Design System

In phase 2, the client surprised the team with a request for a design system, including a prioritized list of components. But there was some confusion with the naming convention, which made it difficult to get started.

My knowledge of design systems comes from hands-on experience, such as using tools like Bootstrap or Tachyons. When I saw the list, I started thinking about how design systems work: basic components that can be recombined in increasingly complex ways.

Using Sketch, I combined titles, backgrounds, buttons, placements, etc. The goal was to show how even the most complex component could be created from combinations of individual elements — as long as they obeyed certain functional rules.

After creating a few examples of different components, I shared my document internally with the team.

The team found it helpful. I added a few more examples from the client's list, before passing it off to the visual design team. They used the file as a kernel to build further with fonts, images, and other styles.

It turned out to be a very collaborative moment in our project. At the end of the sprint, we presented our concepts together to the client.

Bootstrap framework

Bootstrap

Tachyons framework

Tachyons (This site is built with Tachyons.)