Bustle Shop
Redesign

Redesigning the shop experience.

Bustle has a unique shopping experiences with an in-article checkout experience. The user is able to shop through an article – add to cart and check out, all without leaving the site. Instead of clicking out to multiple retailers, you can shop all of the products you see right within the article you’re reading. Orders are processed through a third party partner to provide a seamless shopping experience.

redesigned product detail page
The old product detail page

Problem

Because we were working with a third party partner, initially there was little oversight on how images and information were being populated.

  • Product images are too big, and often cannot see the entire product

  • Product info get too long, and unorganized

  • Variant Picker isn’t always the best experience

  • CTA is not visible

Research

After conducting user testing, I discovered there was a lack of trust in the shopping experience. Not only were the overly large images making it difficult for users to see the product image, the product pages looked similar to other Bustle article pages. Users preferred a more familiar ecommerce experience.

My goal is to redesign the product pages to create a more trustworthy, and seamless shopping experience.

Design

85% of the Bustle readers are on a mobile device, so it was important to design for mobile first.

On the product detail page (PDP), a fully visible product image above the fold will have a huge impact on the usability of the page. The addition of multiple product images in a carousel can help inform users in making the decision to add to cart.

Here are a few early explorations on color and variant pickers. The challenge was thinking through how the color picker would work when there is more than one row of colors.