Designing an innovative booking engine for Skipper Hospitality
Impact:
Increased independent hotel conversions by up to 40% through researching, ideating, and designing the MVP of a B2B SaaS application.
Role:
Lead Researcher + Team Designer
Tools:
-
Figma
-
UserTesting.com
-
Maze
Deliverables
-
User Research
-
Low-Fidelity Prototypes
-
High-Fidelity Prototypes
-
User Testing
Table of Contents
The Problem
Independent hotels have historically had little to no control over their guests’ booking experience. The current booking experience is dominated by online travel agencies (OTAs) like Expedia or Booking.com, or central reservation systems (CRSs) like Sabre Synxis or Windsurfer.
These options currently take users to an experience that is completely outside of the hotels control, including the branding. As a result, hotels receive less direct bookings and have to rely on external sources to which they often have to pay hefty fees to book out their rooms.
​
This is an example from one of our hotel clients, Sundance which takes users to a different experience and URL after clicking book now button.
Native Booking Engine
We implemented a native booking engine integrated into every page of the hotel's website, ensuring a cohesive and uninterrupted browsing and booking experience. This eliminated the need for separate tabs or windows, making the process more intuitive.
Web Storage API
We implemented a web storage solution using the Web Storage API to enhance the booking experience, as a result of our collaboration with the development team.
This feature preserves the state of incomplete bookings, allowing users to seamlessly resume their reservations even after leaving the page or website. It simplifies the user experience and encourages users to return and complete their bookings, increasing direct bookings for the hotel.
One-Click Payments
To streamline the booking process and enhance convenience, we implemented one-click payments, integrating secure methods like Apple Pay directly into the booking flow.
This eliminated the need for users to manually input payment information, reducing time and effort. This seamless experience enhances user satisfaction and increases conversion rates, driving more direct bookings for the hotel.
The Goal
Our goal on the product team at Skipper Hospitality was to create a user-friendly booking engine that could seamlessly integrate into any hotel website. Our aim was to enable hotels to capture direct booking revenue from their guests, without the need for third-party platforms or intermediaries.
​
To achieve this, we undertook extensive research that spanned several months. This involved studying various hospitality industry reports, conducting a competitive analysis, and exploring the user experience of different types of hotel guests.​
​​
Our ultimate goal was to create a seamless, intuitive booking process that would increase direct bookings for hotels and enhance the guest experience. With our booking engine, guests could easily browse and book their preferred accommodations directly on the hotel's website, ensuring a hassle-free and convenient booking experience.
Research
Our initial research at Skipper Hospitality focused on understanding what factors contribute to a positive hotel booking experience. To achieve this, we relied on a variety of sources, including hotel industry research reports, competitive analysis of other hotel booking engines, and comparative research with retail and e-commerce websites. Additionally, we had the advantage of working with clients for whom we designed and built hotel websites, giving us access to deep site analytics and allowing us to have in-depth conversations with hotel managers and guests, upon which we defined our user persona.
​
Analytics
Analytics dashboard I helped design for one of Skipper Hospitality's clients, the Ameswell Hotel.
User Persona
.png)
One of the user personas defined by our research. She prioritizes efficiency, personalization, and usability.
Competetive Analysis
To better understand how these problems are currently being solved, we conducted extensive competitive and comparative analyses. This involved examining the booking engines of other hotels and online retailers to identify best practices and areas for improvement.
Key Findings
Out of 5 interviews with guests, 2 said they did not book from the hotel website because they were taken to a new tab that either took to long to load or did not seem right because it didn’t look like the hotel brand.
Hoteliers from our hotel partners also mentioned they cannot capture a lot of user data beyond the book now button.
One click payments creates an opportunity to create ease in the flow which we hypothesized would increase website booking conversions.
03
01
02
The Solution
Based on our extensive research, we identified two main features that would differentiate our booking engine from existing ones:
​
1. Native booking flow:
Provide a seamless experience for guests, eliminating the need for a separate tab or window
2. One-click payments:
Simplify the payment process, reducing the likelihood of abandoned bookings.
User Flows
To ensure the user experience was optimized, we identified five main steps that were present in each user flow: a book now call to action, date and room selection, room and rate selection, guest details and billing information, and a confirmation page. We used this user flow as a guide to develop our prototypes.
Wireframing
Our product would have to integrate with several different central reservation systems, but since this was our MVP we decided to design only for the first one we would integrate with. The hotel under that system was called Journey East Hampton.
To prototype our design, we started by exploring different layouts, from hand-drawn sketches to low-fi wireframes in Figma. Our designs went through rounds of feedback and revisions by the rest of the design team, eventually being moved forward with testing.
Early iterations of booking engine designed mobile first.
Design System
The next steps were to build out fully branded prototypes that would be presented to our first client (Journey East Hampton hotel). Using their existing brand I created a style guide and component library which we used to fully design the entire prototype.
Prototyping
To reduce the development scope, we implemented a mobile-first approach and incorporated mobile designs into desktop screens. The designs were labeled based on the pre-defined user flow, mainly for the engineering team's reference. Overall, our goal was to create a user-friendly and efficient booking engine that would help hotels capture direct booking revenue from guests.
Testing
After completing the design phase, I led usability testing with five participants through UserTesting.com to gain feedback on our prototype. My goal was to identify any pain points or areas for improvement in the user experience.
​
These results will continue to be analyzed and iterated on post-MVP launch. As of now, the results are as follows:
01
​4 out of 5 users would want to be able to add things like early check-in and special requests during their booking
​​​
02
3 out of 5 users would want the ability to increase the size of the booking engine.​​​
After consulting the rest of the product team, we concluded that increasing the size of the booking engine would add a lot of value and not be so complex that we get off schedule. In doing so prior to the MVP launch we were able to reduce development costs by 10%.
​
Overall, we found the feedback from our usability tests to be valuable in refining our design and identifying areas for future improvement.
Reflection
I learned the importance of seamless integration for enhancing user experience. Users often abandoned bookings when redirected to pages with different looks. Implementing a native booking flow with consistent branding reduced abandonment rates.
​
Incorporating one-click payments, based on user feedback, streamlined the process and increased completion rates, reinforcing my belief in user-friendly solutions.
​
Usability tests led to key design adjustments, like increasing the booking engine's size and enabling additional requests, enhancing functionality and user experience.
​
This project reinforced my commitment to user-centered design, thorough research, and continuous iteration, strengthening my confidence in creating innovative solutions that drive business goals.
​
