Trip.com Group, 2023

Hotel eBooking System Design

Role

UX Design Intern

Team

Trip.com Group Hotel XD (HxD)

Timeframe

2 Weeks

Trip.com Group, 2023

Hotel eBooking System Design

Role

UX Design Intern

Team

Trip.com Group HxD

Timeframe

2 Weeks

Trip.com Group, 2023

Hotel eBooking System Design

Role

UX Design Intern

Team

Trip.com Group Hotel XD (HxD)

Timeframe

2 Weeks

Overview

eBooking is the core hotel management tool of Trip.com Group, designed to help hotel managers handle orders and communicate with customers. As a UX design intern, my responsibility was to enhance the batch operations feature to improve user satisfaction.

Stakeholders

For this project, I had to continuously communicate with my stakeholders to update them on my progress as well as be proactive in seeking out feedback. I checked in with software engineer for engineering feedback to identify any limitations or restrictions and proposed solutions to any roadblocks. I received creative feedback from weekly design meetings with the Trip.com Group hotel design team. I also had the opportunity to work with and received insights from the team, with Senior UX Designer and Product Manager.

60%

Time Saved

75%

Reduction in Error Rate

Problem

High Error Rate in Current Batch Operations

Batch operations are crucial for hotel managers who often need to handle 300-1000 tasks simultaneously, making individual processing impractical. However, user feedback indicated dissatisfaction with the existing batch operations feature, leading to high error rates (misclicks) and consequently, a high churn rate. The efficiency of the eBooking platform significantly influences whether users choose Trip.com Group as their primary platform for hotel manageme

Goals

HMW-How might we improve batch operations to increase user retention?

Key Issues Identified:

Button Placement Confusion

Button Placement Confusion


35% of users reported difficulty locating the batch operations button on the interface. The primary action button shifts from the top right corner to the bottom left corner upon entering batch operation mode, causing confusion.


Inconsistent Interface Design

Inconsistent Interface Design


27% of users complained about the inconsistency in batch operation functions across different system interfaces. I discovered that batch operation buttons are placed differently across various interfaces, which is not intuitive and hampers efficient user operations.


User story

What kind of batch operation do users need?

To understand the use cases for batch operations, I analyzed user feedback from our customer support team at Trip.com Group and distilled the information into three user stories to gain empathetic insights:

Mr. Wang

Hotel Manager

As a hotel manager, Mr. Wang needs to handle hundreds of orders and customer requests daily. Batch operations help him process tasks quickly and improve work efficiency.

Ms. Li

Receptionist

Ms. Li finds the inconsistent placement and functionality of batch operation buttons across different eBooking interfaces confusing, impacting her efficiency.

Ms. Zhao

Receptionist

Ms. Zhao frequently misclicks due to changing button placements and non-intuitive operations, leading to errors and reduced efficiency. He desires a more intuitive batch operation feature.

RESEARCH

How do our competitors do it?

To identify areas for improvement, I conducted a competitor analysis of major hotel management tools, including domestic and international competitors such as Huazhu Hotel Management System and Meituan Hotel Management Tools. I also carefully studied the common usage of batch operation in the most popular design systems, such as Ant Design and Arco.


Here are the results:

To identify areas for improvement, I conducted a competitor analysis of major hotel management tools, including domestic and international competitors such as Huazhu Hotel Management System and Meituan Hotel Management Tools. I also carefully studied the common usage of batch operation in the most popular design systems, such as Ant Design and Arco.


Here are the results:

To identify areas for improvement, I conducted a competitor analysis of major hotel management tools, including domestic and international competitors such as Huazhu Hotel Management System and Meituan Hotel Management Tools. I also carefully studied the common usage of batch operation in the most popular design systems, such as Ant Design and Arco.


Here are the results:

Functional
Completeness:

Most competitors have comprehensive batch operation functions with simple and user-friendly processes.

Intuitive
Interfaces:

Some tools emphasize intuitive interface design, with fixed and easily locatable batch operation buttons.

Operational
Consistency:

Leading competitors maintain consistent operations across different interfaces, reducing user learning costs.

Design

Integrate Different Batch Operations into a Dropdown List:

This approach aims to improve the intuitiveness of user operations, allowing users to find all batch operation functions in a unified location.

Add a 'Select This Page' Option:

This prevents users from inadvertently selecting all information, ensuring they don't miss important content.

Add a Data Indicator ('Selected Count/Total Count') at the Bottom:

This feature reinforces user operation feedback, letting users clearly know the current selection status.

Advocate for UX

During the design process, I encountered some disagreements with the Product Manager (PM) regarding the implementation of the batch operations feature.

PM's Proposition:
Higher Information Density

Influenced by the density of Chinese characters and user habits in China, the PM believed that users should be able to see as much content as possible in a given area.

Designer's Perspective
Better Navigation

I believed that clearly indicating batch operations in the table would help users complete tasks more efficiently. Explicitly marking batch operation functions would reduce confusion and enhance user experience by making the process more intuitive.


I believed that clearly indicating batch operations in the table would help users complete tasks more efficiently. Explicitly marking batch operation functions would reduce confusion and making the process more intuitive.


Persuading the Product Manager

To validate my perspective and persuade the Product Manager, I conducted another user research study.


According to my previous research, the ambiguity of the checkbox in the header might confuse users. Specifically, users might not understand whether clicking this checkbox selects all content on the current page or all content overall. To test this hypothesis, I interviewed 15 hotel managers through WeChat.


The user survey revealed that 12 out of 15 participants did not understand that all batch operations were hidden behind the dropdown menu. This finding supported my argument that hiding batch operations could lead to user confusion and inefficiency.

To validate my perspective and persuade the Product Manager, I conducted another user research study.


According to my previous research, the ambiguity of the checkbox in the header might confuse users. Specifically, users might not understand whether clicking this checkbox selects all content on the current page or all content overall. To test this hypothesis, I interviewed 15 hotel managers through WeChat.


The user survey revealed that 12 out of 15 participants did not understand that all batch operations were hidden behind the dropdown menu. This finding supported my argument that hiding batch operations could lead to user confusion and inefficiency.

To validate my perspective and persuade the Product Manager, I conducted another user research study.


According to my previous research, the ambiguity of the checkbox in the header might confuse users. Specifically, users might not understand whether clicking this checkbox selects all content on the current page or all content overall. To test this hypothesis, I interviewed 15 hotel managers through WeChat.


The user survey revealed that 12 out of 15 participants did not understand that all batch operations were hidden behind the dropdown menu. This finding supported my argument that hiding batch operations could lead to user confusion and inefficiency.

These results helped demonstrate the importance of clear guidance in the user interface, ultimately leading to a design that balanced screen efficiency with user experience.



© 2024 Hanyang Yan. All rights reserved.

Last Updated - 06/10/2024


Design System

In collaboration with the senior UX designer, I played a key role in integrating our project into the Trip.com Group hotel design system. My responsibilities included developing comprehensive adaptation rules to ensure the design system's seamless application across various scenarios. This effort ensured consistency and flexibility, allowing the design system to be effectively utilized in diverse contexts within the organization.

Takeaways

Develop Design Craft

This project allowed me to practice critical thinking, attention to detail, and human-centered design thinking to consider all the useful features I could add to such a simple tool. I sought opportunities to experiment with novel interactions and patterns and explore edge cases that were not initially captured in the project brief. Through my collaborations with engineering, I was able to learn how to consider edge cases and understand backend logic to build a component for the Design Library System.


In the end, I was able to deliver a feature that is intuitive and functional, with a visual system designed to subtly educate the users of shortcuts available but ultimately give all control and flexibility to the end-user. The most rewarding experience for me is knowing that Trip.com Group teams will use my intern project.

Strategically persuade other stakeholder

Initially my hypothesis and design goals were challenged by PM. I realized when designing corporate products, it is crucial to make research-backed deicisions to ensure we align with customer values.


When negotiating with other roles, designers should wear other people’s shoes. For example, I pursuaded the engineer to accept my design by reasoning that it would actually benefit them when the next feature was in development.


Previous to Trip.com Group, I have only worked on products of which myself was a user, where I can trust my gut feelings sometimes, as they come from my understanding of the product after prolonged use. However, when designing for products that designers are not personally familiar with, evaluating hypothesis and testing design is very crutial to avoid misalignments with user needs.

© 2024 Hanyang Yan. All rights reserved.

Last Updated - 06/10/2024

© 2024 Hanyang Yan. All rights reserved.

Last Updated - 06/10/2024