“No matter how cool your interface is, less of it would be bettter” – Alan Cooper

We’re all familiar with “less is more,” but there’s a minor variation of this guideline I’ve come to call the “Adding Versus Fixing” dilemma.

In order to address a usability concern, our gut reaction is to add one more bit of text, one more knob to turn, one more button to push… “If they only knew a little bit more or had a little more control, they’d be fulfilled!”

More often than not, these types of band-aids are symptoms of a more significant problem.

• The most often abused example is the confirmation dialog, which has unfortunately become so ingrained as a valid interaction that it’s difficult to convince people otherwise. Concerned with accidental deletion, we throw up the ubiquitous “Yes/No/Cancel?”. The real problem however, is the lack of undo functionality. Instead of adding endless confirmation, fix the real problem and support undo. And not the “oh my God true undo will require a rearchitecture and take years!!” but the “maybe we can allow them to undo only the last thing they did? And not after they log out?” type of undo.
• At a previous employer, we dealt with countless support issues because of our inability to limit choice. If they couldn’t do anything they wanted whenever they wanted, it was viewed as undue restraint. This led to reams of special-casing every time a new operation was added to the system. They never addressed the real problem – too much choice.

Rip off the band-aid and address the root cause.

Continue Reading

Overall, my experience with the USPS web site has been a pleasant one. I recently sold several items on eBay and printed many labels. It saves me a trip the Post Office and for that I’ll suffer through most anything, which is a strange selling point – the in-person experience is so bad yet I still patronize the company. Fortunately they’ve done decent work and their UI gets the job done. It’s as much as I can ask from the government :-)

This one particular interaction always trips me up: When you fill out an email address and click on the “Notify recipient” checkbox, the check mark disappears!

We won’t take too much time to bemoan the inclusion of a group box around a single control ;-)The developer is attempting to solve a problem that doesn’t exist via the use of “helpful” JavaScript.

<input type="text" id="deliveryEmail" onchange="checkEmailAddress('deliveryEmail', 'emailNotification')"/>

The issue is one of placement. If the check box was not next in the component flow, this would work perfectly. Because it is next in line, this is what happens:

1. Fill out email.
2. Click checkbox.
3. Email field loses focus.
4. JavaScript checks the checkbox.
5. My click unchecks the checkbox.

The more important issue to consider is that this JavaScript is attempting to solve a problem that doesn’t exist, akin to pages that automatically advance the tab order when you’ve completed filling out a field.

Developers are attempting to address the false goal of minimizing clicks. What they fail to understand is that these easy component navigation clicks are invisible to users. They understand that to type or check something you have to click on it. Why break that expectation? I’m typing in one field and without purposefully navigating to another, my focus has changed?

Some people may notice it but I suspect most people are clicking anyway, so they get no benefit. Other people navigating with the keyboard are frustrated because their navigation model is broken.

Don’t pull the rug out from under your users.

Continue Reading

Courtesy of the Buy.com product search results page:

• How many people know what a “permalink” is?  And when did we start differentiating between “permanent” and… non-permanent links?  If there’s one thing that will make the web more usable, it’s the idea that some links are temporary.  As if bookmarking isn’t complicated enough…
• The way it’s been presented is that it looks like a label for the “product zoom” toggle.
• The lightning bolt / shock icon doesn’t exactly imply permanence. I can’t imagine many folk eager to click on icon which we’ve only experienced as a warning label on power transformers.
• Less of your interface is better. If “permalinking” is so important, can’t you mod_rewrite or engineer your app in such a way that it doesn’t have to be requested?

And yes, that’s some engineering on my part to search for ‘usability’ so that something so ridiculous shares the screen with something so not ;-)

Continue Reading

Having had a recent blowout on eBay after our latest relo, I’m in the midst of updating my shipping information when…

And you thought the government wasn’t helpful. Here’s the scary part from the USPS CSS:

.stackTraceRed {
color:#CC0000;
}

Someone actually took the time to verify that this is what a stack trace would look like. There’s no excuse for this sort of lazyness in development. Anything is more useful.

In related news, I really enjoy the conversational tone of the Scotch tape I’m using… “Yet Strong In Use!”

Continue Reading

Objective – Locate a Comcast charge made during August.

Means – Chase Online’s credit card search interface.

Issues – How long do you have?

1. Several near-alignment and centering issues. I’m hard-pressed to find a single instance of alignment in this entire interface. It appears unprofessional and amateur.
2. Components are jam packed together as though there were issues with how much vertical space is available on a web page. This is well “below the fold” so a few more pixels won’t hurt.
3. “Select Account”… I have no choices available to me here and I’m looking at my credit card right now! What else could I possibly want to search? State Farm? My medical records?
4. “Search for” in the header doesn’t flow into any other part of the interface. “Search for… Select Account”?
5. Choices in the “Since Last Statement” combo box reflect how the bank thinks about my activity, not how I think about it: “Last Statement”, “2 Statements Prior”, “3 Statements Prior”, “All Transactions”.  Hey geniuses, if I knew where it was, I wouldn’t have to search for it!
6. The “From” and “To” fields are blank slates. I have no idea how I’m supposed to format my input into these fields. How about some bounded date-input components? Or a JavaScript-based calendar picker like the ones travel sites use?

Guys, you’re running a massive bank here. Drop minimum wage on a high school student to clean this up. Because you’re my bank, I’ll get you started.

The first option defaults to the last three months. The second option defaults to the current calendar year. Only Chase can tell me if this is what people are typically interested in, but it’s certainly better than what I’ve been using for the past few years on their site.

Continue Reading

Viewing videos at GameSpot comes with an interesting twist – a novel approach to scrolling.

The pain of vertical scrolling has been somewhat alleviated by the ubiquity of the mouse wheel; no more precision drags or clicks in the right margin. GameSpot has opted to implement horizontal scrolling, and while capturing wheel events is entirely possible (e.g. Google Maps) they have chosen not to.

Furthermore, they’ve broken the typically scrolling component by not bordering the content with scroll controls (Windows) or making the scroll controls adjacent one another in the scrolling direction (Mac).

Yahoo! features a media player with almost precisely the same layout but in place of the horizontal control they have… wait for it… a scrollbar. We’re getting there! However no mouse wheel support and positively microscopic scroll controls don’t make this much more usable. The white dot (representing your place in the content) can be pulled neither up nor down as we’ve come to expect from scrollbars.

Why violate convention for an already cumbersome interaction?

Continue Reading