Focus on design. You might see research mentioned, but only as a basis for evaluating and recommending design features. The Whiteboard aims to encourage you, the designer, to consider usability issues and make your designs more usable.
No plugging one’s own company or bashing one’s competition. You will see contributors from a variety of companiesvendors and consulting firms alike. Products they cite will be ones they use, not ones their organization sells.
No big names. You won’t see anyone famous on The Whiteboard. They’ll all be folks working in the field, applying usability principles and methods to make information technology more usable.
Stimulation and provocation. The Whiteboard is about expert opinion as well as objective analysis, and contributors are encouraged to be provocative. Experts often disagree, so take everything you read here with a grain of salt. Above all, learn how to assess usability yourselffor your users, their tasks, and their context of use.
The Whiteboard will appear in every issue, written by a different columnist each time. If you’re a usability specialist with an idea for a designer-oriented topic, or a designer with a topic you’d love to see covered, drop me a line at email@example.com.
And now, for the inaugural column. Take it away, folks…
"That Just Drives Me Nuts!"
Think of a user interface feature that makes you crazy. It frustrates and annoys, and you just wish software designers would stop using it.
That’s what I asked of several usability specialists I know, and I had them explain why. Here are five rants, with explanations, from across the industry. (Over half involve Microsoft products, which probably says more about market penetration and frequency of use than it does about quality.)
Opening Files Is No Picnic
Julianne Chatelain, Trellix Corporation
The File > Open dialog box provided with Windows 95/NT is a poor shape and size, with bad defaults (see Figure 1). Programs that use it slow my work considerably.
The box shows six items in the first column. To see more, one’s eyes must bob sideways instead of scanning smoothly downwards. Only 18 items (in three columns!) are visible at a time. Seeing the rest requires horizontal scrolling, awkward for regular use. Clicking on the Details icon gives a vertical list with column headings, but the second most useful heading, Modified (date and time), is initially hidden because the dialog box is so narrow.
Today my working directory had 498 items. I clicked repetitively, eyes bouncing painfully. I overshot my target; I cursed. I clicked Details and dragged Modified to the left of Type and Size, but of course my changes didn’t stick the next time I tried to save a file. I stroked my cursor helplessly over the lower right corner, knowing the dialog box would expand if only my heart were pure.
Microsoft’s respected usability teams have banished this dialog box from much of their own software: for example, Word’s File > Open dialog box is tall, wide, and optimized for sorting. It’s just my luck that I work in Exchange, Notepad, and three other (non-Microsoft) applications whose designers said, "Here’s the official File > Open dialog, we’ll just wrap it into our code…" No matter what toolkits give us and standards prescribe, we must study what usable applications actually do, and pass all interface elements through our own usability reviews.
Speaking of Microsoft’s usability teams, I feel pure in heart after trying out the default File > Open dialog box in Windows 2000. It’s larger, with 11 items per column to start, and the lower right corner is draggable.
What’s Standard about Windows Products?
Marios Pittas, Kent Ridge Digital Labs
My 5-year-old once asked about the absence of the Windows taskbar from the login screen. She thought "Daddy’s machine was trying to be funny," since hers had the bar.
The issue was one of consistency and standards. The Windows taskbar appears in all but the login screen. On further analysis, though, maybe that’s appropriate.
However, not all deviations from Windows standards are justified. Where would you expect to find the OK and Cancel buttons in a dialog box? At the side or at the bottom?
Well, the answer is "it depends," but there is no obvious rationale. In the Word 97 Save As dialog box, the buttons Save and Cancel appear at the side. However, in Word’s Print dialog box, the Options, OK, and Cancel buttons are at the bottom. Similar differences exist with the location of the Cancel button in dialog boxes for a download in Internet Explorer 5.0 download and copying a file in Windows 98.
One can argue that locations shouldn’t matter that much! Yet, inconsistencies also exist in common tasks. To exit an application in IE you press Alt + F-C (Close), whereas in Paint you press Alt + F-X (Exit).
Installation is even worse. Upgrading from DOS to Windows 95 and then to Windows 98 requires you to insert the first Windows 3.1 diskette. Upgrading from DOS to Windows 98 requires the full Windows 3.1 set of diskettes!
This is no longer the difference of a few pixels! Users’ models are at stake. Consistency requires standards. And standards require processes to ensure that products have consistent user interfaces (UI).
Developers have learned that the best way to verify their code is to have someone else test it. UI designers must accept that the best way to verify compliance of standards is to give their work to a designer from another team.
Only with the development of UI standards, and the introduction of processes that ensure compliance with these standards, will products be consistent across versions and with other products.
Twisted Links: Stop the Hue Madness!
I tried to turn on the hot water in the ladies’ room at work today. I got cold water instead. Puzzled, I examined the red arrow on the faucet handle; it pointed down and right. Then I looked at the other sink and faucet, the one I normally use. Same visual design, but obviously a different manufacturer. Its red arrow pointed up and left.
This reminder of the importance of consistent design was reinforced less than an hour later when I went to the USA Today Web site. Visiting the News page, I felt my eyes have the equivalent of a violent heart attack.
This page has eight (yes, eight) Not Yet Visited link colors. What’s the eye to do? It wasn’t certain, but the fingers wanted to point the mouse at Preferences and override the designer! Not to be. The designer had overridden user preferencesand without using cascading style sheets:
<a href="..."><font color="#0000FF">
This inventive use of <font color> also killed visited and unvisited feedback. But one set of links had no color specified. My confusion grew because these few links were allowed to meet my expectations.
Did the designer keep the end user in mind when conceiving the artistry for this page? I think not.
Whether it’s a faucet or the Web, we expect a familiar interface to act in an expected way.
Web visitors expect only two distinct sets of hyperlink colors. They also expect the link color to change after being followed. Freezing the link color removes vital feedback.
The browser allows the visitor to manage the Web interface to meet personal needs. Designers’ efforts to sledgehammer their vision of the interface is more than an inconvenience; it is an affront and connotes arrogance. Not the best impression to give when one is trying to selling something.
And all Web sites are "selling" us on the idea of "Y’all come back real soon."
Gratuity Not Included
Dick Miller, Hewlett-Packard
One of my hot buttons relates to Web page usabilitygratuitous graphics.
What’s wrong with using graphics? When they are used inappropriately, graphics can convey little useful information, extend download times by increasing page file size, be useless for people with certain visual impairments, and not work for browsers that don’t display graphics (by design or by user option). Furthermore, animated graphics have been shown to reduce site visitors’ success in finding and comparing information, because they divert attention from the substantive content.
How can you avoid usability problems with graphics? Use only graphics that are essential for conveying important information, and reduce file size by reducing color depth or choosing a different file format. You should always include alternate (ALT) text with every graphic. If graphics are used for navigation links, provide alternate methods for navigation. Finally, test the final drafts of the pages with all possible environments (browser, platform, connection speed, etc.).
Won’t a graphically limited site look bad? Not at all. For an example of a cleanly designed site that uses almost no graphics, see Jakob Nielsen’s site at www.useit.com. See his explanation of the use of very little graphics at http://www.useit.com/about/nographics.html.
For more information, see The Non-Designer’s Web Book: An Easy Guide to Creating, Designing, and Posting Your Own Web Site, by Robin Williams and John Tollett (ISBN 0-201-68859-X) and Web Site Usability: A Designer’s Guide, by Jared Spool et al. (ISBN 1-55860-569-X).
Just Put it on My Tab (Not!)
Elizabeth Buie, Computer Sciences Corporation
My junior-high typing teacher might be surprised to hear it, but I am a keyboardist. I use the keyboard to move around documents and to activate commands and menu options. I tend to reserve the mouse for actions such as moving a window or selecting part of an image. I detest interfaces that make it harder to get things done using the keyboardespecially things I do often.
My worst offender is Microsoft Word’s Format > Paragraph dialog box. This monstrosity first appeared with Word 6 and hasn’t improved substantially since. (Figure 2 shows the Word 98 version.)
When formatting a paragraph, I most often perform two actions: Set Space After and Keep with Next. In Word 5.1 (for the Macintosh), I do these very quickly by a fixed sequence of keystrokes: Command +M, Tab, [desired space after], Command + K, Return. I know it always works the same way, and I don’t have to think about manipulating the dialog box. The newer tabbed dialog box still lets me use the keyboard if I want, but my two actions live on different tabs. I must make sure which tab is on top.
In Word 98 the sequence is Command-Option + M, Command + I, Command + E, [desired space after], Command + P, Command + X, Return. That’s two extra steps just to manage the dialog box. And Steps 1 and 3 have one more keystroke than their sisters in Word 5.1.
I swear it takes me three times as long.
I have no quibble with tabbed dialog boxes for occasional actions, such as setting preferences. I would never remember those key sequences anyhow.
But adding tabs to an often-used dialog box that has so few actions can make things considerably more difficult for the keyboardist.
Whiteboard Column Editor
Senior Principal Engineer
Computer Sciences Corporation
15245 Shady Grove Road
Rockville, MD 20850
Sidebar: Contributors’ Biographies
Julianne Chatelain <firstname.lastname@example.org>
Julianne Chatelain is an information designer at Trellix Corporation in Waltham, Massachusetts. Her most recent project involved interface work on Trellix Web, software to help people create and publish Web sites. She has worked to make interactive information more usable since 1979, on behalf of manufacturing, transportation, software, and health care companies. After work Julianne interacts regularly with hypertext, science fiction, and choral music.
Marios Pittas <email@example.com>
In the software industry since 1990, Marios Pittas manages the Design Group of the Learning Lab at Kent Ridge Digital Labs in Singapore. His projects have ranged from the design of a mobile device to the evaluation of a taxi kiosk. Marios’s interests include mobile devices, co-operative systems, organizational issues in humancomputer interaction (HCI), and task modeling in design.
Kathy Gill <firstname.lastname@example.org>
Kathy Gill is a communications consultant in Bellevue, Washington, specializing in Web design, training, and technical writing. She has worked for Boeing, AT&T Wireless, and various food, agriculture, and forest products organizations. When not tip-tapping at her keyboard, Kathy can be found motoring around Washington State on her 1981 BMW R65.
Dick Miller <email@example.com>
Dick Miller is a technical writer and usability specialist with the Information Technology department of Hewlett-Packard in Vancouver, Washington. There he designs and develops solutions that help internal customers use computers and software to more effectively and efficiently do their jobs. Dick has worked in related fields since 1965. In his spare time, he enjoys playing Dixieland trombone and tuba.
Elizabeth Buie <firstname.lastname@example.org>
Elizabeth Buie is a usability specialist at Computer Sciences Corporation in Rockville, Maryland. In HCI since 1977, she has worked on projects from spacecraft control to investment account management to mobile telephone service provisioning. She now concentrates on Web sites and applications for agencies within the U.S. Department of Health and Human Services. Probably too much of Elizabeth’s "spare" time goes to photography.
©2000 ACM 1072-5220/00/0100 $5.00
Permission to make digital or hard copies of all or part of this work for personal or classroom use is granted without fee provided that copies are not made or distributed for profit or commercial advantage and that copies bear this notice and the full citation on the first page. To copy otherwise, to republish, to post on servers or to redistribute to lists, requires prior specific permission and/or a fee.
The Digital Library is published by the Association for Computing Machinery. Copyright © 2000 ACM, Inc.