My pointer finger was trembling as it held down the left mouse button. Any less pressure and my cursor would have clicked a Cancel I didn’t intend.
Steady. Breathe in. Move the cursor away, then lift.
Had I released my grip or let my finger slip, so too would I have lost my transatlantic flight scheduled to depart the next day, not to mention the woman I was going to see. The same woman who is now my lovely wife.
This was a few years ago, and oh how different our lives might have been had that flight been cancelled. Would I even be living in New Zealand where I reside today? Locked in together as a pandemic rages outside.
And it all started with a usability issue. This flight booking mishap I mean, not COVID-19… but maybe that too? Who knows.
I was cleaning up my research and design playbook when I came across the screenshot saved from this fate-deciding day. [dramatic much?]
American Airlines’ flight reservations page with identically designed Select and Cancel links per flight record
It was a stark reminder of how coupling the slighter of user distractions with poor iteraction heirarchy and copy could lead to a life-altering outcome. [OK! Fine. I’ll tone down the sensationalism, but just a tad].
There I was, 24 hours before my flight, and looking for where to check in. I had found my way to the American Airlines’ My Reservations page seen above.
Well, I didn’t want to change my flight, which I assumed “Select” would give me options to, so backing out via “Cancel" seemed like the best bet in my hunt for the Check In. Why that wasn’t the primary available action, you’ll have to ask them.
However, before I could continue with my task, the phone rang.
It’s at this point in the story that I need remind every user experience and content designer to consider adding intentional distractions into your usability testing research plans. Asking participants what they’d do in an isolated, safe environment lends low resemblance to the contextual chaos that is their daily life.
Sure, that child screaming or dog barking in the background might be distracting you, the test facilitator, but that’s real life in all its frustration-filled glory. Asking them to find a quite place to click through your site is like asking a jackhammer operator to comment on their hearing away from their tools.
When people get distracted, they look for clues to remind themselves where they are and where they’ve been like a person waking up from a coma. Whether it’s been five minutes or five hours away from the keyboard, a good design will be easy to pick up where you left off.
Speaking of, what was I trying to do? Oh yeah, I was trying to find where to check into this flight.
Check in. Check in. Check in. I need to find where to check in. Ah, yes, I believe I was trying to cancel and go back before attending to that incoming call.
WAIT! Hold up! What did that blue button say?
Like a Tarantino film edit, we’re back to the beginning. Mouse in a half-clicked state. A moment from losing my flight had the unfamiliar words on the screen not triggered a motor control adrenaline boost in my brain, staying my hand.
I moved the cursor to an empty part of the page before letting go. Something seemed out of place, needing a longer look.
Why did it say, “Back to my reservations”? Whoa, what!? This is a Cancel Reservations page! Was I about to cancel my flight?!
A near-hit averted. Clicking it would have been a near-miss, nevermind what the air travel industry like to say.
Now that I’ve had a few years to look happily back on that trip that was, a favourite Steve Krug quote comes to mind.
“What is the smallest, simplest change we can make that’s likely to keep people from having the problem we observed?” (Rocket Surgery Made Easy)
Changing that first page’s “Cancel” link label to “Cancel flight” would be a great place to start. Giving it some secondary colour contrast in comparison to “Select” like they did on the second page might have made the action priority more clear.
But for those still unintentionally finding themselves on the Cancel A Reservation screen, making the 'destructive’ (ie. irreversible) nature of this page more apparent is worth a shout. When your users attend to another need like the phone call I had, coming back to a near-idendically styled page is ripe for ruin. After all, people don’t read, they just do what looks good enough. It’s a fact of life.
It makes me wonder… how many angry customers and flights to refund might American Airlines have on their hands all stemming from that first Cancel link?
The value of UX design is not always about the money brought in, but the loss we can prevent.