case study

Increased conversion rate in German market through UX/UI design

TravelBird was a leading online travel agency (OTA) that offered personalized travel deals to 15K+ users daily.

Project Type
Online travel conversion optimization
UX/UI Design
Interaction Design
Responsive Web Design
Key Outcome
Increased conversion rate by 10%
3 weeks


The TravelBird team in Germany was getting feedback and requests from users who wanted a way to browse travel deals near them. Specifically, users wanted offers for places they could travel to by car within a few hours. By designing this feature for the German market, we hoped to increase the number of daily bookings.

Strategy and approach

Defined UX/UI design requirements

I mapped out the scope with the Head of Design and Product Owner. The requirements were: pragmatic design to ship without additional back-end efforts, responsive web design so pages render well on different devices and screen sizes, a page for search and results, and clear entry points on the homepage and search bar.

Wireframe sketches by UX designer Amsterdam
Interface with car icon and line with three radio buttons
Localized UI to German preferences

I considered different ways to design the search results user interface. For example, showing places you can drive to within 2 or 3 hours. But German users are very precise. They prefer to know the number of kilometers. They are also sensitive to privacy and sharing personal information.

With all this in mind, I designed the interface with 3 radio buttons to search within 300 km, 500 km or 700 km – the most common travel distances. I decided not to automatically populate the user’s location or require this data to perform a search.

Mobile screens flow chart, pop-up to allow use of current location
Mobile flow showing multiple entry points. Users asked for their location only when they express interest in finding nearby deals, as opposed to when they load the website.
Explored several map design options

A ‘nearby’ concept is not easy to visualize. So I created wireframes to explore and compare multiple design options. For example, we could present the map as a circle, donut, or filled circle.

We debated features and functionality. Should the search results include the user’s city? How interactive should the map be?

This was a tough decision, but in the end we went with a simple visualization to ensure ease of use. I used a flat design style for the map, with a radius and pins to represent points of interest. Next to the map, I placed photos of German cities to help users connect with areas of interest.

Different Germany map options presented by UX designer AmsterdamDifferent Germany map options presented by UX designer Amsterdam
Photos of famous sites in Munich and BerlinPhotos of famous sites in Munich and Berlin
Map with three orange markers showing offers within driving distance
Strategic use of color

Color plays an important role in UX/UI design. A consistent color scheme builds trust and familiarity. Furthermore, use of specific colors for specific content types gives each color a meaning.

TravelBird had three colors in their logo. I reserved the TravelBird yellow for call-to-action buttons, the blue for search box elements, and the orange for deal labels. In this way, users learned to associate orange with travel deals.

Saw a 10% increase in conversion rates, which amounted to approximately 65,000 euros in revenue in the first two weeks.


Effective design

A simple, clean design gave users an easy way to search for deals near them.

Increased conversion rate

Saw a 10% increase in conversion rates, which amounted to approximately 65,000 euros in revenue in the first two weeks.

Covered all use cases

The final result covered all use cases, entry points, and worked well on desktop and mobile web.

Increased bookings by designing a new way to search travel deals

Final UX UI design with search fields, map, and hotel options

Additional services provided for this client

Product (UX/UI) Design

Improved the aesthetics and usability of the product including the order confirmation page, payment page, success and error handling pages. Improved communication of prices and availability with an easy-to-read visual calendar.

Checkout Flow

Mapped out the user flow to identify user pain points and opportunities to simplify the purchasing process.

Blog Design

Designed blog to be used by editors in 10+ countries and languages. Ensured design template and code accommodated various needs and scenarios to prevent brand inconsistency.

Conversion Rates

Increased conversion rate by 2.9% by tweaking the room selection feature.

Want to increase your conversion rate like TravelBird did?

Get in touch