Hotels Unified Purchase Path - A Redesign

A New Product Page

 

Overview

With TripAdvisor doubling its product offerings for hotel owners, and looking at plans for further expansion in the future, it's important to have a product checkout experience that can respond to rapid growth and change. We need to be smart about what we show to customers, look at their points of entry, and create a simple, templatized solution that makes it easy for product managers to plug and play new products as they arise. 


Our current purchase experience has been left untouched for years. Sporting an older style guide, unresponsive pages, and the inability to pick and choose between a variety of products makes it a poor user experience for everyone involved. 


Redesigning, and rethinking, our Unified Purchase Path is one way to help the business handle rapid growth while also fixing those pain points that hotel owners struggle with when looking to enhance their business listings on Tripadvisor.com.

Purpose

Business goals...

  • Support self-service sales plans of BI and RM, and increase AOV through bundling
  • Improve UPP conversion rate

Approach...

To accomplish adding new product SKUs to the UPP and to enable the UPP to easily flex, each product will receive its own templated module that can easily plug and play specific UI treatments.

Phasing...

Phase 1 is all about getting the UPP ready for new products. It reduces the number of steps to purchase in order to reach higher conversation rates. Phase 2 will focus on truly enhancing the full user experience.

 Workflow & Process

With such a complicated and stakeholder-heavy redesign, it was important to really get into the weeds of why and how we were going to tackle a brand new purchase experiment. With two brand new products launching, with very different requirements, we needed to make sure we could build something to handle those needs while continuing to support older products that have been established in a purchase experience for years.


My contributions

  • I worked closely with product to create a roadmap for a new purchase experience, including, but not limited to North Star thinking while designing for a phase 1, June release
  • I started with building out a new information architecture flow and low level mocks to get in front of stakeholders for feedback
  • I prepped my designs for user testing flows to understand if we were hitting the mark or not
  • I turned my low level mocks into pixel perfect, responsive designs that have been handed off to engineering
     

Challenges

  • Every product has its own stakeholders, ranging from PMs to sales, and marketing. How do we handle all of these various needs in one, templated page without overwhelming our users?
  • How to do show products based on user needs? Are we looking at where they're coming and only show products based on entrypoint? For example, if a customer comes from Reputation Management, do we show them Business Intelligence offerings or Special Offer promotions?
  • How does a redesign of this magnitute affect our global navigation? How does it align with new brand guidelines without feeling completely out of sync with the rest of the B2B platform?
Information architecture

Conceptualization

Product Detail Modal – Testimonials

Can we give our customers more information and drive home a sale using real feedback without sending users off to another page?

Cross-sells

How can we utilize our knowledge of a customer to upsell products that may help boost their performance while increasing our revenue stream?

Product Detail Modal – Data

Can we utilize the data we have on properties to suggest new products based on hotel performance? Is this more useful than other customer testimonials?

The Payment Page

Billing Page

Design Elements

It is important to share all of the various use cases and elements with our engineering partners so that
when they hit new complications, we have a design ready and waiting for them.

Combo Packages
Learning more modal
Product Cards

My work

Hotels Business to Business - Phase 1TripAdvisor | Product Design

Creating a Design SystemTripAdvisor | Product Design

MIPS Performance Dashboardathenahealth | UX Design

Updating our Unified Purchase PathTripadvisor | Product Design

Reputation ManagementTripadvisor | Product Design

Interested in seeing more? Want to connect?