Vacation Rentals (2022)

Book your annual vacation in the UK and Europe with Vacation Rentals.

Overview

Front-end Vacation Rentals B2C Booking conversion on web.

Role

  • (Afiqa + UXD) + UXW (R)

  • (Afiqa + UXD) + UXW + PMs (A)

  • PMs + UXR + AD of PD + Eng (C)

  • Product Director (I)

Duration

Bi-weekly sprints (every two weeks) over five months.

Deliverables

High-fidelity mock-ups across all screen resolutions.

THE PROBLEM

Based on user research, big groups and families use Vacation Rentals to book annual summer vacations in the UK and Europe. 

Their traveler journey consists of 5 journey steps: defining the destination, researching and booking key elements, pre-trip planning (things to do/see, logistics), on-trip (first, mid-trip, last days), and dreaming of the next vacation. 

Vacation Rentals (VR) helps travelers in the early planning and pre-trip stages. With a destination in mind, travelers start researching things to do or see and booking vital elements of their vacation, such as the accommodation that meet the needs of their travel companions (i.e., wheelchair friendly, pet-friendly, childproof). 

Travelers should have a frictionless, stress-free experience in their early stages of planning and pre-trip so that they can look forward to their vacations and unwind. 

Vacation planning can be stressful, but we can make it less stressful by improving the user experience of vacation rental sites. Some of the core problems with HolidayLettings and Tripadvisor Vacation Rentals include incoherent brands, poor UX and discoverability, and a nonexistent mobile app. With minimal resources to improve, we prioritized hygiene (maintaining and improving existing features) and product improvements (adding to what's existing).

THE APPROACH

Backed up by user research, we referenced the traveler’s journey—prioritizing types of trips and what happens at each stage of their journey step. We focused on providing guidance and removing barriers at each stage of their travel journey. Moreover, it reminds us that travel is fluid and never linear, ultimately guiding our design approach to stay open-minded. 

Data from web analytics and A/B testing tells us what and where the issues are within the site—for instance, search result pages, product detail pages, and booking request forms. Next, we audited the VR ecosystem for friction in user flow and visual inconsistencies, such as updating the UI with the latest design system components. We compared VR against other travel booking and vacation rental sites with a competitive analysis to learn what worked for them, but also noting why it did. 

We employed a mobile-first approach to our designs to give the most guidance. While web and tablet allow some semblance of flexibility, mobile, on the other hand, forces prioritization for its limited screen size. How do you decide what the traveler sees or interacts with first? 

The product design team utilized tools like mapping user flows and wireframing to visualize opportunities and work out edge cases. What I found incredibly helpful when I was feeling stuck was sketching and whiteboarding with the team IRL—the old-school way! 

Take, for example, the sticky footer on the search results pages of HolidayLettings. Its large size distracted travelers from browsing the properties in the search results. The ask: remove it. The brand logo was within the footer. Remove the footer, and the branding gets impacted. Travelers may find themselves disoriented as they don’t usually look to the URL path on their browsers to orient themselves. 

I struggled with the branding issue because how do you prioritize a business need without creating a Frankenstein jumble of the page? Following that was a design studio session with a teammate at the office to sketch low-fidelity wireframes and find ways to recommend the best solution that maintains the branding, for example, by adjusting the placement of the sticky footer and rearranging other components around for a cohesive UI. 

After the iterations, we initiated research & co-creation workshops to investigate further the needs and frustrations of the Vacation Rental audience across teams such as PMs and engineering and guided by UXR to support the evaluative research conducted by PMs with web analytics, A/B testing, and bug bash workshops.

THE SOLUTION

FOR HOLIDAYLETTINGS

On search result pages, I readjusted the placement of the sticky footer and, moved the logo to the global navigation bar, updated to the latest design system to maintain branding.

On product detail pages, I placed the ‘Contact Owner’ call-to-action within the page and at the interstitial (a step before the booking request) and displayed the Owner’s name prominently to make contacting the Owner easier and drive booking the vacation rental property.

On booking request forms, I consulted UX writers on the copy for email ID input that verifies users and tightens up security. Edge cases include copy variants for re-verifying emails and errors such as missing “@” characters.

Wireframe depicts the search results page of HolidayLettings site with a floating footer on the map.

HolidayLetting’s search results page with a gray floating footer on the map.

Wireframe depicts booking request form

HolidayLetting’s booking request form

FOR TRIPADVISOR VACATION RENTALS

Across the site, I updated the date-picker to the latest design system components for consistent visual branding. I added a ‘Clear date’ option in the date-picker component for flexibility.

On search result pages, I worked on the mobile-first approach of showing the prices on the property cards for price transparency and to create trust with the traveler. The ‘Wishlist’ or ‘Save' option aided the traveler’s planning and dreaming of the next vacation. Allowing editing destinations in the global search bar made navigation on-site flexible.

On product detail pages, the image carousel or the ‘Pinterest-style’ collage helps travelers gather inspiration and imagine themselves vacationing on the property, and ultimately, builds trust and drives booking. Meanwhile, the ‘Share’ and ‘Send to a friend’ button on the top fold of the page helps travelers with itinerary planning, communicating with their travel companions, and building up excitement for their vacation.

Tripadvisor Vacation Rental’s search results page on mobile with the global search bar.

Tripadvisor Vacation Rental’s date-picker on mobile updated to the latest design system.

THE IMPACT

  • Lifted conversion by 3.7% by rolling out Tripadvisor Vacation Rentals' ‘Edit destination’ feature on SRPs, mostly desktop and tablet. 

  • Increased booking conversions by 1% in SRP and 2.8% in PDP by readjusting the placement of HolidayLettings’ branded sticky footer. 

RETROSPECTIVES

Staying motivated 

I worked on common UX issues fundamental to cutting my design teeth. I’d love to get involved with evaluative studies such as usability testing and improve the accessibility for travelers with disabilities through more specialized design research. A product or service that benefits marginalized or minority groups helps everyone else. It reminds me of my main motivations for a UX Design and Product Design career. 

Collaboration is design

I’m privileged to learn and observe experienced colleagues on how they apply their technical and soft skills, such as critical thinking. Quality checks and mentorships helped tremendously, which I can’t emphasize enough for an early career designer such as myself. I was confident with my work with VR and advocating the user's perspective as I spent more time understanding the problem space and sought guidance, such as through pair designing—a collaborative design technique I picked up from a colleague, where one designs and the other reviews, and the role switches at intervals. Just as with pair programming, two heads are better than one. 

Embracing imperfection 

As for building my craft, I still believe in using lo-fi methods such as sketching on paper as it opens up the conversation and gets you critical, constructive feedback. Working on Figma or any design software could sometimes feel intimidating as an early career designer. The pandemic altered how we communicate with our teams with Slack huddles or collaborating straight in the Figma files. Sketching offline permits me to put down bad, ugly ideas and scrap them before arriving at the good ones. As it's low-fidelity and unpolished, folks don’t feel so bad that they are “critiquing” your work, and you don’t fall in love with your ideas early on, too. 

  • "I worked with Afiqa for 6 months at Tripadvisor, where she was a design intern working in the UX and creative teams. I had the privilege of working with her on UX-related projects, particularly on the vacation rental product. We worked on tickets to experiment on improvements. For example, she worked on improving filters and pricing modules on SRP and PDP, as well as mobile navigation improvements. She was open to learning, and performed well in the design work. She also has a pleasant and approachable personality. If you're looking for a flexible, easygoing and dedicated designer, Afiqa is the one to go for."

    - Sigit Adinugroho, Principal Interaction Designer, Tripadvisor

Next
Next

Tripadvisor Experiences (2021)