UX Case Study

Cross-selling Airport Pickup with Hotels on the Agoda app

My experience during a 48-hour Product Design Challenge

Here is a case study about the project that gave me confidence in my ability to deliver results under tight timelines.

Recently I took part in this challenge which was organized in the UXM community where I worked on a project to introduce cross-sell airport pickup services on the hotel booking flow of the Agoda app.

It was a 48hr challenge where I built UI based on my assumptions, tested it with the users, worked on the feedback, and finalized the Design. The Aim was to deliver an MVP (minimum viable product) by the end of 48 hrs.

Huge thanks to my mentor UX Anudeep for continuously creating such wonderful opportunities for students to learn and grow.

About the problem statement

Agoda: Agoda is an online travel booking platform that offers a variety of travel services, including hotel bookings, flights, rental cars, and airport transfers.

Among the list of ideas given to us, I choose to go with the theme of cross-selling for my problem statement where my core idea is to add a feature to cross-sell other services of Agoda while checking out on the hotel booking flow.

To get more clarity on my project and to move forward I used chat GPT and created a brief for myself. It helped me structure my thoughts on the feature quickly.

The Brief

Company Name: Agoda

Feature name: add a feature to cross-sell other services of Agoda while checking out on the hotel booking flow.

The core idea of the feature: Add a cross-selling component to the hotel booking flow on the Agoda app. Essentially, this means that as users are going through the process of booking a hotel room on Agoda, they will also be presented with relevant offers for other services that Agoda offers.

Impact on business metrics: By offering additional services to customers during the booking process, we expect to see an increase in revenue and AOV from cross-selling. Additionally, offering these services at the point of checkout should result in a higher conversion rate for these additional services.

How it helps users: This feature would help users by providing them with more options and convenience during the booking process. By offering relevant services at the point of checkout, users will have the opportunity to book multiple services in one transaction, saving them time and effort.

Solutions

Agoda provides various services like flight booking, car rentals, airport transfers, trains, buses etc.

After exploring the app and understanding the concept of upselling and cross-selling I decided to go ahead with cross-selling of Airport pickup service among others.

Reasons:

• This feature requires less amount of info needed to be collected from the user and most of the details can be pre-selected.
• I want the users to not deviate much from the Hotel booking flow or drop off from the funnel.
• Comparatively, it is a minor decision for users to make when compared to adding other services like trains or buses.

I designed the cross-selling of the Airport pickup service to provide users with the option to add this service at the time of checkout during the booking of a hotel. So, to do this I made sure to let the users know which hotels this option is available from the search results page itself.

Existing screens/flow

A comparison of the Existing Screens and My Final Design with reasonings

1. Added an “Airport pickup” badge in the Hotel listing card to communicate which Hotels provide this option. This badge is placed along with the other highlighted information regarding that hotel’s room booking.

2. Mentioned About the option of Airport pickup in the Highlights section of the hotel detail page. Placing an info icon along with the text will let the users know that they can tap on it to get more information about this feature.

3. Introduced a widget on the payment details page to allow the users to add this service to their booking.

• This section wouldn’t require the user to fill in any more details here and the necessary details regarding the service are provided so that the user can take a decision on adding to their booking or not.
• Here I tried to automate the process by giving a readily designed service based on the user’s hotel booking details as I don’t want the user to take more decisions than necessary and just decide whether they want this add this service to their booking or not.

Detailed explanation of the Airport pickup widget

3. For the user to enter their pickup time details I provided an entry field for the upcoming bookings card.
Added a badge in the individual card clearly indicating that this booking also includes.

• I decided to collect the pickup time details after the booking in the upcoming booking section as I don’t want to burden the user with adding to the list of things they need to provide before booking.
• Here I also considered the use case of when the user might not be aware of his flight timings or has not even booked one yet.

Interact with my Prototype

The Journey towards the solutions

Competitor analysis

I started by looking into other travel booking apps like Goibio and booking.com trying to find if they are cross-selling anything in their hotel booking flow.

From competitor analysis, I found that none of the major travel apps or websites currently offer cross-selling of airport pickup or any other major services during the hotel booking flow. (There might be a reason why none of the top companies is doing this.)

Going from Ambiguity to clarity

Since I was unable to find any similar features on other apps, I moved ahead by making assumptions and taking decisions while conceptualising the feature to get more clarity.

For whom am I designing this feature?
People who are travelling mostly for business meetings from one city to another for a short stay could use this extra service for their convenience.

They need not go to other sources to book a cab separately and just book a ride from the airport to the hotel. I am going ahead with this assumption as it seemed sensible to me and due to the limited time.

Decisions I took while conceptualising the feature:
~Search results page and hotel detail page

• Make sure that users are aware that on which hotels this option is available on the search results page itself by adding a badge in the hotel listing cards.
• Provide a detailed description of how this service works if want to know by giving an info button in the highlights section of the hotel detail page.

~Room selection page

• I decided to not add anything to this page because it has been very particularly curated to the task of selecting the room.
• The information about the availability of airport booking is not necessary for this step as it is already shown on the previous screens.

~Payment details page

• Provide an option to add airport pickup as an add-on service on the payment details page.
• It will display the necessary information about the service as from which airport the pickup is available, what kind of car, how many people can sit in and how much baggage can fit.
• Here I tried to automate the process by giving a readily designed service based on the user’s hotel booking details as I don’t want the user to take more decisions than necessary and just decide whether they want this add this service to their booking or not.
• Giving more freedom and control to the user to choose the no. of cars or type of car or the exact pickup location could be done but I don’t want the users to diverge from the funnel when they are at the final stage of it.
• The airports shown here will be the nearest airport to the hotel or in most cases, it will just be the one airport in that city.
• Also, no. of cars is something which can be decided automatically based on the no. of guests for whom the hotel rooms are being booked.
• I also decided to give this service at a discounted price which would attract them by giving them more reasons to add this service to their booking.

~Upcoming bookings page

• Since the pickup time would be something which needs to be entered from the user’s end, I choose to give it in the upcoming section.
• I decided not to do this before booking and do it after the booking because the user might not have booked his flight tickets yet or they might just not remember it.
• Thus, it made sense to ask for this information once they are completely done with the booking as this can be independently done without interfering with the booking flow.

While I am doing all this decision-making, I have made some rough wireframes to help myself in getting more clarity about the feature.

Building UI

I went ahead and started building the UI for the feature.

Here are the screens which I designed.

While building UI for this project these are the components and colors styles I used. Using them made my workflow much easier and quicker.

Testing my design with users

After making the UI I wanted to validate whether the users will understand that they can add an airport pickup service to their current booking or that they need to enter the pickup time in the entry field of the upcoming booking card.

So, I went ahead and showed my designs to 3 random strangers from our community to check whether they understood my design the way it was intended to be.

I showed them the screens and gave them some context of what is it that they are looking at like details about the app and how did they get on that particular screen.

Then I asked them to talk about what they can see on the screen and what are they thinking about it.

I collected feedback regarding my design based on what I observed from the 3 users and improved my design.

Changes after usability testing

Search Results Page

1. I changed the color of the badge to blue from red.

Reason:
I understood that there are good chances for people to misunderstand the red color badge for the unavailability of the service.

Payment Details Page

2. I made changes to the layout of the widget, copy on the button and its position on the screen.

Reasons:
I observed that some users were unable to understand that there have to add the Airport pickup service to their booking by assuming it was already included in it.

Also, users were misunderstanding the use of “ADD” button thinking it would give them the option to edit the no. of cars or baggage and details.

My Bookings Page

3. I redesigned the entry field to clearly communicate that user has to enter their pickup time by tapping on it.

Reason:
I observed that the previous one wasn’t clearly communicating to the users that they need to do.

As they thought that it will just show the info regarding the pickup like the details of the card and the driver’s contact info.

Future scope

Here is a list of things I would have done if had more time.

• Introduce a section on the booking confirmation page to ask the users who have added the Airport pickup service to their booking asking them to select the pickup time.
• Design a widget on the home screen inside the upcoming trips section to remind the user that they have to select their pickup time.
• Design the communication system between the user and the driver. This includes aspects like, how will they contact each other and how will they know about each other’s location for the pickup.
• Providing an option to choose the type of car based on availability. Because while doing my usability testing, I understood that users might want to have the freedom to choose the kind according to their preference.
• Work on the use case where there can be an option to choose in case any city is having multiple airports. or an idea of giving the user an option to change the specific pickup location.

And that’s a wrap!

Finally, I would like to thank all my friends from the UXM community Aparna, Akshith, Omkar, Aditya, Krishna, Piyush, and Smita. For helping me through the project and being such a wonderful support.

Click their names to check out the cool things they design!

Thank you for reading, I hope you enjoyed my 48 hours of problem-solving journey. Feel free to share your feedback.

You can reach out to me at,
Mail: sriramsaidzn@gmail.com
LinkedIn: (profile link)