Building the User Experience in an Online Booking App
Introducing a Comparison feature to the Agoda app in order to boost AOV and Customer Satisfaction
48 hours Product design Challenge
Imagine you are planning a long family vacation within 10 days and want best deals and hotels as you are on a budget constraints but also looking for peaceful stay that ensure you are getting the best value for money.
It can be quiet overwhelming to sift hours through the countless deals and options available on the internet and end-up getting confused which on to choose? or how to find the best deals?
P.S: If you’re also the one that gets super confused while deciding which one to choose? Alike me :)
Eventually the answer lays within our own shopping behavior's. One of the most effective way to make a decision is giving the freedom to compare things. By comparing different options, you can easily find the best deal and save your money and time.
Well! This is what the whole case study is about
Last weekend, I was tasked with building a compare feature for hotels and bookings within the Agoda app.
Lets see HOW?
In this project, I have introduced a new feature to the Agoda app which aims to positively impact toward business by improving specific business metrics within the timeline of 48 hours. I did this project under the guidance of my mentor Anudeep Ayyagari
🧾Index: click on any headers to jump directly to that section.
◾Quicky Summary About the Challenge
◾Started with building Problem statement
👉Here is the PROBLEM BRIEF I came-up with
◾The Process I followed during 48 hrs.
👉Why I felt the need of conducting a quick Secondary Research…
👉Wherein I went ahead and did Competitor research to understand the user behavior in the hotel booking sector to gain important insights…
👉Brainstorming on User flow and Solutions
👉Scoping down the to Primary Solution
◾User Interface…
👉Coming to the Final Ideation with the help of Wireframing
👉Building Components and Styles to Building Final UI Screens
◾Getting Validation from Actual Users a.k.a Usability Testing
👉Changes I made after Usability Testing
◾Key Learning I had in 48 hrs.
Disclaimer: I worked on this project as a part of a Product Design Challenge and I was in no way associated with Agoda at the time of working on this project
Quick summary about the Challenge
It all started with the kickoff call @9:30 PM on Friday with my mentor Anudeep Ayyagari, where he started outlining about the 48-Hour Product Design Challenge to all the participants.
The Context was simple : The Challenge mainly focuses on building the problem statements around a product and working towards introducing a new feature while keeping in mind the business metrics it will impact.
It was an Individual project. We were assigned to a group where we can contribute and receive assistance from each other if needed. While working on the same product, each team member has a different problem statement to address. The product we received was an online booking app called Agoda whereas I decide to work on Comparison Feature in hotels and bookings.
And the Deadline was Sunday 9:30 PM
◾Why did I choose to work on Comparison feature?
Considering the Online Travel Industry behavior and its relevance the comparison feature are becoming increasingly popular in various industries, including travel and e-commerce. It can drastically improve the business as well as the customer satisfaction in many ways.
To understand the HOW of this concern I went ahead with this topic.
Started with building Problem statement
To form a problem brief with respect to the comparison feature in Agoda, I first started with understanding the product and its current state. While keeping two things in mind:
First How users or product might behave?
I researched about Agoda’s and its current Hotel booking category and analyzed its user flow, interface, and functionality. I also looked at the core aspects needed to build a comparison feature like how Agoda focuses on feedback and reviews from current users to understand their pain points and areas of improvement.and How this feature will impact the business?
Secondly also understood every aspect how the feature might impact the business while exploring possibilities to introduce a new feature with the existing flow of Agoda App.
Click here to Quickly Understand the Solutions Before Usability Testing & Solutions After Usability Testing.
👉Here is the PROBLEM BRIEF I came-up with
Problem statement
To Introduce a Comparison feature for bookings and hotels in Agoda app.
About Agoda
- Agoda is a Singapore-based online travel booking platform that allows users to search and book accommodations around the world.
- The platform offers a wide range of accommodations including hotels, resorts, apartments, villas, and more.
Target users
The target user of Agoda who uses the Agoda platform to search and book hotels or other accommodations which includes travelers, business travelers, and anyone else who needs to book accommodations for a trip or events.
The core Idea of the feature
The comparison feature in Agoda app is designed to provide users with a simple, intuitive, and efficient way to compare different travel options such as hotels, flights and rental cars, and make more informed decisions based on their preferences, needs, and budget.
◾How did I go about selecting the business metrics to measure the impact of the feature?
After Understanding the Pros and Cons of this feature I understood that it might :
- Increase conversions: By providing users with the ability to easily compare different options and find the best deals, it can increase the likelihood of users completing a booking, leading to increased conversions and revenue for the company.
- Increased customer satisfaction: By making the booking process more efficient and streamlined, it can lead to higher satisfaction and loyalty from users. This can lead to repeat business and positive word-of-mouth recommendations.
- Increase retention: The comparison feature can keep users engaged with the app for longer periods of time, as they explore and compare different options, leading to increased user engagement and retention.
Ultimately, leading to increased revenue for the company.
Constraint I might face
I need to ensure that the comparison feature being offered is easy to find, while ensuring that the feature is easy to use so that it can give more personalized user experience and doesn’t overly complicate the booking process.
👉Plan of Action
I’ve been given a basic timetable for this product design challenge that takes into account the 48-hour time constraint, and because the project is non-linear, I’ve chosen to follow this schedule.
The Process I followed during 48 hrs.
👉Why I felt the need of conducting a quick Secondary Research…
To fulfil 48hrs. deadline, I decided to emphasize Secondary Research above Primary Research. This allowed me to instantly collect and analyze current data and user insights, Rather than undertaking my own research.
After coming up with the problem brief I parallelly listed down few use cases and assumptions that might or might not impact user experience through the comparison feature.
◾Breaking down some of the use cases in which users may require the Comparison feature:
- Users have a specific budget in mind and want to compare different hotels and booking options within that budget in a specific location.
- Users have specific preferences or requirements, such as specific amenities or a certain location, and want to compare different options that meet those preferences or requirements.
- Users are trying to find the best deal and want to compare different hotels and booking options to find the most affordable option.
◾While some of the Assumptions considered around users behavior’s were:
- Users may use the comparison feature to compare different options in a specific location or destination. They may filter and sort the options based on various criteria such as price, location, ratings, and amenities.
- To find the most affordable option within their budget. They may sort the options by price to find the lowest-priced option that meets their needs and preferences.
- To compare options across multiple destinations (based on various criteria to find the best option for each destination)
- To compare options from different booking sites or platforms to find best deals.
I wanted to know more about the users comparing behavior w.r.t. hotels booking and understand what strategies can be used to increase user engagement and impact business metric.
👉Wherein I went ahead and did Competitor research to understand the user behavior in the hotel booking sector to gain important insights…
I took Make my Trip and Trivago as my Direct Competitor and Amazon as my In-direct Competitor and did analysis.
Through this process I gained ideas on how and where I can integrate Comparison feature within the users flow and how users are engaging with it. MMT and Trivago gave insights about interactions between the user and the feature whereas Amazon helped in providing how the user interface of Comparison list/table would work and how it will display information so that user can scan the information quickly.
Some of the major points I gathered from MMT & Trivago are:
Make my Trip(MMT) Displayed:
- Identifying trigger positions to display comparison feature.
- Giving prompts right form the homepage or search page, Using search page to display it so that users can easily discover comparison feature.
- Utilizing chips to showcase more things that can be compared, will increase users engagement and retention.
- Displayed on Product description page, Comparison list majorly consist of shows ratings, price, hotel name, hotel star, free cancellation and durations so that users can save time and quickly compare.
Trivago Displayed:
- By comparing prices with other online travel portals, it earns users’ trust and loyalty by giving them to better understand the deals and discounts they are receiving. This helps them make more informed decisions.
- Users can quickly navigate and compare the options with the help of the comparison CTA with several hotels cards, and it also provides clear instructions on how to utilize the feature.
-It is providing clear and concise information about the system status and the options being compared.
👉Brainstorming on User flow and Solutions
Competitor analysis give me a proper understanding that users may want to compare hotels while booking online in order to find the best deal or the hotel that best meets their needs. This can be done by giving users freedom to to explore and compare based on their needs and preferences by giving them a liability to customize their comparison list
Customization will lets users make their own selections about what they want to see, or set preferences for how information is organized or displayed. It will result in enhancing user experience by allowing users to control their interaction which can help users make more informed decisions and find Value for money deals easily.
How Customization in Comparison list can help users save time and take more informed decision?
- Customization in comparison features while booking hotels online to help them find the specific type of hotel or room that they are looking for.
- Customization options can include things like the type of room (e.g. single, double, suite), specific amenities (e.g. pool, fitness center, spa), location, and price range.
- With customization options, users can narrow down the search results to only show hotels that meet their specific criteria, making it easier for them to find the perfect hotel for their needs.
- Additionally, customization options can also help users to filter out hotels that do not meet their needs, saving them time and effort in the search process.
◾Where to Implement this feature?
Brainstorming gave me no. of different approaches that can be taken within the flow where comparison feature can be implemented.
I started by taking three approaches into consideration, and to examine the risk I wrote down some ideas while taking the user flow, use cases, and potential risks into account.
Approach 1 — Users can access the comparison feature directly from the homepage as a category to compare and explore through hotel cards. It can also be discovered and utilize in listing and Hotel description page.
Pros: This can potentially increase the likelihood that users will utilize the feature and ultimately make a booking which eventually increase AOV and user engagement.
Cons: This may divert users from completing their booking or even cause them to abandon the booking altogether, which would result in drop-off
Approach 2 — Based on the required schedule, durations and no. of adults info. filled in the Search page can compare as per the availability of bookings .
Pros: It will convert more users to complete their primary goal following Funnel factor and this can help users quickly narrow down their options and find a hotel that fits their specific needs and budget. Ultimately, decreasing Drop Off ‘s.
Cons: User might get understand how to use and get confused.
Approach 3 — Can compare at Hotel description page of a particular hotel side by side with different similar deals.
Pros: It might convince and encourage users to book more expensive or higher-end accommodations, resulting increase in AOV.
Cons: If it only shows a limited number of options or focuses primarily on budget-friendly accommodations, it may discourage users from booking more expensive options and ultimately lower the AOV.
👉Scoping down the to Primary Solution
Merging approach 1 and 2 of making the comparison feature easily accessible and discoverable in multiple areas of the platform, and being able to compare hotel options based on the schedule, duration, and number of adults specified in the search page can provide users with a highly customized and efficient comparison experience.
How customization will impact the comparison feature in hotel bookings?
1. Through this users will be presented with a more tailored and accurate list of options.
2. This can increase the chances that users will find the best option for them more quickly, and the convenience of the comparison feature can result in higher user engagement and satisfaction with the platform.
3. It also has the potential to increase the average order value (AOV) as users will be more likely to find the best deal for their travel plans.
User Interface
👉Coming to the Final Ideation with the help of Wireframing
Due to the time constraints I begin with creating Lo-fidelity pen and paper wireframes to check the functionality factor of the user flow and possible interactions within. With this strategy, I can produce a high-quality solution that solves the issue quickly and efficiently while moving from ambiguity to clarity.
👉Building Components and Styles to Building Final UI Screens
After falling behind on my timeline, At around 3:30 pm on Saturday, I began by quickly creating base components for the user interface and started playing with UI. As soon as I got the clear idea of what exactly I wanted to build, I kept on iterating and refining my final user interface until I had a functioning prototype ready.
SOLUTION 1 — Search Page
◾How it will benefits the users?
Giving them a clear prompt about the comparison feature will allow users for quick and easy comparison of similar hotels which will Save their time and effort in searching for similar hotels separately. It will helps users make informed decisions about their hotel booking.
◾How it will benefits the Business?
It will increase user engagement will eventually increase no. of bookings by making the process more efficient for users and providing valuable data and insights on user preferences and behavior will increase customer satisfaction.
SOLUTION 2 — Listing Page
◾How it will benefits the users?
Adding a Add to Compare CTA can help users find the most accurate results and make more informed decisions.
◾How it will benefits the Business?
By giving users more control over their search and comparison process, It can help improve their overall satisfaction with the user experience.
SOLUTION 3— Comparison Page
◾How it will benefits the users?
It will give users flexibility and freedom to view multiple options side-by-side and compare them based on different criteria such as price, features, or reviews. This can help users find the best options and make the booking.
◾How it will benefits the Business?
It increase the chances to gather customer loyalty and potentially result in repeat bookings which will eventually increase AOV and retention
It also increase the likelihood that users will make a purchase by providing them with an easy and efficient way to compare options.
👉Getting Validation from Actual Users a.k.a Usability Testing
After prototyping the Comparison feature, I decided to test user flow and feature with actual users which consist of frequent travelers and booking agents who use Agoda to find best deals and understood whether the solutions met the goals and create a smooth user experience.
I prioritized Comprehensive Usability Testing and I wanted to understand the major pain points and obstacles that users may encounter when using the feature.
Things I kept in mind while performing Usability Testing :
I performed usability testing on 4 users which consist of :
User 1: Samarth Jajodia (Frequent user | Majorly look for best deals online)
User 2: Mayank Bitthariya (Travel Agent | Book daily and have used Agoda Multiple time to do hotel bookings for variety of users)
User 3: Kushagra (Never used Agoda for booking but have explore it earlier)
User 4: Shikha Shrivastava (Have done few hotel bookings for family trips)
👉Changes I made after Usability Testing
Users were able to understand the overall user flow and how to use the comparison feature, therefore the solution generally works well for them. However, I noticed that users were struggling at certain points like getting confused with Add to compare and compare deal CTA or looking for certain specifics like near by locality, amenities etc. in the comparison list.
I made a few required changes to the design based on the insights and pain points I got from testing.
👉Conclusion of the Project
Comparison feature in hotels and Bookings has a capacity to improve:
- By allowing users to customize the comparisons card list and tailor the layout and format of the options to their preference, this feature can improve customer satisfaction by providing a more personalized and user-friendly experience.
- The feature can encourage users to engage more and explore different options. This can increase usage of the feature and potentially lead to more bookings.
- Customization through the filters and sort by options will give them option that best meet their needs which may increase the likelihood that they will complete a booking which will eventually improve the improve conversion rate.
Future scope of the Project
If I had more time, I would thoroughly explore and work on these variables, taking into account several use cases and concentrating on the particular users connected with each scenario.
Some of them are listed below :
1. Can look into the possibility of including a comparison option on the homepage as a common section for all other categories such as hotels, flights, and so on.2. Including a User Journey for Add more hotels so that the user navigation and interaction may be incorporated from the comparison page.
3. Use Cases of Selected Rooms CTA may be explored and added to the PDP page, giving users the option to compare based on different aspects such as reviews and ratings individually, similar to the images section on the comparison list.
4. After picking numerous cards on the listing page potential use cases can be given for users to find best deals.
Key learnings…
After completing this project, I felt much more confident and had a better understanding of myself, including my strengths and areas for improvement.
It’s important to scope out at each stage in order to concentrate on the focus on root problems user or business might be facing.
You can complete tasks according to schedule by managing your time based on your strengths.
When necessary, it’s important to make assumptions based on what you believe will work out best in the situation.
To have a detailed look at the journey of this project, you can go through my Figma file.
Thankyou for reading…Feel free to share your feedback in the comment section below. You can reach me through :
Email: prettywadhera@gmail.com
Thank you once again! #studentforlife
