Bad Design, Illustrated


So here I am. Sick as a dog. And I need to renew my tvtv subscription. Which mean I need to re-select my device (why I need to do this in the first place is a mystery to me).

So I get to the above screen. What does it say? Read it: Select Device Password. Which leaves me wondering.

Call it stupid ( or not, depending on you point of view – but remember that this is seen through the fog of a muddled brain), but I check all my instruction manuals in vain. I spent a few hours scouring various forums. Only then did it dawn on me that since there was nothing on this mythical device password, there must be none.

So I went back and checked ever so carefully the help section of TVTV’s website for the 21st time. And there it was “Please re-enter your password for security reasons”. Since this is not part of the shopping bit, I can’t imagine why all the security.

My point being that a little clarity on the above page would have saved me loads of time.

In 20/20 – hindsight, the page does make some sort of sense. “Select” is never used in conjunction with a textbox. But the style of both the headings (since they are indeed supposed to be separate) is the same – font, weight, colour, size. And they are right underneath the other, as if following on. Separation of these two headings in some way – certainly i terms of style or better yet, in spacing – would clear any confusion.

“Please retype your password” makes sense in the light of know that its your password they want. But given the design miscues above, looked out of place and perhaps referred to when I’d actually have to retype this mythical device password .

There is no obvious help button or icon, or even tooltip that is visible on this form – bad practice in any situation. A tooltip/label saying “Please enter you TVTV password here” would do wonders. I’ve seen websites that actively display help in a side bar, explaining the purpose of each and every form field. A “what does this do” explanation never hurts either.

Even when one is confronted with readily intuitive fields such as credit/debit card forms online, help makes the process a whole lot less daunting ( one is after all, dealing with real money. Making mistakes is not the way forward).

The point is that as winforms, webforms, WPF, Silverlight –developers and UI designers, making our users happy is the number one priority. That means designing good, intuitive UI’s and helping them to use it, too.

I’ve had my share or websites that the thought of using them gets me angry. There are others that I think are a little too liberal with their help information, coddling their users in wool. But I’ve never ever had an issue with those websites, ever.

The iPhone is, I think, the canonical expression of a good UI. My very tech-limited mother likes mine so much that she is getting one herself ( she’s had her current phone for two years and still hasn’t figured out how to text/SMS, yet has almost total command of the iPhone). Its a combination of UI touch screen that makes the difference. touching, pointing, dragging, pinching. These are all actions we use naturally every day – no mice to move and click, no keys to press. Its the intuitiveness of the whole experience that makes it so successful as a UI.

So while we may still depend on mice and keyboards, intuitiveness in our UI is something that our users will be grateful for.