DESIGN
The power of the big green tick
I’m about to play Chris at ping pong when my phone buzzes in my pocket. I quickly unlock it to see what’s up. It’s the Amazon app keeping me updated on the progress of my light bulb order. I tap on the notification and it takes me to the order screen.
The heading on the screen says Delivered today. I pause and think. Does that mean it will be delivered or it has been? I put my phone away, deciding there are more important things in life than that light bulb delivery. After all, I have a game of ping pong to lose here.
On reflection, the past tense should have kinda given it away. It’s only when I get home from work that I’m sure the parcel has arrived. Sure I could have looked at the order screen a bit more and worked it out. But like everyone else, I have a life to live with other things to think about.
Stick a big green tick at the top
This is advice I’ve been giving for years and continue to do so to this day. If you’re designing a confirmation screen, then just stick a big green tick at the top of it. Much of the time people can’t be bothered reading your carefully crafted screen. They often just need to know it’s all done, so they can go get on with a more interesting part of their life.
A success screen should make it so obvious that the process in question has reached a successful conclusion, that it should pass the blurry eye test. By doing so, your users will understand the screen without even really paying much attention to it.
But, isn’t it bad to communicate with colour?
Given that a large number of people can’t actually tell green from red, it’s not a good idea to use green alone to communicate success.
But if someone tells you it’s bad to communicate with colour, they are misquoting the advice of the Web Content Accessibility Guidelines (WCAG). The word ‘alone’ is quite significant here.
Basically, don’t rely on the greenness of your design alone to communicate success.
The primary job of this screen
Before a confirmation screen conveys any other information, the first thing it should get across to the user is that the process has ended in success.
When you’re designing a confirmation screen, you may have all sorts of other design challenges to take on. But don’t go for subtly when trying to communicate success.
Read some other stuff I wrote
If you liked this post then read some more…
Design
- The UX of stamping loyalty cards
- When Share really means Send
- Design guidelines for mobile date-pickers
- Getting real about delightful 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
