Sustainable Airbnb shop

An eco-friendly shopping feature design on the Airbnb app.

Team project · 2020 · 3 months

Contributions - Leads

Research/Test: Selome Zerai

UX/Graphic Design: Ruby Cassidy

Wireframes/Test: Kyle Green

UX/Story telling: Asaki Nelson

Overview

What is Airbnb?

Airbnb is a community-based popular online platform for vacation rentals.

It facilitates the process of renting without owning any rooms itself through hosts and allows property owners to rent out private spaces as "hosts". Hosts are independent contractors in charge of their own schedule, space, and purchases and gives guests a home away from home.

Design brief

Encourage hosts to be sustainable when renting out their homes.

Problem

Despite the high rate of waste production, sustainable practice is still hard to navigate.

  • 289,700 tons of waste is produced by the hospitality industry.

    Source: Devon Contract Waste

  • 9% of plastic produced globally is recycled.

    Source: UN Environment Programme, 2020

  • 62% of people think sustainable living is more expensive.

    Source: Forbes, 2019

Process

Target Audience

Journey map

How might we…?

provide a way to compare/contrast products?

provide a way for hosts to pick their products easily?

offer affordable eco-friendly products?

ease the stress of running out of eco-friendly products?

ease and encourage the transition of sustainable practice?

Scenario 1

Persona: Susan Porter

She wants her rental to be supplied with as many eco-friendly products as possible.

    1. Susan is looking to make her Airbnb home more eco-friendly.

  • 2. She looks for eco-friendly supplies to fill her home, but many are expensive and she's not sure what the best option is.

Item 1 of 4

Scenario 2

Persona: Austin Flex

He rents out his 1 bedroom apartment for months at a time.

He cleans his apartment on his own, and is warming up to sustainable practices around his rental.

    1. A guest checked out, so Austin cleans up the place.

  • 2. But the smell of chemicals in his cleaning supplies is harsh. He's worried that his next guests will smell them.

Item 1 of 5

Lo-fi prototypes

Open the app and switch to hosting

  • Opening the app

  • 2. Landing page

Item 1 of 5

Version 1:

Shopping experience under "Performance"

  • Learn how you can increase your sustainability practice via the performance tab

  • 2. Learn how Airbnb can assist making your home eco-friendly.

Item 1 of 5

Version 2:

Shopping experience under "Profile"

  • Hosting > Shop products

  • 2. Shopping categories

Item 1 of 4

User testing takeaways

We had users navigate to Eco-Friendly Product Shop page, find specified products and add the item to the cart.

We also had users find a specified item and add it to the wish list.

We observed and timed how they navigated and listened to their feedback.

  • Quicker time to navigate

    Needs more hint that there’s a shop page

  • More clicks, more time to navigate

Hi-Fi wireframes

Based on the feedback, we moved forward with shopping under “profile” tab.

  • 1. Starter Kits and brand highlight

  • 2. Starter kits > Add to cart

Item 1 of 4

Voices from the users:

"I didn't register the heart icon as a wish list at first" - No word for wish list anywhere.”

"Eco-product shop is my favorite page with all the starter kits, refills, etc."

"Shopping experience is good but I wish the shopping tab was more obvious"

Final improvements

User flow

Final

Opening the app: The experience

  • 1. Opening the app - loading

  • 2. Landing page

Item 1 of 5

Shop

Explore

Shop

Browse starter kits & refills

Accessibility check

It was important to check the contrast of the colors and the font weight to make sure it was readable for all users. Every frame was tested on the WebAIM's contrast checker tool. This app design pass the WCAG AA standards at 98% and most of the WCAG AAA standards.

*WCAG = Web Content Accessibility Guidelines

*AA = Acceptable compliance level for accessibility

*AAA = Optimal compliance level for accessibility