Redesign of Hotel Review Page
Ctrip (Hotel Business Unit) · 2018 · Design Leader
Overview
In the Hotel BU, user reviews are one of the four most influential factors driving purchase decisions, playing a critical role in conversion rates. However, through user research, competitive analysis, and user flow mapping, we identified multiple usability issues in the existing hotel review list page. To enhance the browsing experience, enabling users to efficiently filter and extract key insights from millions of reviews while supporting booking decisions, our UED team proactively initiated a redesign of the review list page. The goal was to improve review-browsing efficiency and strengthen the correlation between review engagement and booking conversions.
My Role
Platforms
Product
Design Leader
Ctrip Hotel BU
(携程酒店事業部)
Mobile Application
Timeline
2018
Challenges
Unstructured Content
Hotel reviews lacked clear organization, making it hard for users to scan and extract key information.
Information Overload
The overwhelming volume of reviews hindered efficient filtering, limiting their impact on booking decisions.
The Process
Preliminary Research
I conducted a comprehensive preliminary research phase covering business direction analysis, current state evaluation, competitor benchmarking, and user behavior insights. This multi-faceted approach helped me identify pain points and opportunities to align the redesign with both user needs and business goals.
End-to-End Design Execution
Starting from user research and problem definition, through ideation and wireframing, to high-fidelity prototyping and usability testing.
Collaborating closely with product managers, developers, and data analysts, I iteratively refined solutions to ensure usability, performance, and business impact. The process emphasized data-informed decisions and continuous user feedback to optimize the browsing experience and improve booking conversion rates.
Existing Review Page Structure and Problem Analysis
I conducted an information architecture analysis of the current hotel review page. By extracting user click data from the backend, I identified structural issues from a data-driven perspective, revealing key pain points in the existing design.
Macro-Level Information Architecture
-
Content Source: The entire page content is composed of user-generated content.
-
User Intent: Users primarily visit the page to consume reviews and Q&A, supporting the core business goal of informed booking decisions.
-
Content Composition: The user-generated content includes guest-written reviews and replies, as well as official hotel responses.
Detailed Analysis of Review Page Information Architecture
(Data resources: User clicks, sensitive data are masked)
Hidden Important Scores
The scores across various dimensions are critical information with high priority, yet they are hidden inside a collapsible dropdown.
Excessive Levels and Confusing Logic
-
The filter has too many levels with unclear linkage.
-
Key filter options are not emphasized, occupying excessive screen space.
Disorganized and Overloaded
The review content is poorly structured with excessive information density, overwhelming users.
Duplicate Q&A Entry Points
There are two separate entry points for Q&A on this page, causing redundancy.
Users rarely click to expand and view detailed information.
Image clicks have the highest engagement on the page, indicating strong user demand for visuals.
Many users expand full text, showing a need for complete information.
-
Users rarely use the “Trip Type” filter
-
“No Filter,” “Clicked with Images,” and “To Be Improved” ranked highest in user clicks, with rates of 23%, 14%, and 6% respectively
Key Insights:
1. Visibility & Complexity Issues:
Critical scores are hidden, and the filtering system is overly complex and redundant, causing user confusion and wasted screen space.
2. Content Overload:
Users feel overwhelmed by dense and poorly organized review content, impacting information absorption.
3. User Behavior & Preferences:
Users strongly engage with visual content and expanding full text, but often ignore less obvious filters like “Trip Type.”
Competitive Analysis
This competitive analysis examines seven hotel review platforms, focusing on shared components, missing features, and unique highlights. By analyzing review structure, filtering mechanisms, and content presentation, we identified patterns and gaps that inform opportunities for improving the review experience in our redesign.
Competitive Highlights
-
Title Extraction: Booking, Qunar, and Fliggy extract the “most important” sentence from the review content to use as the review title. This helps users quickly grasp key points without reading the full text, improving browsing efficiency. However, accuracy can be an issue, and important information may be missed.
-
Fixed Filters + Suggested Keywords: Apps like Fliggy, Mafengwo, and Dianping further break down filter options into fixed groups of 4–5 items, combined with recommended keywords generated from user reviews, sorted from least to most frequent. This creates a consistent comparison framework for users but relies heavily on user-generated behavior and cannot create “new” needs.
-
No Images in International OTA App Reviews: The benefit is a simplified posting process, lowering the barrier for users to submit reviews. The drawback is that the content becomes text-only, losing the visual context and information that images can provide.
User Action Analysis
By mapping the user review behavior flow in the hotel booking context, I identified pain points in how users browse and interact with reviews. These insights revealed clear optimization opportunities, allowing me to validate assumptions and design targeted improvements that enhance both user experience and business outcomes.
User Experience Map
This map identify key moments where users encounter satisfaction or frustration during their interaction with a product.
Pain points and Opportunities
I identified key user pain points which also revealed untapped opportunities where design improvements could enhance usability, streamline workflows, and increase user satisfaction.
This insight informed targeted design decisions to address critical issues and optimize the overall user experience.
Synthesis of Current Design Issues
Through analysis of click data, competitor benchmarking, and user behavior, we identified three main problem areas in the existing review list page: user ratings, filtering, and review content presentation.
Issue 1: User Ratings
-
Scores from similar guests and all guests show minimal difference, causing user confusion and difficulty in distinction.
-
Detailed scores for different hotel dimensions should be displayed prominently to provide a comprehensive understanding, but currently they are hidden in collapsible sections.
Issue 2: Filtering
-
The filtering logic is confusing and hierarchical structure unclear, reducing filtering efficiency.
Issue 3: Review Content Display
-
User basic information and rating hierarchy are incorrectly displayed.
-
Image sizes are too small, lowering browsing efficiency.
Hi-Fidelity Design
This redesign standardizes the review display, filtering, and interaction rules to improve browsing efficiency and content clarity. By simplifying the top score display, optimizing filter tag hierarchy, and refining review card layouts, the design makes it easier for users to locate relevant reviews quickly. Enhanced image and video presentation rules ensure a richer, more consistent viewing experience, while interaction refinements maintain smooth usability across different scenarios.
Design Validation and Iteration
After one week of A/B testing the new design, I compared click data from domestic and overseas users and collected qualitative feedback from users around me. Based on these insights, I iteratively optimized the visual and interaction design to improve the solution.
Validation method: A/B Testing
Source: A/B Test user click data
1. The Room Type filter’s click-through rate (CTR) dropped by 50%: mainly due to an unclear “Filter” button label. Renaming it to “Filter Room Types” and adding a red dot indicator after filter updates are prioritized to boost engagement.
2. The Expand Filter Menu achieved over 6% CTR : To enhance readability, font size will be reduced and the visible text area and line count increased—considered a medium priority.
3. All other click rates increased by 15% : indicating no immediate need for further optimization.
Conclusion
Data-Driven Problem Solving
By analyzing user behavior and competitive data, I identified key usability issues and designed targeted solutions based on real user needs and business goals, improving the review browsing experience.
Design-Led Impact and Professional Growth
This design team-initiated project demonstrates proactive UX leadership and strengthened my skills in cross-functional collaboration, balancing user and business needs, and iterative design based on data and feedback.