Airbnb
Enhancing the user experience when booking accommodation as a group.
UX Research
Wireframing
Prototyping
Usability Testing
Introduction
During my 15-week UX/UI Design Bootcamp with Memorisely, I was in a team of two that worked on a project to enhance the user experience when booking accommodation as a group within the Airbnb iOS app. We took the initial idea through the entire design process before presenting our final prototyped solution.
Role
Research Survey
UX Design
Wireframing
Prototyping
Usability Testing
Tools
Google Forms
Dovetail
FigJam
Figma
Maze
Timeline
July–Oct 2023 (10 weeks)
The Problem
The Airbnb mobile app currently only allows for reservations to be made by an individual. So when making travel plans for a group, this user is required to make the reservation on behalf of the entire party. Leaving the group organiser with the burden of pursuing their friends or colleagues to reimburse them.
This can often lead to frustrations amongst larger groups of travellers as they must agree on the location and accommodation, decide how to fairly split the payment between them and collect payments using other services such as bank transfers or third-party apps.
Hypothesis
Enhancing Airbnb’s group booking features, including a split payment feature and improved communication tools would increase satisfaction among guests. This would lead to a higher conversion rate for group bookings whilst building loyalty with guests looking to make repeat trips together.
Solution
After ten weeks of bootcamp, we had taken our problem through a design process that included user surveying and synthesis, competitor benchmarking, user journey mapping, low-fidelity wireframing, high-fidelity prototyping, usability testing and developer handoff.
The result was a Figma prototype that maintained the feel of Airbnb’s existing Design System while adding features that expand the group booking process throughout all five main sections of the app.
Understand
Business Goals
Group Booking Conversion Rate
Measure the percentage of visitors who visit the group booking section of the app and end up completing a booking. A higher conversion rate indicates that the design changes are effectively encouraging more group travellers to book accommodations.
Average Booking Value for Group Reservations
Calculate the average amount spent on group bookings. An increase in this metric would indicate that the changes have encouraged longer stays or higher spending by group travellers.
User Engagement with Group Booking Features
Monitor user engagement metrics such as the number of searches conducted using group-specific filters, interactions with group messaging, and the percentage of users creating and managing group profiles. Higher engagement demonstrates that users find value in these features.
Repeat Bookings for Group Travel
Track the percentage of users who book accommodations for group travel more than once within a specific timeframe. Higher repeat booking rates demonstrate improved customer loyalty among group travellers.
User Survey
We created an online survey using Google Forms to find out if users experienced any common frustrations when booking travel with a group. We were able to gain some interesting quantitive insights from our relatively small sample size of 13 respondents.
All respondents discuss group travel via text messages or group messages as opposed to phone calls or other methods
The majority of respondents travel in groups of six people or less (58%)
Synthesis
To synthesise the responses we used the insights platform, Dovetail to create an affinity map. This helped us to identify patterns in our qualitative data and highlighted many frustrations people face using travel apps, of which there were two common themes related to group bookings. We then defined frustration statements that would guide how we approached finding our solution.
Primary Frustration
When booking and paying for group travel users are often left waiting for reimbursement from friends which results in the user being left out of pocket.
Secondary Frustration
When booking accommodation as a group users have different preferences and budgets which results in the group finding difficulty in agreeing where to stay.
Competitor Benchmarking
After discovering the pain points in the user survey it was time to move on to competitor benchmarking. I looked at one direct and one indirect competitor of Airbnb to see how they approached some of the problems we were looking to solve. Meanwhile, my teammate evaluated booking.com (direct competitor) and Splitwise (indirect).
Expedia
I was keen to see how other apps handled bookings for larger groups of guests so I chose to analyse Expedia, another travel platform for booking stays, flights and experiences. In contrast, Airbnb mostly serves privately hosted accommodation, Expedia has many more hotels which tend to display pricing at a room rate. This means that when booking for a group of guests, they can either pay for their rooms entirely separately or one person can reserve multiple rooms in one single booking however, rooms have to be of the same configuration (e.g. double, king etc).
Monzo Bank
I then analysed an indirect competitor, Monzo Bank. They offer a "split the bill" feature that lets users get reimbursed by others after paying the bill. The user gets to choose from their contacts or invite others via email or nearby friends and then adjust the value that each person needs to pay. The invited users then receive a notification instructing them how to pay.
Define
Information Architecture
We mapped the information architecture of the existing Airbnb app from the guest's perspective so that we could easily identify which sections would later require new functionality.
Mind Map
We created a mind map by asking ourselves some "How might we" questions to consider all our ideas and help visualise our potential solutions.
How might we encourage users to travel more frequently in groups and make repeat bookings?
How might we enable groups to make travel decisions whilst easing the frustrations of the group organiser?
What can we add?
Highlight listings “Great for groups”
Allow guests to easily identify listings suitable for larger groups of guests.
Payment splitting with user adjustable weighting
Share the payment with fellow traveling guests and make individual payments towards the total cost.
Loyalty discounts for groups
Encourage repeat bookings with exclusive discounts for returning groups.
What can we improve?
Voting for accommodation via Wish lists
Expanding the existing collaborative wish lists feature to include a voting system to help group users make travel decisions.
Enhancing group messaging
Integrated notifications in the message conversation when group members make a payment or vote for accommodation in a wish list.
Ideate
After outlining the new features and enhancements to be made, my teammate and I split the features between us for the ideation phase. I took on the payment splitting features, whereas my teammate took responsibility for the enhancements to wish lists and voting features.
User Flows
I set about creating user flows for the existing Airbnb payment process. I then added a user flow for the enhancements to the payment splitting feature.
Rapid Protoyping
I used a technique called Crazy 8 to quickly sketch out my initial ideas.
Prototype
After outlining the new features and enhancements to be made, my teammate and I split the features between us for the prototype phase. I took on the payment splitting features, whereas she took responsibility for the enhancements to wish list and voting features.
Low Fidelity Wireframes
I created the following wireframes to gain a clear idea of users flow through the new payment splitting and additional trip management features.
Styles & Components
Colour Styles
We created colour styles based on Airbnb’s existing design system for primary and secondary and neutral colours. This helped us maintain consistency throughout our designs, while checking all text colours were compliant with accessibility standards for contrast and readability.
Type Styles
Airbnb uses a custom font called Cereal. I matched the font sizes and weights to text in the existing iOS app to create a hierarchy of font styles for headings, body text and buttons.
Components
I identified elements in my wireframes that would be reused across multiple screens and created them as components in Figma. This included buttons with primary, secondary and tertiary states, input text fields, a checkbox, and profile avatars.
High Fidelity Prototype
Here are my final designs created in Figma. The prototype includes interactions and native iOS transitions.
Demo
Test
Usability Testing
After building the prototype, I performed usability tests with a number of participants using the testing platform Maze. I set users a selection of tasks for users to complete and asked follow up questions about their experience.
Test Outcomes
The results from the testing revealed some common frustrations with the user flow when inviting guests to join a group by email. My initial design led users to choose from their contacts list before progressing to the next screen where they could choose to invite additional guests by email. Testers had issues with discoverability of the invite by email option, so I revised the design by adding a button to invite by email on the invite contacts screen.
Presentation
After concluding the case study, I had the opportunity to present my work to the rest of my bootcamp cohort and teachers. I received high praise for my considered reasoning for my design decisions, particularly around how they were influenced by user feedback and business metrics.
Summary
It was a pleasure to work on this case study over the first ten weeks of bootcamp. Payment splitting was an interesting problem to solve and had the potential to get overly complex for guests and hosts. With further iteration I could imagine an algorithmic approach to calculating a suggested split, although this may require the user to input more information about which guests are occupying each room. In the end I think I landed on a simple solution that gave the power to the users to decide how they will split the payments fairly among their group.