As a team of 10 designers we spent a week immersing ourselves in the current flows, while uncovering insights that led to pioneering a new way to book a home on Airbnb.

7. Who’s coming

Message your host on who is coming

8. Confirm & pay

Review your booking details

9. Confirmation

These steps are what Airbnb guest assumed to be experiencing when booking a home, but as we dug deeper it became clear that millions were facing many moments of friction, confusion, and suprises.

Early Insights from research and audits

With millions of guest having booked in 2018,

I presented my audits of how fragmented our experiences are across platforms and how many steps it truly takes to book a home, and how many of our “new” guest globally were presented with different experiences.

New Android users went through = 25~ screens

This was the real average flow to complete a booking instead the “ideal” 9 screens

New iOS users went through = 22~ screens

This was the real average flow to complete a booking instead the “ideal” 9 screens

Insight 1:

There is nothing magical about 25 or 9 steps. We surprise our guest with redundant friction.

Insight 2:

We are not setting the right expectations for our guests since there is nor real order to our steps required.

Insight 3:

Design debt and fragmentations reduces the quality of experiences across platforms .

Insight 4:

Current experience is too bespoke to scale and does not allow for flexibility in editing your trip details

Exploration, iteration, and user testing

As the team uncovered insights from research and data, we began to think about a completely new way to do our checkout.

Airbnb had done a single page checkout in the past, but we aimed not to incrementally change a checkout, but to reimagine a new experience that lived up to Airbnb standards.

Iterations and usability testing

Goal:

The team iterated on concepts that would set the right expectations and consolidate all actions required.

We came up with 2 concepts that would address the these goals.

Hybrid concept:

Aimed to guide users with a Price, Account, and Pay stepper to indicate what was up next in order to set better expectations

Hub concept:

Aimed to centralize all items on one page to better set expectations offer flexibility to edit their details

Results: Hub concept set better expectations

After doing some usability testing between the two concepts the team came up with, the one what share the most success in setting expectations, flexibility and overall felt less overwhelmed by what they had to to

Pioneering a new checkout design the Airbnb way.

Logged out user experience

Logged in user experience

Principle 1:

Set clear expectations

This guided the larger team establish what “tasks” and edit functions made most sense, and helped me design the task behavior system.

Principle 2:

Provide the right value

The team merged the sign up process within the hub while offering our guest the ability to still edit their trips details and see live pricing updates.

Principle 3:

Consolidate friction

Our legacy process surprised our guest with friction. In the new world we make clear what our guest need to input without any surprises.

Principle 4:

Ensure flexibility

Not only can our new checkout offer you the flexibility to change your details, but as a team we also thought how this could scale.

Features and patterns guided by our principles

Action Rows and Feedback

We worked closely with our Design Language Systems team to incorporate new patterns for “actions”, ‘tasks”, and “feedback”, to establish the right expectation to our guest on what needed to be completed.

Context Sheets

Along side the actions, we implemented context sheets that would peak above the page, allowing for tasks to be completed within our new experience. Our guest were always in context of the checkout to reduce confusion of the steps required.

Impact and success?

This initiative was part of 3 major priorities for the company and was showcased internally for the largest booking redesign in recent Airbnb history.

Although we didn’t fully launch, we did a partial global test. We initially saw %+ in engagement during our pre test.

We launched this pre test in early February…then the Pandemic happened.