User testing (round II) Maryam Abdul Elahi – UX Designer Amend for leisure User testing (round II) Maryam Abdul Elahi – UX Designer

Objectives of test To determine which method for F&B upsell is intuitive. Displaying all 3 images outright vs. radio button behavior To determine an user friendly positioning for Edit/Cancel/Remove CTAs on the page To determine the most digestible Amendment summary. Analyse the thought process, interaction and verbal breakdown of ‘Amendment Summary’

User testing details What was tested? 2 prototypes versions of the Amend booking flow for leisure customers Users completed various tasks including changing booking dates, adding/removing breakfast, removing rooms details Probed on clarity and ease of use. Who was tested on? 8 Participants tested on, aged 37-58 Remote testing (usertesting.com) Tested on desktop Tested prototypes Prototype 1 Prototype 2

F&B Upsell Open radio buttons Expose on click

F&B Upsell - Open 100% preferred Users found the images open more attractive, clearer and easier when making a decision for breakfast “Seeing images open will tempt more people to purchase - 1 user said: Clear enough to know what your options are. Understood the behavior of radio button – removing meals 100% of users preferred the exposed radio buttons, displaying all 3 images at once

F&B Upsell – Expose on click Users found hiding the images unhelpful when making a decision. - 1 user mentioned he could not compare and contrasting options. 3/8 Users we not convinced enough to add a meal to their booking “No images - It saves space on screen but is less attractive because food is so visual” Hierarchy of meals - 1 user preferred breakfast first then meal deal according to the time of day you eat Psychologically it seems showing an array of food images entices users at present, enough for them to make a decision

Access to amend Open amend Closed amend

Closed Amend 5/8 users struggled finding how to add or remove meals. Improvements made from round I Add ‘No Meals, No Wi Fi to copy under Room 1 to test and see if they still struggle to find how to amend their room details 5/8 users struggled finding how to add or remove meals. - 3/5 users eventually found it but it was not straightforward. 1 user struggled for 3mins on this task but methodically preferred it grouped. Behaviour vs preference

Closed Amend 5/8 users struggled finding how to add or remove meals. Improvements made from round I Add ‘No Meals, No Wi Fi to copy under Room 1 to test and see if they still struggle to find how to amend their room details 5/8 users struggled finding how to add or remove meals. - 3/5 users eventually found it but it was not straightforward. 1 user struggled for 3mins on this task but methodically preferred it grouped. Behaviour vs preference

Closed Amend 5/8 users struggled finding how to add or remove meals. 1/8 prefer* Improvements made from round I Add ‘No Meals, No Wi Fi to copy under Room 1 to test and see if they still struggle to find how to amend their room details 5/8 users struggled finding how to add or remove meals. - 3/5 users eventually found it but it was not straightforward. 1 user struggled for 3mins on this task but methodically preferred it grouped. Behaviour vs preference

Open Amend 7/8 prefer* Users identified where to edit meals but found dates/nights later Observed users directly taking action in the opened section Appears to be intuitive to upsell F&B. But does it answer the objective of Amend to create a functional page for ‘changes’? However, one user mentioned it is a lot of scrolling and suggested to make it more concise

Descriptive CTAs Descriptive copy used to show clarity, i.e. ‘edit room 1 details’ This demonstrated a positive behaviour. As users we reading out it out aloud and taking action based on the description. Follows our design principle – being transparent

CTA positioning & style *8/8 users preferred Edit/Remove CTAs aligned to the left. More intuitive, easier to understand. CTA positioning & style 2 users pointed out the link styled CTA was ‘weak’, especially in purple on a white background. 1 user suggested to create a box around the link 100% prefer* Link styling Improvements Use tertiary buttons and bring it closer to content Tertiary CTAs

Amend Summary Without crossed out UI + no additional info on original booking Crossed out UI + additional info on original booking

Amend Summary Improvements made from round I Redesigned elements Included main elements of original booking Users liked the hierarchy – in order of, pervious booking, changes, price difference and then new total. Changing outstanding balance to price difference had a positive response 3 users mentioned the price difference is clear and good to have. (One less thing to think about for users) But observed users didn’t notice the difference in UI and additional info on initial booking Improvements Remove crossed out UI and additional info as no users found it exclusively helpful

Notification & messaging Notification gave more confidence to the user, amendments had taken place/recorded. (Shows original booking detail and new changes) 1 user mentioned new total should be shown in the notification. Improvements made from round I Informing users amendments has effected their booking total

Confirm booking CTA Observed 4/8 users who actively expected/behaved as though ‘confirm booking’ CTA will demonstrate an additional summary/breakdown page or update their changes Improvement: Additional discovery: Do we require an additional step? Should amend summary be placed elsewhere, why and value doe that bring? How can we make amend summary pop or more adamant? Also does that question if the user truly have confidence that the changes have been completed? Short term suggestions – Change CTA name/Change Booking information to Booking confirmation/Do we need a T&Cs with a checkbox to indicate it is the final step? – It is learnt behavior.

Final Winners Open amend Tertiary CTAs left align Open radio buttons

Next steps… Run through of wireframes with PO and tech Offer potential solutions for ‘confirm changes’/positioning amend summary to PO Copy

Any questions YAY!