Projects
Expedia Redesign — Improving Usability & Accessibility for Travel Booking
Redesigning a cluttered travel booking experience into a clean, accessible, and user-friendly interface.
Role: UX Designer (Team Project)
Team: Eric Nguyen, Trisha Gite, Mcgwire Price, Nathaniel Joseph
Tools: Figma
Duration: January - May 2026
Problem :
The current Expedia interface creates friction during the booking process due to cluttered layouts, unclear icons, weak feedback, and limited accessibility features. Users, especially older adults, struggle to read content, understand key actions, and confidently complete bookings.
The homepage contains unnecessary suggestions that distract from the main task. Important controls such as selecting dates or number of travelers are not immediately clear, causing hesitation. Error messages do not stand out or clearly explain what went wrong, making it harder for users to recover from mistakes. Additionally, the lack of accessibility features like dark mode and adjustable text sizing limits usability for a wider range of users.
Design Goals :
The primary goal of this redesign was to improve usability, accessibility, and clarity across the entire booking experience.
The interface was simplified to reduce cognitive overload and help users focus on essential actions. Navigation and booking flow were redesigned to be more intuitive and consistent, reducing hesitation during key tasks. Clear, real-time feedback was introduced to guide users and confirm their actions.
Accessibility improvements were a major focus. Font sizes and spacing were increased to improve readability, especially for older users. A dark mode option was introduced to reduce eye strain, and color contrast was enhanced to make content easier to distinguish.
Visually, the design emphasizes strong hierarchy, cleaner layouts, and better organization. Advertisements were reduced in prominence to minimize distractions, and consistent styling was applied across all pages to improve usability and recognition.
Process :
Initial Analysis :-
The redesign began with an evaluation of the existing Expedia interface to identify usability issues.
- Homepage was cluttered with unnecessary content, making it hard to focus on primary tasks
- Icons for dates and number of travelers were unclear and confusing
- Booking flow required users to re-enter information when switching pages
- Error messages were not prominent or clearly tied to inputs
- Checkout layout included unnecessary navigation elements that distracted users
Wireframing :-
Low-fidelity sketches were created to explore layout improvements and simplify the user experience across key screens.
- Designed homepage, search results, checkout, mobile layouts, and dark mode version
- Prioritized search functionality with larger, clearer input fields
- Improved readability and organization on search results page
- Structured checkout page with clearly separated sections
- Adapted layouts for responsive use across mobile, tablet, and desktop
Figure 1 : Wireframe Designs at the Start of the Redesigning Phase
Key Design Decisions :-
Testing :-
Usability testing was conducted with five participants using a think-aloud protocol.
Tasks included :
- Identify purpose of the homepage
- Search for a trip
- Select a listing
- Complete checkout and fix errors
- Enable dark mode
Key Findings :-
- Icons were frequently misunderstood, especially for dates and travelers
- Filters were not immediately visible and often overlooked
- Error messages lacked visibility and clarity
- Dark mode toggle was difficult to locate
- Checkout fields caused confusion due to unclear labeling
User Feedback :-
"I didn't realize the middle icon was a calendar."
"The error message is helpful but doesn't stand out enough."
Iterations :-
Based on testing feedback, the design was refined with the following changes:
- Updated icons and added labels to improve recognition
- Increased visibility of filter section with better contrast
- Redesigned error messages to appear directly below inputs
- Repositioned dark mode toggle to top navigation
- Added clear labels to checkout input fields
- Introduced confirmation feedback and interaction animations
Final Design
The final design focuses on clarity, accessibility, and ease of use across both desktop and mobile experiences. The homepage presents a clean and focused interface centered around the search function. Input fields are larger and clearly labeled, making them easier to understand and interact with. The search results page is organized to improve readability and make filters more accessible. Listings are easier to scan, with clear emphasis on key information such as price and ratings. The checkout page is structured to guide users step-by-step through the process. Sections are clearly separated, input fields are labeled, and error messages provide immediate and helpful feedback. A dark mode version is available, offering a high-contrast, visually comfortable alternative for users. The mobile experience is fully responsive, maintaining consistency while adapting layout and navigation for smaller screens.
An interactive prototype is available to demonstrate the full user experience in the follwing link : https://tripbooker.netlify.app/
Outcome
The redesigned interface improves usability by reducing confusion and simplifying the booking process. Users are able to complete tasks more efficiently with fewer errors.
Clarity improvements such as labeled icons and stronger visual hierarchy make navigation more intuitive. Enhanced feedback mechanisms increase user confidence during interactions, particularly during checkout.
Accessibility enhancements, including improved readability and dark mode, make the interface more inclusive for a wider range of users.
Overall, the redesign creates a smoother, more user-friendly experience that addresses the key pain points identified in the original interface.
Figure 2 : The Final Look of the End Product that is clickable and Functioning. As compared to the original wireframes created in the start, the final product looks more enhanced and high fideilty after constant refinements and user feedbacks.
Figure 3 : The Final Look of the End Product in Dark Mode Theme
Reflection
This project emphasized the importance of designing for clarity and usability over complexity. Testing revealed that even small design elements, such as icons and labels, can significantly impact user understanding.
The process reinforced the value of iterative design and user feedback in uncovering real usability issues. It also highlighted the importance of accessibility in creating inclusive digital experiences.
Given more time, further testing with a broader range of users would help refine the design even more. Additional improvements could include expanding accessibility features and further optimizing the mobile experience.