tiket.com Internship

Hotel Comparison Feature

With theme-based recommendations, this hotel comparison feature enables users to easily pick and compare hotels that suit their needs - whether to stay with kids or have a workcation.

Role

Product Designer

Duration

2 months (May - July 2022)

Team

Adriyan (Product Designer), Arkan (UX Illustrator), Rosa Folia (UX Writer)

Background

Capstone Project

Capstone project is Kampus Merdeka interns’ final assignment for their internship that aims to test and implement all KM interns’ learnings. Although I wasn't a part of Kampus Merdeka, I was given the opportunity to participate.

The capstone assignment consists of 3 projects, but in this case study, I will be highlighting Project #1 called the Killer Feature.

PROJECT BRIEF

This killer ‘feature’ should be something ‘new’ to the OTA industries, can be adapted or inspired by current existing features, and is fully explorative.

Constraints

  • Cannot copy ideas from previous batch projects — ideas should be devised by our own

  • Should still consider tech feasibility

  • Feature made should be according to our vertical (in this case, my team can only tackle features around accommodation)

Discovery

Discovery Framework

4C (Collect, Choose, Create, Commit)

In this project, we start off with a completely blank canvas, and since this is explorative, we decided to use the 4C framework to find the topic we want to tackle. The 4C framework allows us to think divergently — gathering and devising numerous ideas at first, and then converging those notions into a topic that we’ll tackle.

Collect

Comparative Studies and Idea Generation Workshop

We did comparative studies to see and understand the current features of other OTAs. Here, we looked through 4 different OTAs’ accommodation flow, namely Airbnb, Traveloka, Agoda, and Booking.com to pinpoint their strengths, weaknesses, and unique features in hope that we can use these traits to generate an opportunity. 

The result of these comparative studies was used as a baseline for our idea generation workshop with the accommodation design team. The objective of this workshop is to gather new insights that we might overlook.

REFLECTION

Aside from doing comparative studies, I think we can also do desk research, where we read journals or articles about future accommodations or users’ traveling behavior. This way, the ideas created can be broader; not limited to the currently existing ones.

workshop overview

Choose & Create

Affinity Diagram

After receiving a handful of insights, we decided to choose and cluster similar ones into several main ideas. This resulted in 4 main ideas: comparison feature, travel communities, stories & reel, and super host.


Among the 4 options, we voted and chose ‘Comparison Feature’ as it was the most relevant to our project brief — to design a new feature that no other OTA has.

PROJECT BRIEF

Before settling down to an option, I think we can list down the pros and cons of each idea first so the decision at the end would be more thoughtful.

Problem encountered

Are we back at square one?

After a long process of ideation, we were faced with a problem that stated our ‘Comparison Feature’ idea, turned out, had been made in the previous capstone and accommodation’s archived projects. Although they have the same concept, both features were different. One tackles comparison in the wishlist feature and the other was about comparison within room level.

As time kept running, and the fact we haven’t even settled on the main topic yet. We found ourselves stuck at a dead end with 2 options to pick from —“Do we go back to square one and brainstorm ideas again?” or “Do we just go with the existing ones and modify them?”

SEEK ASSISTANCE

To help us decide, we consulted to our seniors. With all resources and time constraints in consideration, we decided to just go with the existing idea — comparison feature and make it different.

the problem in a nutshell

Redefining our idea

First, we mapped out the existing comparison feature projects’ values by understanding their user flow and pinpointing their strengths and weakness. Then, we cluster them into each corresponding value and find gaps for us to excel.

Simplicity & Inclusivity

The values we identified were simplicity, clarity, product flexibility, visibility, and inclusivity. From these insights, we mapped out where we all stand (including our idea).

Now, our goal is clear. We are committed to excel in simplicity — making the process simple and easy to understand, and inclusivity — to provide attributes that fit different types of traveler needs.

Uncovering relationships

Next, we break down all of our previous ideas to find relationships between them. From here, we noticed that both ‘workcation’ and ‘super host’ idea comes from a similar notion. Both of these ideas can be turned into thematic categories, which make our comparison feature inclusive as these categories can cater different types of traveler needs.

Commit

What's next?

After settling down our topic, we will move to solutioning. However before jumping into the solution, we will dive deep into our refined idea through research to figure out:

  • What are the problems/goals that drive users to use a comparison feature?

  • How do thematic categories help users compare, and choose hotels?

  • What are the most used attributes and common traveler groups?

Then, when the goals, problems, and categories are defined, we will start crafting. Below is the framework that we use, and a summary of our process.

Research

Research

Through desk research, we were able to find how thematic categories help minimize choice overload.

Through desk research, we were able to find how thematic categories help minimize choice overload.

The Phenomena

Choice Overload

When finding hotels, sometimes, there are just too many options to pick from. These 'too many' options might lead to choice overload, a choice paralysis that describes how people get overwhelmed when they are presented with a large number of options to choose from. Although we might think that more choice is a good thing, in many cases, research has shown that we have a harder time choosing from a larger array of options. Hence, choice overload can drive 2 things: (1) Buyer's Remorse, a sense of regret after buying, and (2) Analysis Paralysis, an event where a user overthinks a decision too much.

Analysis Paralysis

Users have a fear of making the wrong decision and overthinking it, which might prevent them to book hotels.

Users spend too much time doing research.

  • Users are faced with an overwhelming number of choices and information.

  • Sometimes, users aren't 100% sure that the hotel they want to find will actually meet their needs.

Source: Nielsen Norman Group | rechargepayments.com

Buyer's Remorse

Users underthink or overthink product details which leads them to feel regret after booking a hotel room.

“I'm having some buyers remorse. I just booked the Grand Suite, 1 King Bed with Sofa bed for 12-09-2017. After booking I checked the reviews for the hotel on yelp (mistake I should have checked first) and there were many reviews saying the hotel is in bad shape and renovations are badly needed. Nothing like the pictures shown on the hotels website.”​


- Ilse 1959 at tripadvisor.com

GOAL

Empowering users with confidence and flexibility in decision making

Thematic Categories Research

Interest Group Discussion

To determine and find out more about the users of each thematic category, we conducted an interest group discussion where we scouted and read hotel reviews from Facebook traveler communities. Each of us was tasked to extract important data and information from the reviews of a travel community to a spreadsheet that will be sorted to discover:

  • Type of traveler groups (most→least)

  • Type of stay objectives (most→least)

  • Hotel/ room attributes that users consider when reviewing. (We assumed that the attributes shown in reviews are considered important)

glimpse of our master data

Determining Categories

After we sort the data, we compare the result to a survey that our accommodation team has. Overall, both showed a similar result. Hence, to determine the categories, we took the 4 most common stay objectives and travel groups, which are: staycation/vacation (named Healing), workcation, family with kids (as Kids-friendly), and business trip.

Determining what attributes to show on the comparison page and each thematic category was also decided by the most common attributes found in the interest group discussion and combining it with the benchmarked attributes from the archive comparison projects. Below is the result.

REFLECTION

Did we collect too much unnecessary data?

To be frank, I felt like we collected too much unnecessary data. For instance, we collected the number of adults who stayed, the number of nights booked, and their stay locations which in the end, weren’t used at all. I think the time allocated to collect those data could be redirected to adding more quantity of reviews. However, if we collect too little information, I’m afraid that someday we’ll need them and must re-do it all over again. Hence, I think it’s better to be over-prepared than under-prepared.. but what do you think..? (I’m in need of a second opinion)

Design Process

Crafting

Creating the UX Flow

First, we conducted an internal workshop for us to brainstorm our own UX flow version. Then, we take turns explaining each of our creations. Some did it digitally and some preferred to sketch it out on paper.

REFLECTION

Instead of just listening to each other ideas, we can make it like a design critique. When we have doubts/ ideas in mind, we can directly voice them out and write them down on a post-it, so those notions will be documented.

brainstorming workshop

After gathering ideas and inspiration from existing features, we devised the overall user flow. Defining the flow wasn’t as smooth as we thought. Oftentimes, we got stuck, and questions about the flow and designs started to emerge.

Sudden Research Activity

Understanding How Users Compare Hotels

We listed down those questions and chose the important ones to be prioritized because we believe answering these questions could help us make the flow and upcoming designs better. Hence, we came up with a sudden research activity — with the objective to understand the behavior of how users compare hotels. However, since our deadline is approaching and we don’t have much time left on our hands, we decided to do this research quickly; without a defined research plan.

For this research, we merged experience simulation method and user interview. We invited 5 of our friends and observed their behaviors when they compare 2 hotels. Throughout the session, we also asked them questions regarding their actions.

REFLECTION

As our group doesn’t have any UX researchers, we were forced to learn and do the research ourselves. Thus, our process and result here were far from perfect. However, if I got to redo it all over, I would love to make everything more controlled, documented, and consistent, by recording the sessions and having listed scenarios ready. Because during the research process, not all participants received the same questions/prompts and some of their answers weren’t documented properly — which made us vulnerable to losing valuable insights.

Designing the UI

The design system that tiket.com has saves us tremendous time in designing components, this allows us to allocate more time to explore user flows and interfaces based on their guidelines.

Validation

Validation Objective

Usability Testing

The comparison feature we designed is something new to the OTA users. Instead of just ‘comparing’, we provide users with curated hotels based on the chosen thematic category such as kids-friendly, workcation, healing, and business trips. Our objective is to shorten and ease users’ journeys to compare similar hotels based on their liking or needs. Hence, we want to validate this new feature through usability testing.

AWARENESS

To ensure the user understands how to use and navigate the comparison feature

USABILITY ISSUE

To find out what users' pain points when they want to compare hotel

INFORMATION EXPECTATION

To ensure the information shown matches with the users expectations

Screen Designs

These are the designs that we use for usability testing. It covers all the features that we want to validate.

UI screens that we use to validate

Validation Objective

Scenarios & Tasks

We recruited 5 participants outside of tiket.com product interns to run this usability testing. Testing this feature was quite lengthy, so we split the UT tasks into 3 scenarios:

REFLECTION

The tasks and scenarios were too detailed and complicated for users to remember and follow.

During the session, some of the participants struggle to follow along and tend to misunderstand the tasks which made most sessions over time and not maximized as we can’t get them to use our prototypes to its full experience. Aside from that, I learned that conducting UT is exhausting, and it is not a great idea to set all 4 sessions back to back because sometimes the session can get unpredictable and as facilitators, we need to take breaks 🧍🏻‍♀️.

UT Result

Insights Summary

Awareness

  1. Some users find it difficult to get into the entry point on the landing page. Users expect to search the hotel first freely, then compare.

  2. Users understand that all entry point section is for comparing 2 hotels.

  3. Users do not use any of the collapse and expand buttons on the sections of the comparison page.

  4. Users struggle to find the ‘pick attributes’ filter on the comparison page.


Usability Issue

  1. Users struggle to operate the swap button in the entry point sections, disabling them to go to the comparison page.

  2. The ‘pick attributes’ filter on the comparison page is misunderstood to filter hotels instead of adding/removing comparison attributes.


Information Expectation

  1. The information shown on the comparison page suffices all user's needs.

  2. Most users overlook the room sections on the comparison page.

Improvement

Improvement #1

No more swapping

Improving Usability Issue #1 — Users struggle to operate the swap button in the entry point sections, disabling them to go to the comparison page. Instead of swapping, users now can scroll the top and bottom rows independently, and compare the chosen hotel directly.

“I want to compare Meredith and Apurva.. but the top one can’t be changed, so I’m quite confused. Does this mean we can only compare the Dormire hotel with one of the 3? I was initially unaware that we can press this swap button, it was unclear, I didn’t know we can swap the top & bottom hotel.”


— Michael

REFLECTION

Although I think the ‘new’ design solves the user's concern, I think that this design still has a lot of flaws. One of my major concerns is that what if the users want to compare hotels within the top row only? Separating hotels into 2 sections restricts them to compare freely. But again, due to time constraints, we decided not to tackle this concern as it would need us to revamp the whole flow & concept which will take time.

Improvement #2

More concise page

​Improving

  • Awareness #3 — Users do not use any of the collapse and expand buttons on the sections of the comparison page.

  • Information Expectation #2 — Most users overlook the room sections on the comparison page.

We observed that users only looked at the recommended rooms and overlooked the normal ones. Hence, to make this page shorter, we decided to show the recommended rooms only with clearer wording, to prevent choice overload

“I thought this all room section belongs to 1 hotel. Maybe this all room section could be given a better identifier or wording to differentiate which one belongs to hotel 1 or hotel 2.”


— Abel

REFLECTION

To be honest, I don’t remember why we took out the collapse button… Although users might not use it on this UT, I feel like the collapse button would still be helpful in the long term. So if I can improve this design, I will still include the collapse button.

Improvement #3

More concise page

Improving

  • Awareness #4 — Users struggle to find the ‘pick attributes’ filter on the comparison page.

  • Usability Issue #2 — The ‘pick attributes’ filter on the comparison page is misunderstood to filter hotels instead of adding/removing comparison attributes.


Previously, the filter entry point can be found on top of the comparison page, but now we moved it to the facilities section to make it coherent with its function. Additionally, the bottom sheet wording and layout were changed to sync with the layout of the facilities section so it’d be more consistent. The icon was also switched to a clearer vision of a filter, to prevent confusion.

“Wait.. so this filter will filter..the hotel? Oh, wait this filter, filters the facilities that are shown on the page before. It took me a while to understand that the checked ones are shown previously. It was quite confusing at the beginning but this filtering thing is nice to have.”


— Victor

Output

Final Designs

Comparing hotels should be hassle-free and inclusive.

Comparing hotels should be hassle-free and inclusive.

Entry Points

Curated Theme-based Recommendation

Having curated recommendations reduces the number of hotel options and increases the findability of relevant hotels that suit users’ needs.

PROBLEM SOLVED

  • Overwhelming number of choices and information

  • ​Sometimes, users aren't 100% sure that the hotel they want to find will actually meet their needs.

Inclusive for all Travelers to compare hotels that suit their needs

Inclusive for all Travelers to compare hotels that suit their needs

Feel more personalized with a thematic background

Custom-made background that represents the category you choose.

Skim easily with curated side-by-side information

We show precise and just the right amount of information for you to compare.

PROBLEM SOLVED

Users spend too much time doing research.

Highlighting your priorities

We ensure that your needs are highlighted first.

Adjust your needs with customized filter

Users have the ability to select and compare facilities that you just need.

PROBLEM SOLVED

  • Overwhelming number of choices and information​

  • ​Sometimes, users aren't 100% sure that the hotel they want to find will actually meet their needs.

See nearby destinations

Find the best hotel that is surrounded by attractions and area that you’re interested in.

Feel more confident with reviews & ratings

Easily read reviews and view photos from guests.

GOAL

Help users feel confident in making decisions

Find the most suitable room for you

From countless room options, we shortlisted it to give you the best recommendation.

PROBLEM SOLVED

Sometimes, users aren't 100% sure that the hotel they want to find will actually meet their needs.

Change it anytime

Finding the perfect match is hard. So, we give you the option to change hotels to our recommended ones.

GOAL

Reassure users that they aren’t locked in to their decision

CAPSTONE PRESENTATION

See our full capstone presentation, here!

Reflection

Key Takeaways

Since our team didn't have any researchers, all of us were forced to wear different kinds of hats and experience different scope of works. In this project, I genuinely learned a lot. I discovered that being a UX Researcher is more than documenting and synthesizing results, but instead, we got to have great communication and improvisation skills - because we need to spark connections with users to build a safe environment for them to open up.


Aside from that I also reflected that:

  • We need to be agile — There are numerous times that we have to alter our timeline throughout this capstone project. Sometimes it is due to holidays, colleagues’ leave, mismatch of schedules, or as simple as, the plan just goes south. Hence, we practiced ourselves to adapt quickly to the changes.

  • We need to enjoy the process — Some projects aren’t as smooth as we thought, and that’s okay because it’s the beauty of embracing imperfections; enjoy the learnings we receive from failures, and the bond we strengthen from tough situations.

  • Success metrics — In this project, we haven't thought of one yet because the chances of this project being developed are still low. However, as a practice, it would still be nice if we can identify the metrics that we can use to measure the product's success. For instance: CVR will be used to measure the percentage of users that proceed to book a certain hotel after using our comparison feature.

...