ZEN Rooms
Redesigning the hotel details page
Background
ZEN Rooms is South East Asia’s leading budget hotel booking platform with over 1000 hotel partners in 7 countries. The site gets 300K visitors a month.
My role:
Research, Design (UX/UI), Prototyping, Testing
Team:
Myself, Product Manager
Problem statement and Goals
After steady growth for 1.5 years ZEN Rooms faced stagnating site conversion rates with key bottlenecks in the user flow, in particular the hotel details page which showed the biggest drop off. ZEN Rooms decided to re-design of the user flow with the following goals.
- Improve site conversion rate
- Improve overall user satisfaction with the site
Approach I followed
- Understand key issues in user journey
- Design & validate new user flow and interface
- Setup goals and framework to monitor improvement
This is the final design. In this post, I will describe how I arrived at this design.
1. Understand key issues in user journey
1a .Collect user feedback through interviews and survey
We interviewed four users in person, with a mix of people who had used the Zen rooms app before, and new first time users. Following are the insights from our interviews.
1b. Understand extent of bottlenecks in current user journey using Google Analytics Funnel Analysis
Google analytics Funnel analysis clearly shows that the biggest traffic loss is happening on the Hotel Details Page, across all platforms, mobile and web.
1c. Hotel details page usage patterns using heatmap insights from Hotjar
1d. Benchmark against best practices from competitor apps
I studied several successful hotel booking apps, such as Booking.com, Agoda, Airbnb, Hotel Tonight, Trivago, Yarta, Oyo Rooms, Make my Trip etc. I noted which features stood out in each app, what design practices are most commonly followed and what elements worked best in alignment to what we desired to build.
2.Design & Validate new user flow and interface
2a. Ideation and wireframes
I designed several layouts and wireframes and discussed the merits and demerits of the different alternatives with Zen Rooms product manager, their CEO and their team. We finalized a few designs and built prototypes, which we tested with a few internal users.
2b. High fidelity prototypes
2c. User feedback on designs
The users we interviewed were asked to compare their experience with the old app vs the mobile prototype.
- 100% of the users voted they liked the new app better.
- Users informed us that absence of too much clutter helped guide their sight to what they were searching for.
- Users were shown the same hotel in the old app vs the new one, and all of them conceded they would be more likely to book rooms with the new design. Reasons given were, the images and visuals of the hotel in the new app looked appealing.
- 2 out of 6 users did comment that they expected to find a promotional discount on the front page of the hotel app, vs the bottom of the page.
3. Setup goals and framework to monitor improvement
After the designs were finalized and the full handover was done with the engineering team, I developed the KPIs to track to ensure that the progress was made towards the goals of the redesign Key KPIs identified to be tracked.
- Site conversion rate improvement by 50% : Source Google analytics (weekly)
- Hotel detail page drop off rate reduced by 40% : Source Google analytics Funnel report (monthly)
- Validation of user engagement on the site with hotjar and other user testing tools (monthly)
- Continuous A/B testing for aspects of the design that needed further optimization (ongoing)