TK Site Rebuild: Checkout and Confirmation

Vacation Rental pricing is complex, a combination of nightly rates and various fees. In addition, TurnKey’s variable cancellation, deposit, and trip insurance policies were compelling to users but complicated to communicate.

I’ll start with covering UX issues with the old site’s quote panel, checkout, and confirmation, and then move on to how we improved those on the new TK website.

Old Site Quote Panel

In order to make a reservation on a home, a user must first enter dates. Here’s the UI on the old site:

After entering my dates and clicking “Book”, I’d see the following:

The way the quote is broken down here is confusing. The rate per night for my two night stay (note that it doesn’t indicate how many nights I’ve selected here) is $283. I’m then told that I’m being charged $149 in taxes and fees per night. Neither on first glance seems to add up to the total of $866 — I must multiply both the rate and the fees by the number of nights, then add it all up. It’s a lot of numbers bunched together.

Things get even more confusing if I click the Info icon and view the taxes and fees breakdown:

The Info bubble button had been next to the taxes and fees per night line item, but now I’m seeing a breakdown that includes the total rent, property damage protection (whatever that is), Housekeeping charge, tax, and the total for the stay.

Revamped Quote Panel

For the new site, we designed a simplified quote when a user enters their dates:

This was accompanied by simplified helper text shown on info bubble hover:

We’d still provide a thorough quote breakdown, but we decided to push that deeper into the reservation funnel, at the next step, the Confirmation page.

Checkout Page

The previous Checkout page was a simple form for collecting the user’s credit card and agreeing to the TOS.

Our new checkout pages would include a better breakdown of the trip total and dynamic changes to our cancellation policy and deposit.

The most substantial changes were in the new right-hand column:

The Reservation Review panel allows users to review the high-level information about the trip without having to return to the previous page.

Dynamic deposit language - If the reservation was made more than 30 days in advance of the stay, only 10% was due at the time of booking. If the reservation was within 30 days of the stay, we did not show the Amount Due Today line, and charged the user the full amount. Explainer text covered this further:

Dynamic cancellation - for reservations made more than 10 days prior to the stay, users were able to cancel for free within 72 hours of making a reservation, which we calculated for them (July 17 above). If the reservation was made within 10 days of the stay, we hid the free cancelation language.

Total Breakdown:

The total breakdown was hidden by default to avoid information overload but could be expanded to reveal new and improved line items. Rather than show the price per day for each of these and force the user to calculate, we showed the total amount for each line item, with the rate per night adding up to the total rental rate.

Explainer blurbs elaborated on what each charge meant:

Confirmation Page

The previous confirmation page had also been a relatively basic completion message and trip summary. We knew that we wanted to provide a better summary of the trip, as many users would print this page for their records. We also wanted to reiterate our deposit and cancellation policies, since these were things users would often call into our Guest Experience team to ask about.

At a later date, we also added the option for a user to purchase travel insurance through a TurnKey partner. TK received a commission from these purchases, they reduced the Guest Experience team’s burden in dealing with cancellations, and made it less likely that guests would review us poorly because they expected (erroneously) to be able to cancel for any reason and receive a full refund. The “View My Quote” button passed the user over to a whitelabel portal managed by the insurance provider, with the guest’s reservation details pre-filled to provide for a quick and easy purchase.