The Updated Checkout Flow

Overview

We're pleased to announce a final batch of enhancements to the Rezdy booking form. Minor improvements were made to the initial steps in the booking process, we've now completed enhancements to the final step: the checkout flow.

The list of improvements on the Checkout Flow includes:

• New Layout.
• Dynamic Checkout.
• Following Item Summary.
• Mobile Device Optimisation.

New Layout: Turning Lookers into Bookers

The new layout is cleaner and more compact. Important sections are made clear to the Customer with intelligent input fields. This means faster user input, less errors, greater cognition resulting in higher conversion rates. Keep scrolling to see the rest of the improvements!

Dynamic Checkout: Increase Conversions

Strong data analysis showed a large percentage of Customers were going back to the first step of the booking process just to correct mistakes with quantities and pickups. Your Customers can now do all of this on the checkout page without having to restart the entire process.

Following Item Summary: User Cognition

Customer experience has been improved with the Item Summary, which now follows the user as they complete their purchase. This results in a lighter, more compact booking experience with less need to scroll up and down.

Mobile Devices: Optimisation 

The new layout comes with several mobile device improvements. Including a progression bar that follows the Customer as they complete their Order and shows progression as they fill out required fields. Both desktop and mobile versions come with a progression bar, but the mobile version is a lot more prominent.

Full list of improvements

• Improved layout and visual hierarchy for Item/Order Summary, participant, billing and payment sections.
• Progression bar, visually showing progress as Customer completes the booking.
• The checkout has been separated into clear steps to make it easier for customers to process their bookings.
• Buttons; Call to action colors are flipped to help differentiate from other elements on the page.
• Customers can update their order quantities and price options on the checkout page.
• The Item/Order Summary is fixed on the right so that customers always have a point of reference as they scroll through the checkout.
• Upsells are positioned below the Item/Order Totals on the right so that the checkout flow is left unimpacted
• Voucher input is less prominent (expandable link) to reduce the number of customers exiting the checkout in search of promos or deals online
• Checkout height/length reduced by ~25%
• Collapsible fields allow customers to reduce checkout form height/length as they complete their Order.
• All labels positioned at the top, so that customers are able to process the checkout faster, and improve overall cognition. Particularly on mobile devices.
• Larger User inputs for improved (mobile) usability and clarity.
• Prefixed internationalized phone numbers; this means that tour and activity providers have the right context when they need to contact their customers and/or participants.
• Masked inputs to date, phone and credit card formats to reduce errors and greatly improve cognition.
• Validation/feedback provided as the customer types for faster form input and reduced errors.
• Clearly distinguished required, valid or invalid inputs help the customer prioritize and process the checkout faster with fewer errors.
• The payment section has more emphasis on security to reduce customer anxiety and increase confidence.
• Certain payment gateway options (eg PayPal) let the customer know that payment will be processed on an external payment page.
• Clear explanations for Credit Card Expiry and CCV code as tooltips on demand.
• Credit Card number formats auto space to 4 digits as it appears on the card, to improve readability and cross-referencing.
• Credit Card input supports iOS autofill and camera scan for faster input.
• Pay Now button is the largest on the screen to place more emphasis on that goal.
• Pay Now button is disabled until all required fields are validated to reduce errors and provide customers with better feedback.
• Clicking on the Disabled Pay Now button takes the customer to the topmost invalid/required input field.
• Pay Now button sticks and is visible at all times so that it's easier for customers to access.
• Active pay now button with clear call to action 'Complete Your Booking'.