DESIGN
Designing around the choice of a single option
When you design an interface for the selection of multiple options, you should give some thought to how it will look when there is only one option to choose from.
How do users continue?
When you present the user with a number of things to choose from, you often don’t need to tell them to select one of them. It’s just obvious. There are a number of options, so the user concludes that one of them needs to be selected.
When the list of options is reduced down to one, then the design needs to work a bit harder.
Ryanair search results
Let’s take an example I’ve seen in user research sessions. Below is the results page of a flight search on Ryanair. There are 3 flights to choose from in this example.
In order to continue, it’s relatively clear you’d need to select one of them. Nowhere does it say to select anything. But there are 3 flights, so users tend to know they need to choose one of the flights when they see this screen.
But when that same screen offers only one choice then it’s not necessarily clear what they need to do.
I’ve repeatedly seen people using this screen and not know what to do when there is only one flight available. I’m sure the team at Ryanair have too. I’ve seen this same problem elsewhere also.
A combination of weaknesses
Usability issues often surface when a number of weaknesses in a design combine at the same time. In addition to being asked to make a selection from a list of one thing, there are three more design weaknesses which are exposed
- Flat design sucks. The button to select the flight doesn’t look like a clickable thing. It can be easily overlooked as a highlight around the price rather than something the user needs to click.
- There is no action label on the button to select the flight. Instead the button uses the price as its label. So the flat button which doesn’t look like a button, also doesn’t ask the user to do anything.
- The continue button is inactive and doesn’t give the user any help if they try to click it. It should give the user some advice when they click it.
Clarity always wins
There are other ways to get around the issue of course. They are mostly all tactics to make it more clear that the interface is expecting a selection. For example a heading saying ‘Choose your flight’ would be one way of steering the user in this scenario. But a better design would make such a heading unnecessary.
Another option is to bypass selection when there isn’t a choice. Your engineers will probably vote this option down however.
Was this useful?
I’m trying to write some practical stuff you can apply to your own design work because I don’t believe there is enough stuff like this being shared.
Here are a some more practical posts I’ve written aimed at improving your ability and understanding as a designer, user researcher or product manager.
Design
User research
- Cognitive interviews for user research
- Moderating user research with Zoom
- Communicating UX issues with comics
- Understanding sampling bias
- Usability test tasks to avoid
Product management
