Thursday, July 17, 2008

Four Bad Designs

Bad content, bad links, bad navigation, bad category pages... which is worst for business? In these examples, bad content takes the prize for costing the company the most money.

Every year, I see thousands of design mistakes in both user studies and everyday life. The curse of working with Don Norman is that half the elevator buttons I see make me angry: Why can't these guys do what Don told them to do 20 years ago?

Then again, Web designers don't do what I told them to do 13 years ago, so why am I surprised? Following is a modest harvest of design stupidities I've recently encountered.

Bad Content: Jazz at Lincoln Center

While in New York for my usability conference, I wanted to take the speakers out for an evening of jazz. Here's the information I found about a Jazz at Lincoln Center performance:

Screenshot of the product page for a performance at Jazz at Lincoln Center

What information? The site provides the musicians' names and a photo of the lead trombonist. That's it. No player biographies, no description of the type of jazz they play, no quotations from reviews, no links to independent reviews, no audio clips so you could actually hear the band.

In fairness, does offer music clips for some of its performances. Sample music clips are an obvious way for a music-related site to use multimedia; it's much easier to explain music through audio clips than words. Listen to clips on the Metropolitan Opera site and you'll understand the difference between a questionable Tan Dun opera and a delightful Mozart classic in less than a minute.

On the page above, however, there's simply a hopeful request (in big letters) that you'll "make a reservation" without knowing anything about the concert. Not likely, unless you're already well acquainted with the band.

The page does offer nice features, such as the ability to email friends and view a plain-text version for handhelds. Offering some content would have been nicer.

Links without Information Scent: New York Times

The site offers a link at the bottom of each article:

Screenshot of the bottom of an article on The New York Times website.

Who'd want to click on "Next Article in Business"? Maybe a few more people than the eager audience for "article 19," but not many.

I thought I'd seen the end of offering links to articles with no information beyond their number — a design I panned in my review of 12 years ago. Links need information scent to help people determine what they'll get if they click. People don't have time to click on everything.

The Times could defend its design using statistics: this obscure link might actually get some clicks despite my condemnation. After all, when you have millions of users, even the stupidest design idea will get some use. This is the design philosophy that leads to overstuffed websites that resemble Times Square in their relentless attack on the senses.

The problem is that every extra design element detracts from all the other design elements on the page. When you push irrelevant links at people, you teach them to ignore the ones that matter.

(Update: The Times has redesigned its site. Now, the link at the bottom of an article reads something like More Articles in Business ». Better, but still not great. I am keeping my critique, because the site did feature the bad design for more than a year — and in any case you can still learn from their mistake, even after they [partly] fixed it.)

Interior Splash Pages: Christopher Norman Chocolates

Biting into a Christopher Norman chocolate is a delectable experience. Chewing through his site is far less tasty. When you select a category from the main navigation menu, you don't get a page listing the corresponding products. Instead, you get a splash screen, like this one for "Geometrics & Fruits":

Screenshot of a category page (or rather, the splash screen before the detailed category page) on Christopher Norman Chocolates.

Normal users would assume that this category contains only the two depicted products, and would leave if they didn't want the pears or the domino box. In reality, users have to click through this screen to get to the actual category page with a full product listing.

Splash screens are bad enough when they sit in front of a site's real homepage, but at least users encounter those screens only once. With a splash screen for every category, users have to click through many extra pages to see all the products.

Metaphor Run Amok: Specialized Bicycles

The bicycle vendor uses a museum metaphor as its category page for suspension systems:

Screenshot of category page on Specialized's website (a bicycle vendor).

I must say that I like the "whale skeleton" made from bike parts. Still, moving around this simulated 3D environment to get a closer look at the various suspension mechanisms is a pain.

3D navigation is almost always bad. It's harder to manipulate, it doesn't show the choices as well as a 2D interface, and it tends to be slower to use.

Metaphors sometimes make a user interface easier to learn because they let users transfer their existing knowledge from the reference domain. In this case, however, knowing how to navigate a Natural History Museum won't help you identify better bike parts. Websites that use metaphors almost always go way overboard and end up reducing usability. It's as if the metaphor becomes an evil attraction that diverts the design team's attention from the actual content it's supposed to communicate.

The Business Cost of Bad Design

How much do these bad design ideas cost the site owners?

The New York Times is probably losing the least money; most users will simply skip the no-scent link. At the same time, of course, the generic link has an opportunity cost: in its place, the newspaper could offer a link to content that's closely related to the current article. People who actually read to the end of the page would be quite likely to click the link. The site could thus gain maybe 2–5% more pageviews through better use of that space.

My bet for biggest business loss is the content-poor jazz page. Our user testing of product pages shows that people are much more likely to buy when a page answers their questions about its offerings. With virtually no information, it's pretty much guaranteed that this Jazz at Lincoln Center page only closes the sale for strongly committed fans who would attend any performance with Wycliffe Gordon.

My guess is that, by adding more information, the site could sell at least 5 times as many tickets to non-fans. In studying the ROI of usability improvements, we sometimes find a sales increase of 1,000% or more. So, adding meaningful content might even make this page a tenbagger for non-fanatical customers. How much the overall sales would increase depends on the ratio between the rabid adherents of this artist and the people who simply like some jazz from time to time. My guess is that the second group is so much larger that better content would make sales explode.

The last two sites are an intermediate case. For large sites, offering awkward navigation is a prescription for doom: users wouldn't stand for interstitial splash pages or bloated metaphors if they had to find their way through 10,000 products or more. But when dealing with just a handful of products — like those offered by Christopher Norman and Specialized — motivated users can overcome bad navigation. When a site has relatively few pages, users are unlikely to get hopelessly lost.

Of course, less motivated users will leave the first time they get even a bit lost. Bad design costs a company money, no matter how small the site.

Learn More

Full-day course on the design issues that will win or lose your site the most money: Fundamental Guidelines for Web Usability at the Usability Week 2008 conference in San Francisco, London, and Melbourne.

No comments:


Blog Widget by LinkWithin