Free People Redesign

Company

Free People

My Role

Interactive Designer

Duration

3 Months

The Problem

Free People is a retailer offering apparel, beauty, and home goods to young women worldwide. With the increase in shopping trends on smartphones in the early 2010s, we started seeing a rapid spike in mobile traffic to the site, and while engagement on the desktop site was high, customer satisfaction with the mobile site was very low. In addition to apparent usability issues on the mobile site, customers converted at a much lower rate on mobile than they were on desktop.

The Goal

Our objective was to make much-needed UI updates to the m-dot site experience, drive engagement, and improve conversion rates while a larger site re-platform effort was underway.

Our objective was to make much needed UI updates to the m-dot site experience, to drive engagement and improve conversion rates while a larger site re-platform effort was underway.

The Process

I tackled this project with a three-step process that allowed me to stay organized and within scope. Using research insights from a usability study done by Think Company, along with a site audit I led, I was able to identify problem areas that needed to be addressed in this redesign.

Site Audit

Identified issues using common UX patterns as guiding principles

Analytics

Worked with analytics team to gather data and validate assumptions

Worked with analytics team to gather data and validate assumptions

Worked with analytics team to gather data and validate assumptions

Worked with analytics team to gather data and validate assumptions

Worked with analytics team to gather data and validate assumptions

Design & Prioritization

Helpfulness

Created designs and partnered with product team to prioritize features

The Solution

Design Exploration

Design Exploration

I refreshed the mobile site's overall visual design using a brand new style guide established during a recent rebrand. I also made minor yet critical UI/UX updates on key pages of the shopping experience.

I refreshed the overall visual design of the mobile site using a brand new style guide established during a recent rebrand. I also made minor yet critical UI/UX updates on key pages of the shopping experience.

Site Navigation

The navigation was not globally accessible, it existed only on the site's homepage. This meant that as users went deeper into the experience, they would have to click back to the homepage to access the main nav. Not only was this a very tedious experience for the user, but it also didn’t follow common UX patterns. Additionally, the search bar was a prominent element on the page, taking up valuable real estate.

To solve this, I collapsed the site navigation as well as the search bar into a globally accessible hamburger menu.

Product Browse

Customers generally struggled with browse pages because it took them a really long time to find what they were looking for. The primary reason for this was the lack of filtering options, with customers having to browse through hundreds of products.

Another miss was the lack of visual indicators for multiple colorways on products, causing customers to have to click into the product detail page to find whether an item came in different colors or not.

Product Details

One of the biggest problems on this page was the CTA button pattern. The CTA was red, a color that wasn't part of the brand and usually signifies danger, so  I decided to change the color to the Free People pink.

Additionally, we saw that customers were frustrated when adding an item to their cart without making one of the required selections. There wasn't any indicator that would prompt them to make a selection before adding to the cart.

Lastly, color and size selections relied on a dropdown menu, which was an unusual UI pattern for an e-commerce experience. I decided to use a radio-style pattern for these selections.

Additional Pages

Additional Pages

Additional Pages

As part of this work, I also redesigned the rest of the m-dot experience with the updated brand styles, creating a consistent experience between the desktop and mobile sites.

Free-People-Additional-1-1
Free-People-Additional-2-1

Seeing Results

Updating the mobile site's look and making some minor UI adjustments proved to be worth the effort while we worked on the complete site re-platform. Not only did customers express satisfaction with the new look, we saw an increase across product detail views, add to cart, and checkout rates.

Updating the look of the mobile site and making some minor UI adjustments proved to be worth the effort while we worked on the complete site re-platform. Not only did customers express satisfaction with the new look, we saw increase across product detail views, add to cart and checkout rates.

+32%

PDP Views/Sessions

+21%

Add-to-Cart Rate

+9%

Checkout Conversion