SIMPLEHUMAN.COM USER EXPERIENCE DESIGN CASE STUDY

The UX behind the journey of finding the right bin

OVERVIEW

simplehuman is a designer and manufacturer of kitchen, bath and high-tech beauty tools. simplehuman’s products are considered among the most high-end household products on the market today because of their patented sensor technology, superior design, and durability. Even though the old website was very aesthetically appealing, it was not user-friendly, leading to the low conversion rate and high cart abandonment.

Therefore, as an effort of improving the user experience and increasing eCommerce direct sales, simplehuman.com is thoroughly audited and redesigned focusing on human-centered design and eCommerce best practices.

CHALLENGES

First of all, simplehuman offers a wide range of products, but fails to present them in an efficient and user-friendly way. For instance, in order for old or new consumers to make the final purchase, they had to go through at least 4 steps, which are redundant and inefficient in helping the customers reach their demands and needs.


Second, simplehuman have more than 15 products and the trash can category alone has 7 types. Each trash can type comes with different size and color variations. Because of the price range associated with the product quality, new customers tend to spend time on researching the right product. However, with the old website structure and architecture, it hindered the new customers in the process of learning about the products.


Third, the old checkout process was lengthy, which resulted in the high cart abandonment rate.

Finally, even though simplehuman.com was mobile responsive, it was not mobile friendly. Bounce rate and cart abandonment rate were higher on mobile.

GOALS

RESEARCH

MAIN ASPECTS TO CONSIDER


DEFINE TARGET AUDIENCE & THEIR BEHAVIORS

According to Google Analytics in 3rd quarter, new visitors accounted for about 71% of the site traffic with the bounce rate of 60%, which is very high compared to industry standard. Almost 64% of traffic used their mobile devices to visit simplehuman.com. 62% of the audience were in the age range from 25 to 54 years old. Therefore, the new user experience needs to accommodate the needs and demands of (1) mobile users and (2) professionals/more mature target audience.


OPERATIONAL SIMPLICITY

Simplification enables scale. As more products are added, the old architecture became obsolete and was unable to accommodate the scalability. After an intensive investigation in products’ attributions and how customers navigate, similar product attributions were grouped together and the sitemap was simplified to help the consumers learn or purchase the products quicker. Instead of going through multiple steps to choose different product variation, customers now can configure all the attribution on one product page.


STRONG SIMPLEHUMAN BRANDING AND DESIGN THAT DO NOT OVERSHADOW THE EXPERIENCE

simplehuman products are considered “Apple of Household Industry” because of their sleek and superior design. Hence, simeplehuman.com needs to reflect the look and feel of modernity and simplicity, but still is able to support the complex architecture of their product range.


MOBILE, MOBILE, AND MOBILE

Since more than half of the site traffic comes from a mobile device, it is important not to be only mobile responsible, but also mobile friendly. An intensive research was done on mobile eCommerce best practices and these are the recommendations:

  • Intuitive one-step checkout with Apple Pay added
  • Utilization of collapsible tabs on mobile only to reduce scrolling
  • Adding different media queries for better experience on tablet (landscape and portrait) and smaller mobile devices
  • Succinct, yet efficient copy with powerful and clear images
  • Custom interactions for mobile only (compared to desktop experience)

DESIGNS

INVITING DESIGN ENHANCES FLOW

To respond to the sensitive and aggressive nature of eCommerce market, we paralled-pathed UX and visual design. The solution needed to pair aesthetically with the current website, so we based the new design inspiration of the simplehuman current branding along with an effective UX design.

Take a look at the before and after flow of sensor can category, we successfully shortened the path of purchase and made it easier and more effective for consumers to browse and decide.

BEFORE


AFTER

The old flow and layout were redundant and hindering consumers to browse the products freely. Different colors and sizes were displayed in a three-grid casousel which required clicking through to browse. In order to view a product in detail, consumers had to click on a “Select” CTA, which directed them to that product page. If they wanted to see another option, they had to go back to the previous page.

After collecting data and feedbacks from Google Analytics as well as Customer Service department, we redesigned the user flow and made the product page configurable. That means the consumers would be able to view all the options on one page instead of going back and forth product page and feature page. Moreover, to accommodate both new consumers and returning ones, we combined the product features and a sticky CTA “Buy” bar on the second step.

Because of the complicated structure of product family, we sorted the products into 4 templates:

Single product (No configuration)

One-option configuration (Either finish or size)

Two-option configuration (Product tier)

Complex two-option configuration (Product tier, size, and/or finish)

This process defines the development templates and shortens the development time.

PROTOTYPES

QUARTER TO DATE RESULTS

WHAT'S NEXT?

Enhancing user experience is an on-going process and it will keep evolving to accomodate people's needs. For the next phase of simplehuman.com, we want to focus on subcription service and personalize the shopping experience for consumers. We are looking at making the transition between the web and mobile app more seamless and convenient. This means creating a personal account will not be a hassle but an effective addition to the purchasing process.

MORE WORK

Say hello!