Booking.com on ChatGPT - Designing our first travel experience inside an LLM
In today’s digital landscape, a strong social media presence is crucial, but small businesses often struggle with consistency. To tackle this, we set out to design SocialMaster, an AI-powered tool that helps business owners to manage content and strategic planning effectively.
Booking.com
Partnerships
2025
My role
Product Designer
Team
1 Designer, 2 Product Managers, FE and BE developers, Booking Holdings VP leadership, external stakeholders
+14
SCENARIO
OpenAI have a launching event to exhibit the new features and integrations ChatGPT will have.
A partnerships with Booking.com was started to showcase the new capabilities.
The project deadline: 4 weeks
PROBLEM
Help ChaGPT users to discover Booking.com hotels when planing a trip in the chat
The hypothesis
Display a discovery carousel with visual assets on ChatGPT native widget will increase discovery rate from LLM directing to conversion on the app and M.dot
PRODUCT REQUIREMENTS
Be interactive, keep the experience integrated with chatGPT UI
PRODUCT REQUIREMENTS
Consistent user experience, legal copy, strong branding
for how many people? ...
AI fetch data and asks for the data missing
What kind of hotel do you prefer?
Ai asks for Hotel styles?
"Where can I stay in Barcelona for 3 nights in November?"
Here are hotels that match your preferences:
CHatGPT
B.com mdot/app/web/mobile
User prompt
Filtering hotels
Hotel carousel
Input
Getting user data
Hotel detail page
Output
User flow
USER RESEARCH
What we know about early trip discovery phase at Booking.com?
Due to the project deadline time for research were not possible. So I had to look for any research available for early discovery we already have at Booking.com and for any current experiments done by the AI team.
Most Valued Items on the Hotel Card (in Importance Order)
1/ Rich Visual Content (Photos & Videos) Conveying “Vibe
Users consistently prioritize engaging images and videos that authentically communicate a hotel’s atmosphere, appeal, and “vibe.” Travelers are inspired by visual cues similar to those seen on social media.
2/ Price and Value Transparently Displayed
Users—especially “Value Seekers”—focus on clear, competitive pricing and deals. Calls out promotions, bundled offers, and total cost transparency directly influence users’ initial choices and foster trust during discovery.
3/ Guest Reviews & Authentic Ratings
Unfiltered ratings, the number of reviews, and recent feedback are essential for users to build confidence in their selections. They rely on real traveler experiences as a shortcut to identify quality and avoid risk.
4/ Location and proximity to points of interest
Users want quick access to practical location details, including proximity to attractions or landmarks, ease of transport, and realistic expectations about travel times. The “realistic sense of timelines” is important for planning.
5/ Hotel facilities matching preferences
Users with a preference for control value the ability to shape recommendations directly from the hotel card—for example, filtering by theme (adventure, relax, culture), budget, or interests. They appreciate cards that let them quickly refine their search or see relevant options
Research important info
- The importance order may vary by traveler mindset; however, visual content and price/value remain top priorities across groups
- The evidence is derived mainly from qualitative and behavioral insights
Design
Explorations with AI
The contract card is the backbone of the contract module. All other module functionality and cross-module interactions rely on it. I was responsible for building this critical component from scratch, aiming to incorporate market best practices and add extra value. I faced several high-level challenges:
1/ Structured data
I explored with different AI's what type of information should be on the carousel and in which order
The design iteration
I did explorations with the interactions available and UI patterns on our Design system for similar experiences
V3
Team proposal :
My decision
Add an image slider inside the carrousel
Push back on nested interaction
Team proposal :
Add an image slider inside the carrousel
My decision
Push back on nested interaction
LIMITATIONS
Challenges and how I overcome it
text
1/ OpenAI didn't supported Full screen interaction for the MVP launch
Challenge:The experience changed a lot since we didn't have the Full screen mode supported by the SDK and we could not do nested interactions.What I did:So I decided to push the team to go back to the previous version without the full screen where we can guarantee a good user experience.
12/12
Interviewers preferred within the context and view the entire hierarchy of complex contract
1/ Display rating system for US users
Challenge:OpenAI wants us to remove the rating to gain space. Also because they are showed currently on US, location of interest for first launch.What I did:
I aligned with PPM's and looked for previous research and experimentBased on internal research: Hotel star rating systems are vastly different across Europe compared to the US, which can lead to confusion, disappointment and poor guest experiences when Americans travel abroad. There are opportunities to set better expectations when US customers are booking trips abroad. (source: Product localisation opportunities research)My design decision:
Keep the rating
based on previous research and experiments.We should not over optimise for mvp. It is not a legal requirement or hard requirement from OpenAI.We can work on conversion later.
Impact of my decision:Keeping the rating can mean lower conversation rates on US as showed on previous experiments for the sake of consistency, but I believe it was a biased conclusion and I would like to do further experiments.
1/ Error messages for LLMs
The way we think of error messages for non-LLM experiences doesn't work as well for LLMs. Because the LLM will try to solve if our tool doesn't work.
Hoe we can keep them engaged with our tool, if no initial results are shared.
1/ Our API don't support most popular facilities
Challenge:Our API don't support most popular facilitiesWhat I did:I decided with developers to manually define the most popular facilities using our current rating criteria + the facilities mentioned by the user.Impact of my decision:Now the facility asked for by the user in the prompt will be shown first, followed by other facilities. For example, Beachfront is displayed first when I ask for hotels near a beach:
1/ Widget don't return any results and LLM can't hide the widget when is rendering - Need a back-up empty state
Users consistently prioritize engaging images and videos that authentically communicate a hotel’s atmosphere, appeal, and “vibe.” This content is especially influential during the early browse stage, as travelers are inspired by visual cues similar to those seen on social media.
The design solution
Using the new ChatGPT native widget to display a discovery carousel with visual assets will increase discovery rate from LLM directing to conversion on the app and M.dot
We believed that small businesses needed a more efficient and simplistic way to manage their social media presence across multiple platforms.
The MVP
Less customisation, more parity and integration with ChatGPT experience
We believed that small businesses needed a more efficient and simplistic way to manage their social media presence across multiple platforms.
Results
2.5K search requests per hour on launch
LEARNIGS
Help ChaGPT users to discover Booking.com hotels when planing a trip in the chat
The contract card is the backbone of the contract module. All other module functionality and cross-module interactions rely on it. I was responsible for building this critical component from scratch, aiming to incorporate market best practices and add extra value. I faced several high-level challenges:
Booking.com on ChatGPT - Designing our first travel experience inside an LLM
In today’s digital landscape, a strong social media presence is crucial, but small businesses often struggle with consistency. To tackle this, we set out to design SocialMaster, an AI-powered tool that helps business owners to manage content and strategic planning effectively.
Booking.com
Partnerships
2025
My role
Product Designer
Team
1 Designer, 2 Product Managers, FE and BE developers, Booking Holdings VP leadership, external stakeholders
+14
SCENARIO
OpenAI have a launching event to exhibit the new features and integrations ChatGPT will have.
A partnerships with Booking.com was started to showcase the new capabilities.
The project deadline: 4 weeks
PROBLEM
Help ChaGPT users to discover Booking.com hotels when planing a trip in the chat
The hypothesis
Display a discovery carousel with visual assets on ChatGPT native widget will increase discovery rate from LLM directing to conversion on the app and M.dot
PRODUCT REQUIREMENTS
Be interactive, keep the experience integrated with chatGPT UI
PRODUCT REQUIREMENTS
Consistent user experience, legal copy, strong branding
for how many people? ...
AI fetch data and asks for the data missing
What kind of hotel do you prefer?
Ai asks for Hotel styles?
"Where can I stay in Barcelona for 3 nights in November?"
Here are hotels that match your preferences:
CHatGPT
B.com mdot/app/web/mobile
User prompt
Filtering hotels
Hotel carousel
Input
Getting user data
Hotel detail page
Output
User flow
USER RESEARCH
What we know about early trip discovery phase at Booking.com?
Due to the project deadline time for research were not possible. So I had to look for any research available for early discovery we already have at Booking.com and for any current experiments done by the AI team.
Most Valued Items on the Hotel Card (in Importance Order)
1/ Rich Visual Content (Photos & Videos) Conveying “Vibe
Users consistently prioritize engaging images and videos that authentically communicate a hotel’s atmosphere, appeal, and “vibe.” Travelers are inspired by visual cues similar to those seen on social media.
2/ Price and Value Transparently Displayed
Users—especially “Value Seekers”—focus on clear, competitive pricing and deals. Calls out promotions, bundled offers, and total cost transparency directly influence users’ initial choices and foster trust during discovery.
3/ Guest Reviews & Authentic Ratings
Unfiltered ratings, the number of reviews, and recent feedback are essential for users to build confidence in their selections. They rely on real traveler experiences as a shortcut to identify quality and avoid risk.
4/ Location and proximity to points of interest
Users want quick access to practical location details, including proximity to attractions or landmarks, ease of transport, and realistic expectations about travel times. The “realistic sense of timelines” is important for planning.
5/ Hotel facilities matching preferences
Users with a preference for control value the ability to shape recommendations directly from the hotel card—for example, filtering by theme (adventure, relax, culture), budget, or interests. They appreciate cards that let them quickly refine their search or see relevant options
Research important info
- The importance order may vary by traveler mindset; however, visual content and price/value remain top priorities across groups
- The evidence is derived mainly from qualitative and behavioral insights
Design
Explorations with AI
The contract card is the backbone of the contract module. All other module functionality and cross-module interactions rely on it. I was responsible for building this critical component from scratch, aiming to incorporate market best practices and add extra value. I faced several high-level challenges:
1/ Structured data
I explored with different AI's what type of information should be on the carousel and in which order
The design iteration
I did explorations with the interactions available and UI patterns on our Design system for similar experiences
V3
Team proposal :
My decision
Add an image slider inside the carrousel
Push back on nested interaction
Team proposal :
Add an image slider inside the carrousel
My decision
Push back on nested interaction
LIMITATIONS
Challenges and how I overcome it
text
1/ OpenAI didn't supported Full screen interaction for the MVP launch
Challenge:The experience changed a lot since we didn't have the Full screen mode supported by the SDK and we could not do nested interactions.What I did:So I decided to push the team to go back to the previous version without the full screen where we can guarantee a good user experience.
12/12
Interviewers preferred within the context and view the entire hierarchy of complex contract
1/ Display rating system for US users
Challenge:OpenAI wants us to remove the rating to gain space. Also because they are showed currently on US, location of interest for first launch.What I did:
I aligned with PPM's and looked for previous research and experimentBased on internal research: Hotel star rating systems are vastly different across Europe compared to the US, which can lead to confusion, disappointment and poor guest experiences when Americans travel abroad. There are opportunities to set better expectations when US customers are booking trips abroad. (source: Product localisation opportunities research)My design decision:
Keep the rating
based on previous research and experiments.We should not over optimise for mvp. It is not a legal requirement or hard requirement from OpenAI.We can work on conversion later.
Impact of my decision:Keeping the rating can mean lower conversation rates on US as showed on previous experiments for the sake of consistency, but I believe it was a biased conclusion and I would like to do further experiments.
1/ Error messages for LLMs
The way we think of error messages for non-LLM experiences doesn't work as well for LLMs. Because the LLM will try to solve if our tool doesn't work.
Hoe we can keep them engaged with our tool, if no initial results are shared.
1/ Our API don't support most popular facilities
Challenge:Our API don't support most popular facilitiesWhat I did:I decided with developers to manually define the most popular facilities using our current rating criteria + the facilities mentioned by the user.Impact of my decision:Now the facility asked for by the user in the prompt will be shown first, followed by other facilities. For example, Beachfront is displayed first when I ask for hotels near a beach:
1/ Widget don't return any results and LLM can't hide the widget when is rendering - Need a back-up empty state
Users consistently prioritize engaging images and videos that authentically communicate a hotel’s atmosphere, appeal, and “vibe.” This content is especially influential during the early browse stage, as travelers are inspired by visual cues similar to those seen on social media.
The design solution
Using the new ChatGPT native widget to display a discovery carousel with visual assets will increase discovery rate from LLM directing to conversion on the app and M.dot
We believed that small businesses needed a more efficient and simplistic way to manage their social media presence across multiple platforms.
The MVP
Less customisation, more parity and integration with ChatGPT experience
We believed that small businesses needed a more efficient and simplistic way to manage their social media presence across multiple platforms.
Results
2.5K search requests per hour on launch
LEARNIGS
Help ChaGPT users to discover Booking.com hotels when planing a trip in the chat
The contract card is the backbone of the contract module. All other module functionality and cross-module interactions rely on it. I was responsible for building this critical component from scratch, aiming to incorporate market best practices and add extra value. I faced several high-level challenges: