Usability Mistakes

Just before I went to Kiwi Foo Camp, I created a major usability bug in
GroupServer, which was mostly due to forgetting to add feedback to a
form.
This caused a large problem for Alice, who had to manage the support load
while I was away.
Thankfully, I managed to correct my error and the page is now better than
ever!

Like many systems, GroupServer requires the user to enter his or her
password twice when it is set.
This is to ensure that the password is set to the value that the user
intended, because GroupServer (like many systems) does not show
the user the password that he or she entered, for security reasons.
I thought it would be nice to add a JavaScript check to the page, to
ensure that the two passwords matched.
In my prototype the Set button was enabled when
the passwords matched, or disabled (greyed out) if the
passwords did not match.
It worked fine for me; I knew why I was not able to click on the
button because I wrote the code.
Unfortunately, as the page moved from prototype to production I forgot
to add feedback to the page.

The disaster unfolded the day before Dan and I went to Kiwi Foo Camp,
when we signed up 800 people to an OnlineGroups.Net site.
When each user browsed to the site for the first time he or she was asked
to set a password… using my broken page.
Poor Alice had to field all the queries from users who could not figure
out why they could not click on the Set
button.

My solution — which I implemented in a very bleary state the
Monday after Kiwi Foo Camp — was to add feedback to the Set
Password page.
My initial implementation was to modify the password-checking code
so the passwords were dynamically-checked as the user typed.
This was better, but not good, as the feedback appeared as soon as the
user started typing!

After
some
prompting by Tim Erickson
,
and a good nights rest, I implemented the version of the
password-checking code that is now deployed on OnlineGroups.Net.
In the current version, the Set button
is always available, and the passwords are checked when the user clicks
on the button.
If there is an error, a message appears in the same position as
the button, moving the Set button down.
This helps the user notice the error message, as it appears where he
or she is probably looking.
After deployment, we signed up another 500 people to an OnlineGroups.Net
site, and everyone has managed to log in without difficulty.
Much to my relief.

Leave a Reply

You must be logged in to post a comment.