Eve Product Page

During testing sessions with users, the following issues were observed on Eve's mattress product pages:

  • Users were often confused between the different features of individual mattresses
  • Users had low recall of the different mattress names and their features after browsing
  • Some users experienced difficulty navigating between mattress product pages
  • Users complained the product pages were long, especially on mobile
  • The mattress comparison page proved confusing to use; many users were unsure which mattress they were looking at. Initially, most users didn't realise that each mattress title was a dropdown select.

Based on these observations I redesigned the product page in Figma, making the following changes:

Client

Eve Sleep

Type

Product Design

Year

2019

Process

Key Details Area

The key details block was originally intended to provide a quick overview of the USPs for each product, but on the mattress pages it had become bloated with overly descriptive copy and contained attributes shared by all mattress models, reducing its overall impact and readability.

After viewing this content on one mattress product page, users were often observed scrolling past it on subsequent pages, assuming the content was the same. Later, when asked to name features specific to each mattress, users had problems recalling these.

The redesign addressed this by only including the key features where the mattresses differ in the left column and a summary of common features in the right column.

Sleeper Type

The key details block was originally intended to provide a quick overview of the USPs for each product, but on the mattress pages it had become bloated with overly descriptive copy and contained attributes shared by all mattress models, reducing its overall impact and readability.

After viewing this content on one mattress product page, users were often observed scrolling past it on subsequent pages, assuming the content was the same. Later, when asked to name features specific to each mattress, users had problems recalling these.

The redesign addressed this by only including the key features where the mattresses differ in the left column and a summary of common features in the right column.

Comparison Page

As many users didn't realise the title of each mattress in the existing design was a dropdown, I replaced the titles with standard dropdown components, from Eve's design system, Snooze.

The order of mattress features was made consistent with the information on each new product page. The related icons were also brought into the design. This, along with cutting down the length of the descriptions made the table much easier to scan.

In previous testing sessions, users were observed moving between the comparison table and the mattress pages. The new consistency across each layout was expected to make this process much clearer.

Video Content

Previously, using video content on product pages had been tested to mixed results. On the Premium mattress page, a short featured video increased add to cart rate, but on the Original mattress page various videos (embedded YouTube links) had no positive impact. In user testing, most users didn't engage with these at all.

I hypothesised that a short video that played in frame and on scroll, which communicated the feel of the mattress could work more effectively and was worth testing. I edited a shorter cut from a video previously used for social marketing and added it to the page.

Outcome

Due to the development and setup time for the main test, we first tested the video in isolation on the original mattress product page. The variant with the video block gave a 5% higher add to cart rate.

Variants of each of the mattress product pages and the comparison page were developed and A/B tested. However, due to organisational changes at eve, the test was cut short in favour of moving  e-commerce operations to the Shopify platform. The new product page designs have been incorporated into the upcoming website, which is set to launch mid-2020.

Other work

Want to work together? Drop me an email.

→ laud@laud.li