SUNlit Adventures: Rohan Ranade's Weblog

This one is straight out of the "don't do this" examples. Buxfer is a website that helps you manage your finances. It was pretty good till Mint blew me away. So today, I decided to delete my account data on Buxfer, which is when I got this nugget (below):

Now what is the problem? Neither of the options is selected by default. One could argue that the choice is left to the user since this is an irreversible action. But then why is the submit button enabled? I promptly clicked it and got this:

Woah! Now there is no way to go back to the previous screen! I have to go to the accounts page and again press delete, and must not forget to select a Yes or No option. Not good.

Have a look at this:

I hope you caught sight of the page title. I did not know that interest rates for fixed deposits (CDs as they are called in USA) should be called 'Normalized Templates for Word 97'. It's a minor blooper but speaks of a lack of professionalism. Also, it's a no brainer that this page has been generated by exporting some word document to HTML. However, a look at the page's source (by pressing CTRL+U in Firefox) was even more astonishing:

It's OpenOffice! I would have thought a bank like ICICI would have a pretty sophisticated way of generating and managing their web site content. Seems not.

Ended up getting a brizzly invite and promptly got confused by the signup process. Yes, I am a lame chap but look at the screen shot below. I thought that I needed to provide only my invitation code and pick a user name since the email and password field were grayed out.

But on clicking the signup button, I got an error (see below):

Yes! I know it's not a valid e-mail address. But what kind of GUI takes focus away from a required field? Totally lame (and equally confusing).

Here's AT&T's Play Safe and Win contest form which got me confused.

What got me was the * next to the U-Verse details. I don't have U-Verse, and I normally associate * with mandatory information in forms. So I thought this form is not for me. What has happened is that the designer of this form has conveniently reversed the role of * to make it denote optional items. That goes dead opposite to convention and is confusing.

As you can see in this form, the U-Verse entry is the only one which is optional, so going with the convention of marking a * against every field in the form would have been a bit of a clutter. But, why not just label the optional field - "AT&T U-verse 9 Digit Account(optional)" and put a line on top of the form mentioning that all fields are mandatory unless otherwise mentioned?

Another sighting of slightly annoying UI behavior. This time, it's VirtualBox. I was trying out the Sun Storage 7000 series simulator (an awesome piece of work. Go download and play with it even if you don't care a dime about storage, it's engineering at it's best), and after screwing up the simulator to my heart's content, I wanted to delete it. Off I went to the media manager to delete about 16 disks that belonged to the virtual machine and that's when my head started aching. The task was to delete 16 disks. The list box allows you to just select one at a time. So, 16 delete actions instead of 1 . Once you select the disk to be deleted, the delete isn't triggered when you hit the delete key on your keyboard. You have to take the mouse all the way to the toolbar and click 'Remove'. Doing it once was OK but doing it 16 times is damn tedious.

Also, every time I hit the delete button, I get the message shown below.

The message is there for a purpose. The operation of removing the disk cannot be undone. So it serves as a place to double check. But imagine doing this 16 times . Also, as a power user of VirtualBox, I know what I am doing. Can there not be a way to turn this message off?

The scenario I mention about is pretty uncommon. Most VirtualBox users would have a disk or two to be deleted at a time, and that won't be as painful. Also, I haven't quite figured out why the disks can't be removed by the step that deletes the virtual machine. Why delete the hard disks separately? At least, why not ask the user if he wants to delete the hard disks associated with the virtual machine to be deleted.

[Update: Raised a bug (http://www.virtualbox.org/ticket/4828)  for this as per a suggestion in the comments.]

Here is an annoying example of how 'data' on the screen eats away 'information'. Browsing through JSch library's users mailing list archive is such a pain. When you click on the link, you are presented with this page.

Very nice. I can pick and choose to view mails from as far back as 2002! But are the recent mails (August 2009)? They are below this whole matrix.

What's more, even if you were to click on any month in the year/month matrix, you still are not shown the mail threads. You again get to see the huge matrix and some even more (un)interesting stats.

I don't think I am interested in seeing how many mails were exchanged on the second Wednesday of February 2004. I want to see the mail threads, and this statistics bloat comes in my way. Not good.

Any one who has not seen this? Pretty rare, I believe.

This is Firefox showing the user that it is in offline mode. Now, I would think a thousand times before tagging some UI in a software such as Firefox as a blooper, but this one is worthy of it, in my opinion. I recently read a fantastic book on usability - Designing from both sides of the screen, and right into the first chapter of the book, an important point is made about 'appreciating the user's physical effort' in using the software.

Look at this page shown by Firefox. What is the use of the 'Try Again' button if it is clicked without unchecking the 'Working Offline' menu item? Apparently, it does nothing, I found out by trial and error (another situation you want to avoid for the users of your software). I can't seem to understand why I must ferry my mouse half way across the screen and click once to open the File menu, and click again to uncheck the 'Work Offline' item and ferry my mouse back to the center of the screen and then click on 'Try Again'? Can't the 'Try Again' button just be smart enough to do the unchecking of the menu item for me?

I don't want to be overly critical in case I am missing some thing. Comments welcome.

A minor one today. This dialog box is pretty good, I just don't like it telling me again and again that it is importing an appliance in it's title. It's too much information in the title.

I would suggest keeping "Importing Appliance" as the title and putting the detailed path of the appliance into the content panel of the dialog box. Or atleast do away the repetitive "import" and "appliance" words in the title.

For the past few days, I have been pointing to various GUI bloopers that I have seen. Today's nugget comes from our own Solaris JDS screen to unlock a display. I am more than a 100% sure that this is a known issue, but I wanted to put the blooper here anyway.

Here's the screen that is displayed to me for about a second or two when I have typed in my password correctly and pressed Enter. 

When I saw this dialog box for the first time, my first reaction was, oh hell, perhaps the password was incorrect.

Look at this dialog box - there is so much wrong in there. First, the password text box is displayed as is. Now it may be that the text box is disabled, but to my eyes, it does not look so (even if it is, it shouldn't be there in the first place). Secondly, that poor little label telling us that the login was successful is a pauper on the screen when it should have been the king. And, the dialog box still tells me that the display is locked. Very confusing to me atleast.

I found another possible blooper. This time, it is the case of unclear feedback. It so happens that I wanted to follow CNN dot com live on twitter using Nambu. I got the following dialog box.

Fair enough. But after hitting Follow, I wasn't told anything. Apparently, the status bar at the bottom did show the status of the action:

Now it can be argued that this feedback is good enough. But I have the following problems with this feedback through the status bar:

1. It is blending into the background. A green color or any other contrasting color should have made it clear to me. Alternatively, I have seen NetBeans employ a balloon to do similar things. It gives the user enough feedback when the action completed (image below).
   
   
2. The "Done" message hardly conveys anything. What was done? A message like "Successfully following cnndotcomlive" or something similar would have been better.
   

This nugget comes from Shelfari. I never knew the 'sjdkasd' is a valid date. What a joy!

And that 'Next' button you see above works. No validation.

I came across another blooper today. A friend of mine wanted to apply for a job at Macy's and was asked to create an account and then login with that account to apply for the job online. Fair enough. What got her confused was the "@invalidemail" rhetoric in the text. Now, if Macy's wants one of the applicant's email or telephone number, there are better ways of achieving it than asking the user to enter the telephone number with an @invalidmail suffix. Some one was lazy while designing this web form, or perhaps someone thought that he/she was super smart in coming up with the @invalidmail suffix idea. This is not a good idea, it's a bad idea.

I have been reading a book 'GUI Bloopers' by Jeff Johnson. They say, you never remain the same after you have read a book, and I wholeheartedly agree. Numerous GUI bloopers, which were in front of me, unnoticed, have all of a sudden, started showing up.

I came across a couple of possible bloopers today in the twitter client - Tweetie. Please note the word - possible - in the last sentence.

Here's what Tweetie showed me when I started it:

So what is my problem with this dialog box? There is no title in the dialog. Is this a disaster? Not really. I can see the logo of Tweetie in the dialog, so I can associate this dialog with Tweetie, but, pray why break established conventions by having a blank title? Also, some one who might be new to Twitter/Tweetie can be a bit confused about which username and password needs to be entered. Minor issue, but an issue definitely IMO.

Compare that with Nambu, another Twitter client for Mac, which shows a much better interface:

This is so much better.

Another pain point for me is the 140 characters limit in twitter. While numerous debates rage on the positives and negatives of the 140 character limit itself, as a newbie twitter user, I frequently forget that there is a limit. Here's what Tweetie does to make users like me aware of the limit:

See that limit overflow indication on the top right corner of the window? Well, it so happens that I am frequently writing my twits in a hurry and am used to typing out whatever I have in mind and hitting 'Enter'. And yours truly missed the overflow indication more often than not. Again, comparing this with Nambu:

Now the limit overflow is crystal clear, isn't it?

More blooper expeditions to follow. Keep watching this space!

Believe it or not, but my Dad seems to have reduced his usage of Yahoo! because he cannot come to terms with the new UI layout of the main page. "This Yahoo.com has become useless, I can't find anything on this page anymore. Where have the old links disappeared?" was his question to me. Frustration was showing on his face as he posed the question to me.

Now we all like to tout the Web 2.0 and companies like Yahoo! have promptly upgraded their UI to be in sync with Web 2.0 - The gradients, the DTHML transitioning effects, the AJAX stuff and what not. If you ask me, Yahoo's change is a welcome change. I find the new site visually pleasing and maybe a bit more easy to use as well.

Being in my 20s, and having been brought up in the computer age,  I can adapt quickly. But what about people who started using computers when they were 40 years old? As it is, using a computer is an overwhelming experience for them. If you are at 40, your brain has already been clogged with tonnes of information, and most importantly your learning ability slows down considerably. People have to take pains to remember how to log in to a system, type a mail and then send it. It might seem trivial to you and me, but it's an everyday ordeal for them. If something changes in this set routine of sending mail, say, the server times out, they feel uneasy. Or worse, if you ask them to throw out a costly Microsoft Outlook and replace it with Mozilla Thunderbird, they will have none of it. They get confused as they have to unlearn their previous learnings and learn new things. It is tough to get out of the comfort zone. And why should they?

Take another example, as a true Sun employee, I got my Dad a CD of OpenOffice 2.0.4. It is a beautiful product, if you ask me. A worthy alternative to the proprietary MS Office. OpenOffice 1.x was too simplistic as compared to contemporary MS Office versions, but with the release of OpenOffice 2.0, the gap between them has reduced quite a lot. But my Dad doesnt seem to have taken a particular liking to OpenOffice. When he presses Delete on a cell in a spreadsheet in OpenOffice Calc (OpenOffice's answer to MS Excel), it throws up a dialog asking him to confirm his action and gives him some more alternatives (like converting the formula results to a value instead deleting it). This is not how MS Office behaved, and simply because of that it is annoying to my Dad. Page Layout menu option is not in the File menu in OpenOffice, it's somewhere else. These little things, here and there, are wasting his time.

Sites like Yahoo! must have done a considerable research before launching the new UI. I remember they were asking for feedback in March 2006 for the new main page. I don't criticize them, but I don't like the plight of users like my Dad who are left high and dry. Similarly, I don't think making OpenOffice an exact replica of MS Office is the solution. Surely there should be an escape hatch somewhere?