Clues your UI doesn't work
- Category: Tim's Blog
- Published: Friday, 05 April 2013 11:38
- Written by Tim Walls
- Hits: 4948
So, it's the end of the financial year, and time to grovel through assorted online service providers' billing systems to make sure all the invoices have been correctly recorded in my finance system for tax purposes.
And while I'm fighting with one particularly bad example of such an online system, who shall remain nameless (unless you're reading my twitter feed,) I come upon this gem of UI design. To get a printable PDF of your invoice you need to...
- Pick the invoice date from the drop-down menu (so far so good)
- Hunt for a 'download printable copy' option with no success.
- Click on "bill format" wondering if it's there.
- Success! Maybe... Click on the "Get help on how to print your bill" link.
- Watch the video (!) of the nice man telling you he's going to help you, who then gives you a menu of options none of which says "print bill."
- Click on "About my bill." Discover there's no information there.
- Click on "Getting more from my online bill."
- Success! Again, maybe... Click on "How do I print my bill." Watch the video (!) of the nice lady pointing out where to find the tiny 'print bill' icon.
- Think you are home and dry. You're wrong.
- Go back to the beginning. Select your bill date.
- Click the vanishingly small icon to download your bill as PDF.
- Sigh, because instead of getting your bill as a PDF, you've got some kind of wretched web app that shows you one page of your bill at a time.
- Click the unlabelled 'forward email' stock icon that (after some experimentation) you discover is actually the 'download bill' icon.
- After wondering what you have to do next, resize the resulting pop-up window that is too small to show the Cancel/OK buttons and has no scrollbars, to uncover the hidden "OK" button, and click it.
- Watch a progress meter while your bill is 'prepared'.
- Click the "Download" button. Breathe a sigh of relief.
- Wonder why nothing is happening.
- Wonder some more.
- Realise this whole sorry mess is broken in the browser you are using, and start the whole process from scratch with a different web browser.
It is actually quite difficult to imagine how you could make this whole endeavour worse. But here is a particular golden rule I think comes out of this:
If your user interface requires a video tutorial to show people how to use it, then your user interface is irredeemably broken.
Also, I'd add this:
When considering using a proprietary plugin/web application on your website, ask yourself if it actually adds any value to the end user whatsoever?
All modern browsers & operating systems have excellent facilities for dealing with things like PDFs downloaded from the web. Is a plugin that replicates - badly - the existing functionality that the operating system/browser already provides really adding any value?
No, it isn't. All you've done is create a usability nightmare for your users, and a support nightmare for your web team, who have to make sure the thing works on all the browsers out there for ever more (or in the case of this nameless company, evidently does not make sure it works.)
That whole farrago could be replaced with a simple link to download a PDF file.