usable in any place a human can be used

Showing posts with label ui. Show all posts
Showing posts with label ui. Show all posts

20100412

saying nothing

[caption id="attachment_838" align="alignright" width="326" caption="Thank you, very helpful"]Dialog saying "Error: An Error has Occurred"[/caption]

As a software developer I have the great joy of making things that piss people off. Nothing makes someone angrier than after an hour of meticulously entering financial data, you hit the submit button and get back the error pictured to the right. In actuality, good software developers go to great pains to make their systems as resilient as possible. A large amount of the code written for any complex piece of software will be dealing with error conditions, recovering from the recoverable, and gracefully reporting fatal errors in a way that indicates exactly what happened and why and what to do about it.


One of the best features an error message can have is Google-ability. If the error has a prominent and distinct feature, then a Google (insert your favorite search engine here) Search will be able to deliver relevant results with a much higher degree of accuracy.


Good Error Message Example:



Error ERS1708A - Invalid Character
The field "Zip Code" should only contain numbers, "47CD101" is invalid.
Examples of valid input: 44130, 90210, 43220


Bad Error Message Example:


Form Invalid!!

The first error might be a little overkill, but the first part meets are Google-ability test. Typing ERS1708A into Google will pull up solutions for this problem. The error goes on to report exactly what went wrong in a user friendly way, it even goes so far as to give some samples of what correct input looks like. The second example gives you a vague idea that something bad has happened, something dealing with a form, and if that form happens to have 100 fields on it, well good luck figuring it out (maybe it's even one of those awesome programs that will clear your entire form on error). The problem is that you are equally likely to get either of these error messages from the same input depending on how much effort the programmer put into error recovery and reporting.


We all know that we should strive to help out the end-user and give them good error messages (even better if we can have robust recovery so we don't have to report errors). The problem is that programmers often have to be toolmakers as well. Sometimes when making a tool for other programmers to use we let our error reporting skills slip, these aren't mouth breathing users, these are 1337h4x0rz and will find your undocumented command line tool completely natural. I ran into this mentality today while troubleshooting a Windows Service installation problem. The Service works great on my development machine, works fine on other peoples laptops, but on the security locked down Mobile Data Terminals that the Service actually has to run on, no dice. The error that was being reported during installation was...


The system cannot execute the specified program

This fails in every way imaginable. Completely un-Google-able, go ahead and try it, you will find everything from people installing things on WinPE, to game development, web controls, Server installation.... a deluge of crap. The error message is amazingly useless, the system can't do something, what can't it do, I don't know, it doesn't even tell me. Can it not execute the install.bat file, maybe the executable called by the install.bat, maybe the executable that executable invokes, who knows?!


Well being a clever programmer and systematic debugger I was able to isolate each piece working towards the fact that what the message actually should have said was, "Although I have all the permissions necessary to access and execute all the programs you want me too, one of the programs requires that the system have the Microsoft Visual C++ 2008 SP1 Redistributable Package (x86) installed on the machine before you try to execute it. If you install that, then I can find the dependencies I'm missing and everything will be cool, kthxbye!"


Error messages are one of the few times that we as programmers get to actually directly communicate to the user. Don't waste this opportunity by effectively saying nothing to the user. The error message is a traumatic thing for most users, happily working along until it pops up, keep it short, sweet, descriptive and helpful.

20100211

password usability

A friend pointed me to an interesting article on A List Apart. If you don't want to read through the whole thing it basically says that a lot of password resets are caused by people remembering their passwords correctly but mistyping them. The concerns that once made masking passwords with asterisks are now being eclipsed by the usability problems this design has introduced. The post goes on to describe two potential alternatives, a toggle to show the password in plaintext (similar to the WiFi configuration screen in Windows) or to show the last character typed while masking the rest (similar to the iPhone or Android password inputs).


Both of these options are interesting and I personally would like to see either one gain greater acceptance, although with the rise of password managers built into Operating Systems and Web Browsers it seems less and less necessary. The problem with both of these techniques is discussed in the article, that changing the functionality of the password input undermines the user's confidence in your site's security. This is why I think that changing the nature of password inputs is dubious at best until it gains widespread adoption, maybe if Google were to implement them or some other web giant. Until that day I think a fine alternative would be Mattt Thompson's Chroma-Hash.


Chroma-Hash augments a password input with extra information. Something that is easy to remember and easy to notice when its wrong, a color swatch called the Chroma-Hash. Let's take a look at how it works.


[caption id="attachment_722" align="aligncenter" width="461" caption="The password (conveniently enough 'password') generates the colorful hash to the right."]chroma hash example[/caption]

The passwords match because the colors match, when entering your password you are informed of mistypings immediately by the hash being incorrect. Let's take a look at what happens if we carelessly fat-finger the confirmation typing "passworf" instead of "password" like it should be.


[caption id="attachment_723" align="aligncenter" width="465" caption="One little letter completely changes the Chroma-Hash, immediate feedback"]chroma hash with mismatch[/caption]

Small changes in the password generate big changes in the Chroma-Hash. The human brain is one of the best pattern matching engines in the world, Chroma-Hash leverages this fact. Very small changes in a sites design or color scheme are detectable, that's why people make a big deal when a site they commonly visit changes things, even slightly. This makes Chroma-Hash ideal for serving as a "password proxy." Others can see the Chroma-Hash and gain no information about your password and yet it instantly gives you a wealth of feedback about whether or not you have entered the correct password.


Take a look at Chroma-Hash, fork it on GitHub, implement it on your website. You get the advantage of recognizable feedback without needing to change the fundamental way in which the password input works.

20100105

experimentation

[caption id="attachment_523" align="alignright" width="300" caption="Like most computer related things this type of experimentation will have less blond women"]Female in lab[/caption]

I love my mom, she is a kind, intelligent, funny person. She has worked 2 jobs since I was just a little kid and she still does. For most of my childhood she worked in what we refer to in this country as the "Service Industry." This is a nice euphemism for mind-numbing tedium, the fact that she put in 14-16 hour days to give me the chance to sit here and blog and make good money consulting is a testament to her devotion as a mother. I remember growing up she worked at a Gas Station and at Arby's, sometimes bringing home some tasty chicken sandwiches or Apple Turnovers.


Now my mom works retail and in an office. She gets to work in a nice office and do office work which means that she now has to professionally use a computer. Being the "computer" son I get the calls when there is some task that falls outside the scope of her knowledge, and after all she's sacrificed for me, I'm ecstatic that I get to help her.


The things she needs help with our never very complicated, sometimes its an unfamiliarity with an FTP Client or looking for a way to open up and print multiple files quickly and easily. She normally has figured out or been told some way to get the job done, but it's so slow and tedious that there must be a better way. Normally after a few minutes of explanation we figure out a way that she can do her job faster and easier, and everyone wins.


In my job as a software developer I often have to think about the user, and its an interesting relationship. On the one hand if there were no users then I would make no money and that would be sad, on the other hand the users often end up taking a simple and elegant piece of code and twisting it into a horrible abomination so they can understand it better. The mental images of a slack-jaw fool and a well-meaning bug filer compete in my head. Now though I have a new user mental model, my mom.


I know that she is hardworking, intelligent, and does know how to use a computer for daily tasks. Yet, even with these great user attributes, she still doesn't discover things that I do, and I wonder why.


[caption id="attachment_525" align="alignleft" width="300" caption="Yea that\'s assembly not basic, go complain about it in the comments."]green screen with assembly[/caption]

Perhaps its a generational difference, I can't actually remember a time when I didn't have a computer. I remember distinctly getting the old green and black computer with 5.25in disks that I could play submarine hunting games on from my Uncle Marty. One of the first things I did with this new toy was to get a book from the library full of BASIC games and start typing them here, that's right I've been programming since I was about 6 years old. The thing that no one ever told me was that I could break the computer, to me it was a toy, and the worst thing that could happen is I mess up my disk and have to try again. As I moved up to more and more powerful machines I've always kept that same mindset, the computer is there to accept my commands, there is almost nothing I can do to it that can't be undone.


My mom on the other hand is pre-occupied with the idea that she might break the computer. This is a major difference between computer people and users. Watch a power user trying to figure something out, they will experiment see what happens when they click this or that, issue this command, or right-click in this box over here. A normal user on the other hand normally just uses the program in the way that they've been instructed to, instead of exploring the interface.


In a perfect world everyone would read the user manual, in real life though people don't. Even if people did, it's hard to learn reading, it's easy to learn doing. The power user learns through trial-and-error how something works, once they feel comfortable with the bulk of the application they may turn to the manual to figure out some of the trickier bits. The normal user will never get to a level of comfort to attempt to master the tricky bits. As the power user explores they feel validated and gain a sense of control, giving them a desire to assert their control over the rest of the system. The normal user is simply performing a rote task, the tool is not there to be explored and mastered, it merely performs some function.


Its the difference between becoming a magician and learning a card trick. I can learn a card trick and practice it everyday, becoming incredibly good at the card trick, this in no way makes me capable of sawing a woman in half (and having her live).


Trying to get users to experiment involves a few things



  • Everything your application does should be easily and apparently reversible.

  • Experimentation should be rewarded, never punished

  • The Application must cope well with the unexpected, no nasty error messages

  • Context Sensitive Help


[caption id="attachment_527" align="alignright" width="300" caption="TextMate is full of win"]textmate[/caption]

Case in point: I've recently got my sexy new iMac with the excellent TextMate for coding. It is one of the best experiences I have ever had, but it's not because it is easy. TextMate encourages you to explore and experiment, defining a function, def :tab: will automatically write the end and position you to write the methods. The Bundles menu is quick and accessible, the bundles make it easy to figure out what to do and the reward is instant. All of this culminates to making the software seem usable and easy, even though its very complex.


Turning users into explorers is no small task, but the payoff is great. The more a user feels in control, the more they explore, the more they explore the more in control they feel, its a positive feedback loop. The more in control a user feels the more they associate your project with being easy to use and generally a good piece of software.