VRBO PDP

An ecommerce Product Detail Page (PDP) design can often make or break a sale. Every point along the customer’s journey from research to purchase is important. There is one place, though, where the customer is called upon to make a choice of exceptional consequence.

In this page


Revised. 07.08.19

Revisions:
  • We made the Photo Gallery to appear as close as possible to Expedia's photo gallery.
    • Round circles for previous and foward
    • Counter at lower right corner
    • Link to view larger image
  • We added a modal window that goes full screen (click on the image)
  • We added the Date Picker styles and functionality.

Revised Prototype:
VRBO Product Detail page


Photo Gallery

VRBO Photo Gallery (Slider)

The photo gallery (slider) for the product detail page should appear and function as the Expedia photo galley; including the Full-width overlay of the images. See the following links for reference; in addition, study the photo gallery of the Expedia's product detail pages.

Photo Gallery Annotations:
Annotations for Photo Gallery


  • The Full-width Booking Wizard has been modified for the sidebar.
  • The sidebar wizard is flexible for all product states.
    • HomeAway
    • Classic Hotels
    • Pre & Post
Sidebar Product Details
  • The data has been organized for better comprehension.
  • Careful attention to white space is critical for readability.
  • The sidebar details design is flexible for many product states.
    • HomeAway
    • Classic: Guest Version
    • Classic: Signed In Version
Content Section
  • New layout design for the bottom section: Content.
  • Secondary Tab links for easy navigation to sections.

CSS Style Sheet

The CSS style sheet for the Product Detail Page is the same for Classic Vacations and VRBO.

CSS for the layout of the page:
CSS Style Sheet

CSS for the booking wizard sidebar:
CSS Style Sheet