200 likes | 213 Views
In the second round of user testing for the Amend for Leisure feature, various elements were tested to determine the most intuitive method for F&B upsell, user-friendly positioning for CTAs, and a digestible amendment summary.
E N D
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.
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 easierwhen 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. 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
Access to amend Open amend Closed amend
ClosedAmend 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
ClosedAmend 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
ClosedAmend 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
DescriptiveCTAs • 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
*8/8 users preferred Edit/Remove CTAs aligned to the left. More intuitive, easier to understand. CTA positioning & style 100% prefer* • 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 Link styling Improvements • Use tertiary buttons and bring it closer to content Tertiary CTAs
Amend Summary Crossed out UI + additional info on original booking Without crossed out UI + no 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 Improvements made from round I • Informing users amendments has effected their booking total • 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.
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 Tertiary CTAs left align Open amend 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!