Client
Hotel Engine
Timeline
My role
Lead Product Designer
platform
Web App, Mobile App
Context
Hotel Engine makes corporate travel easier by helping businesses save time and money. But our autocomplete and autosuggest in search aren’t up to par, and users are dropping off right at the start of their booking.
business problem
Autocomplete required three letters to activate, lacked personalization, and delivered confusing results, leading to high user drop-off at the start of the search journey.
overall goal
Redesign the autocomplete and autosuggest experience to match industry standards, deliver personalized search results, and minimize user drop-off.
solution
Improve the search experience by improving autocomplete and adding personalized autosuggest features. Eliminate friction in the process, making it smoother and easier for users to complete their bookings seamlessly.
impact
Before the redesign, autocomplete required typing 3 letters to activate. After our first launch, it activated with just 1 letter, leading to:
Reduced autocomplete trigger from 3 to 1: Users experienced faster, more responsive search.
Expanded autosuggest categories by 2.5x: Suggestions went beyond locations to include points of interest, hotels, businesses, and hospitals.
15% reduction in user drop-off: Improved search experience kept users engaged and increased booking completions.
my role
As Lead Product Designer, I led a design sprint with the engineering team, product team, and stakeholders to define the feature vision and plan the steps to achieve it.
I crafted the UX strategy, mapped customer journeys, designed intuitive solutions, and introduced a new design system palette.
I conducted research, developed concepts, managed implementation, and worked with cross-functional teams to resolve challenges and deliver the project on time.
Goal 1
Achieve feature parity
Reduce autocomplete trigger from 3 to 1
Personalize autosuggest by providing more relevant suggest and including more categories
Enhancing Clarity: Relevant Icons, Address Format, and Key Highlights
How does the Autocomplete feature measure up against our direct competitors?
Problem #1
The current autocomplete experience fell short of industry standards.
Autocomplete required users to type three letters before activating, causing them to believe the feature didn’t exist.
Autosuggest showed only locations and didn’t differentiate between U.S. and international cities, causing confusion.
Autosuggest results lacked visual clarity.
research insight #1
Competitive Research on E-Commerce Autocomplete Features: Driving Engagement and Conversions
Highlighting Autosuggestions: Most platforms emphasized autosuggested terms over the user’s input.
Use of Bold Text:
The majority bolded the autosuggestions.
A smaller number bolded the user’s input.
Design Decision: Based on the trend, we chose to bold the autosuggestions to align with user expectations and enhance clarity.
solution #1
Reduced autocomplete trigger from 3 to 1 for a faster, more responsive search.
Reduced trigger to 1 letter for quicker searches
Users can now search across categories, including locations, airports, hotels, points of interest, and hospitals
Icons added to each category for improved visual clarity
Background masking enhances focus and overall experience
First-Letter trigger: Prioritizes favorites and relevant matches
Search categories expanded 2.5x with relevant icons across 5 categories
Clear result format: Distinguishing U.S. vs. International locations
Result format: Including rules for long names & wrapping
impact 1
Surpassed competitor parity: Enhanced mobile & web Autocomplete with e-Commerce-inspired features
goal 2
Reduce user drop off by 10%
Reduced user drop-off by creating a seamless and intuitive search experience.
Removed friction in the search flow to streamline the booking process.
Designed the experience to be smooth and effortless for users.
Problem #2
Significant user drop-off occurred between the search and booking experience.
After typing in the search, users weren’t automatically taken to the next step.
They had to leave the flow to pick dates and come back to choose the number of guests.
This back-and-forth caused frustration and led to a lot of drop-offs.
solution #2
Removing friction for a seamless “search-to-booking experience”
Moved seamlessly from search to selecting dates and number of guests.
Updated check-in and check-out dates without restarting the process.
Added background masking for better focus and clarity during search.
Background masking for improved focus and clarity during search
impact 2
Search categories expanded 2.5x with icons across 5 categories
15% reduction in user drop-off: Improved search experience kept users engaged and increased booking completions.
