Product Cards: Tailoring experiences to diverse needs
With TUI’s vast catalog of travel experiences, users needed a search tool that was powerful yet intuitive. The previous search bar lacked customization, making it difficult to refine searches efficiently. My redesign focused on balancing functionality and usability—introducing a dynamic search bar that adapts to different products, improves discoverability, and enhances the overall user experience. Through research, iterative design, and close collaboration with developers, we created a seamless and visually engaging solution that is now being rolled out across TUI Iberia
🃏 Context
TUI offers a wide range of travel products, including vacation packages, flights + hotels, custom trips, hotels, activities, transfers, and cruises. However, the search experience was outdated and ineffective. Users often struggled with a lack of advanced filtering options, a cluttered interface, and generic search fields that didn’t adapt to different product types. Given TUI’s expansion into B2C, improving the search experience became a priority.
🔎 Initial research
User feedback
To identify key pain points, we analyzed heatmaps, customer support inquiries, and direct user feedback. Many users found the search experience frustrating due to unclear filtering options and an inefficient use of space. The lack of customization also led to confusion, as all search types followed a rigid structure. Additionally, essential filters were hidden, making it difficult to refine searches effectively.
Understanding the problems
To identify key pain points, we analyzed heatmaps, customer support inquiries, and direct user feedback. Many users found the search experience frustrating due to unclear filtering options and an inefficient use of space. The lack of customization also led to confusion, as all search types followed a rigid structure. Additionally, essential filters were hidden, making it difficult to refine searches effectively.
Competitive analysis & heuristic evaluation
We benchmarked against leading travel platforms to identify best practices in adaptive search fields, multi-step filtering, and persistent search bars. An expert review of our existing search functionality highlighted usability issues, including poor layout prioritization, inefficient space distribution, and an overwhelming number of generic input fields.
🎯 Defining objetives
The redesign needed to make key information easy to find while keeping navigation intuitive. A balance had to be struck between expanding filtering options and maintaining a clean, user-friendly interface. Visually, the new design aimed to create a modern and engaging experience that aligned with TUI’s branding. Functionally, we introduced a search bar with multiple states—compact by default and expanding when activated—allowing for a more dynamic and efficient user experience.
⚜️ Design & Prototyping
Wireframing the solution
We started with rough paper sketches to explore layout ideas, followed by structured component alignment and low-fidelity wireframes. The goal was to ensure clear information hierarchy and intuitive navigation.
From Concept to High-Fidelity prototypes
After validating wireframes, we moved to high-fidelity prototypes in Figma, incorporating advanced filtering panels, product-specific search fields, and improved visual hierarchy. The new design also featured a more aesthetically refined layout, addressing the previous version’s cluttered appearance.
✅ Validation
Testing & refinement
As the redesign is still in the launch phase, full-scale user testing in a real environment has yet to be conducted. However, preliminary tests with internal stakeholders provided valuable feedback. Based on this, we refined button placements for better accessibility, improved contrast and typography for readability, and optimized the filtering logic for a smoother search experience.
👨🏽💻 Implementation
Bringing the design to life
Collaboration with the development team ensured pixel-perfect implementation and smooth interactions. Extensive quality assurance testing was conducted to verify cross-browser compatibility, mobile responsiveness, and interaction consistency across all search types.
🚀 Launch & iteration
Rolling out the new experience
The redesigned search bar is currently in the process of being launched across all TUI Iberia pages, providing a unified and improved experience. Once fully deployed, we will gather analytics on search usage, track engagement through heatmaps, and collect direct user feedback to measure its impact.
Looking ahead
Future iterations will be guided by conversion rate analysis, seasonal travel trends, and advancements in AI-driven search enhancements. The redesign sets a strong foundation for a more intuitive and efficient search experience that evolves with user needs.
Final toughts
Future iterations will be guided by conversion rate analysis, seasonal travel trends, and advancements in AI-driven search enhancements. The redesign sets a strong foundation for a more intuitive and efficient search experience that evolves with user needs.