How I redesigned OYO app for a better hotel booking experience

About OYO

The OYO app is used by 20 million users to book hotel rooms around the world. The user journey comprises of 3 steps:

1. Search- Enter a location
2. Listing- Browse OYOs from listing
3. Hotel Details- Pick an OYO to view hotel details and book it

Who books an OYO?

Brief

The challenge here was to relook at the 3rd step of the journey- Hotel Details Page, which is the final step before a user conversion. This was a part of the overall OYO app redesign. The revamp consisted of:

• Introduce a new visual design language to instill more trust among users.

I worked as an individual contributor on this challenge.

Research

1. QUALITATIVE RESEARCH

Research goal

I conducted phone call interviews among 12 loyal OYO users targeting ‘what are their concerns while booking an OYO’.

Sample questionnaire

‘When was the last time you booked an OYO?’

‘How was your booking experience? What went wrong?’

‘If you had to book an OYO right now what would you consider?’

Insights

• 12 of 12 users felt the pricing of an OYO was the most pivotal aspect for them to book it.
• 9 of 12 users looked at the room, reception and facade/surroundings of OYO before taking their final call to book it.
• 6 of 12 users had a series of bad check-in experiences due to unwelcoming stares from the staff at the reception.

2. EVALUATING THE DATA OF THE EXISTING PAGE

Since most insights were associated with the aspects covered under image library, my next step was to understand its usage. The image library focuses on surroundings, reception and room quality of an OYO. To understand the user behaviour around images I analysed the data supporting it.

Business Goals

• To improve user conversions
• To improve NPS score of the app

Key Target Metrics defined

• Number of conversions
• In app feedback metric — ‘How was your check-in?’
• In app feedback metric — ‘How easy was it to find your OYO?’

Design Constraint

OYO takes pride in making hotel booking as easy as 3 steps. So the solutions were envisioned without introducing any new steps in the existing journey.

Solving for the user concerns

Users are concerned about the locality, reception and hygiene of the bedroom while booking a room.

Hypothesis

By focus on bigger imagery the added friction of hotel booking can be minimized for a last minute traveller, and it will push more users to explore the images and make a more informed decision.

Understanding a user’s context

A major chunk of our users are couples who book an OYO on the day of their stay, mostly a few hours ago. Imagine a user trying to find a room while s/he is out on a date or traveling with his/her friends (on the go). In this case, a powerful way to capture users’ attention and communicate our value prop is by using big imagery.

Validation through experiment

To validate this hypothesis I ran an A/B experiment by increasing the size of the hotel image by 50% in version B (rolled out to 5% users). The result was positive and I inferred that bigger images help users to make easier decisions.

Result

2.6% increase in conversions. The number of users tapping on the image and checking out other sections of the hotel also rose by a staggering 24%.

Building over the last insight

Bringing things upfront: The idea was to create a storyboard of an OYO with the most relevant photos when the user lands on this page. Since a big chunk of users took their final decision to book based on the base image and didn’t explore the rest of the photos, I brought them upfront. This should help the user to make a concrete decision.

We went ahead with Exploration 3 following up on the bigger image ideology which we validated through A/B

3. Final designs, bringing in the delight

🎥 Creating a multimedia slideshow with images of most sought-after features in a hotel helped the user to scan a property intuitively, making the decision easier. Also, with tags being shown for what’s next in line (kitchen, living room), users had a fair idea of what they can expect.

4. Usability testing and improvements

In a usability test, I found out that users perceived the slideshow to be a non-dynamic image, due to a delay in the transition between different images. So, they scrolled or tapped elsewhere.

Solution: A slight zoom-in effect on the pictures to give an impression of a dynamic element.

Outside the app experience

Results

⚡️ ️️️ This was rolled out in an A/B to among 50% of our users and the results ️were groundbreaking. We had a 16% bump in the number of bookings and a significant rise in room upgrades. Soon it was rolled out to all our platforms and users. The same is being replicated for our mWeb and lite versions.

⛑ However, there was an unsolicited outcome from the redesign. The number of cancellations rose by 3%.

A new problem in the house!

Problem: Rise in the number of cancellations.

Solution: Changing ‘tap to book’ action to ‘swipe to book’. Previously, users felt that tapping on ‘Book now’ will lead them to payment options like other hotel booking websites and not book the OYO right away. In order to give users a more concrete affordance of ‘book now’ action, I changed the interaction to swipe.

The numbers are yet to come with this updated tweak. I hope you found it useful. Also, if you enjoyed reading this here is another piece of my work https://marvelapp.com/4c382dd/screen/59137324