Fixed Booking Options

Airbnb

Video didn't auto-play? Click on the thumbnail ☝️

 

What is it?

This is a pattern found in the Airbnb web app. When a user scrolls through an Airbnb listing, the booking options stays fixed so they are always available for the customer to complete the booking at any moment.




How does this interaction or pattern work?

Airbnb listings feature a comprehensive amount of information about each location. This information includes an overview of the location, description, specific data about the host and reviews by past guests.

Since all this information is quite long, users have to scroll several page folds to review it.
To avoid the constant scroll jumping, Airbnb fixes the container with the booking form, so it's always available to the users at any scroll position of the listing.
Users don't need to go back to a specific position of the page to finalize their booking.




How does it help or delight the user?

Keeping Context and Reducing Cognitive Load.

Although it could be argued that this pattern is mainly beneficial for Airbnb (since it likely helps with conversions), it also helps the customer to accomplish their primary job-to-be-done on this page.

This pattern helps the user to keep price and booking dates in context regardless of their position on the page. This behavior allows users to understand the listing better as they scroll through it.
Additionally, this pattern reduces the cognitive load associated with scrolling back and forth to reference previously seen information.

Contribution by:


Click the bookmark to save to your favorites