GUI Bloopers 2.0

Common User Interface Design Don'ts and Dos

Jeff Johnson

• Publisher: Morgan Kaufmann
• Year: 2007
• ISBN:
  9780080552149
• Edition: 2
• Topic: Design
• Subtopic: UI/UX Design

GUI Bloopers 2.0, Second Edition, is the completely updated and revised version of GUI Bloopers. It looks at user interface design bloopers from commercial software, Web sites, Web applications, and information appliances, explaining how intelligent, well-intentioned professionals make these mistakes – and how you can avoid them. GUI expert Jeff Johnson presents the reality of interface design in an entertaining, anecdotal, and instructive way while equipping readers with the minimum of theory.

This updated version reflects the bloopers that are common today, incorporating many comments and suggestions from first edition readers. It covers bloopers in a wide range of categories including GUI controls, graphic design and layout, text messages, interaction strategies, Web site design – including search, link, and navigation, responsiveness issues, and management decision-making.

Organized and formatted so information needed is quickly found, the new edition features call-outs for the examples and informative captions to enhance quick knowledge building.

This book is recommended for software engineers, web designers, web application developers, and interaction designers working on all kinds of products.

• Updated to reflect the bloopers that are common today, incorporating many comments and suggestions from first edition readers
• Takes a learn-by-example approach that teaches how to avoid common errors
• Covers bloopers in a wide range of categories: GUI controls, graphic design and layout, text messages, interaction strategies, Web site design -- including search, link, and navigation, responsiveness issues, and management decision-making
• Organized and formatted so information needed is quickly found, the new edition features call-outs for the examples and informative captions to enhance quick knowledge building
• Hundreds of illustrations: both the DOs and the DON'Ts for each topic covered, with checklists and additional bloopers on www.gui-bloopers.com

1

First Principles

• Introduction
• Basic Principle 1: Focus on the users and their tasks, not on the technology
• Basic Principle 2: Consider function first, presentation later
• Basic Principle 3: Conform to the users’ view of the task
• Basic Principle 4: Design for the common case
• Basic Principle 5: Don’t complicate the users’ task
• Basic Principle 6: Facilitate learning
• Basic Principle 7: Deliver information, not just data
• Basic Principle 8: Design for responsiveness
• Basic Principle 9: Try it out on users, then fix it!

Introduction

This book describes common user-interface bloopers found in software-based products and services and provides design rules and guidelines for avoiding each one. First, though, it is useful to lay the foundation for the discussion of bloopers by describing the basic principles for designing effective, usable user interfaces.

The nine basic principles in this chapter are not specific rules for designing graphical user interfaces (GUIs). This chapter does not explain how to design dialog boxes, menus, toolbars, Web links, etc. That comes later in this book, in the rules for avoiding bloopers.

The nine basic principles represent the cumulative wisdom of many people, compiled over several decades of experience in designing interactive systems for people. The principles are also based on a century of research on human learning, cognition, reading, and perception [Card et al., 1983; Norman and Draper, 1986; Rudisill et al., 1996]. Later chapters of this book refer to these basic principles to explain why certain designs or development practices are bloopers and why the recommended remedies are better.

“Usable” — not just easy to learn

The term “usable” means more than just easy to learn. Ease of learning is an important component of usability, but it is the least important of three components. To be usable, a product also has to be quick to use and relatively error-free. Most importantly, it must do what the user wants. Keep this in mind as you read this book. Usability refers to three different components: the product does what you need it to do, it does that quickly and safely, and, last, it is easy to learn. Violins are hard to learn, but they have survived for hundreds of years with little change because they supply the other two more important components of usability.

More comprehensive explanations of UI design principles are presented in several books, e.g., Smith and Mosier [1986], Cooper, Reimann, and Cronin [2007], Isaacs and Walendowski [2001], Raskin [2000], Shneiderman and Plaisant [2004], and Tidwell [2005].

Basic Principle 1: Focus on the users and their tasks, not on the technology

This is Principle Numero Uno, the Main Principle, the mother of all principles, the principle from which all other user interface design principles are derived:

Focus on the users and their tasks, not on the technology.

Now that you’ve read it, we’re done, right? You now know how to design all your future software, and nothing more needs to be said.

I wish! Alas, many others have stated this principle before me, and it doesn’t seem to have done much good. And no wonder: it is too vague, too open to interpretation, too difficult to follow, and too easily ignored when schedules and resources become tight. Therefore, more detailed principles, design rules, and examples of bloopers are required, as well as suggestions for how to focus on users, their tasks, and their data.

What does “focus on users and their tasks” mean? It means starting a software development project by answering several questions:

• ■ For whom is this software being designed? Who are the intended users? Who are the intended customers (not necessarily the users)?
• ■ What is the software for? What activity is it intended to support? What problems will it help users solve? What value will it provide?
• ■ What problems do the intended users have now? What do they like and dislike about the way they work now?
• ■ What are the skills and knowledge of the intended users? Are they motivated to learn? How? Are there different classes of users, with different skills, knowledge, and motivation?
• ■ How do users conceptualize the data that the software will manage?
• ■ What are the intended users’ preferred ways of working? How will the software fit into those ways? How will it change them?

It would be nice if the answers to these questions would fall out of the sky into developers’ laps at the start of each project. But, of course, they won’t. The only way to answer these questions is for the development team to make an explicit, serious effort to do so. That takes time and costs money, but it is crucial, because the cost of not answering these questions before starting to design and develop software is much, much higher.

Understand the users

Several of the questions listed above are about the intended users of the software: Who are they? What do they like and dislike? What are their skills, knowledge, vocabulary, and motivation? Will they be the ones who make the decision to buy the software, or will someone else do that? These questions are best answered using a process that is part business decision, part empirical investigation, and part collaboration.

Decide who the intended users are

Early in development, you need to decide who you are developing the software for. It is tempting to say “everyone”: most developers want the broadest possible market. Resist that temptation! Software designed for everyone is likely to satisfy no one. Choose a specific primary target population as the intended user base in order to focus your design and development efforts, even if you believe that the software will also have other types of users.

In reaching this important decision, confirm that your target user base is aligned with your organization’s strategic goals. Seek input from the marketing and sales departments, because it is they who are usually responsible for identifying and categorizing customers. However, remember that Marketing and Sales focus on customers of the product or service, whereas you need to understand the users. A product’s customers and its users are not necessarily the same people, or even the same type of people, so Marketing and Sales’ ideas about who the product is aimed at may have to be filtered or augmented in order to be useful to you.

Investigate characteristics of the intended users

Understanding the users also requires investigation. This means making an effort to learn the relevant characteristics of potential users. Surveying potential users helps you find specific populations whose requirements and demographics make them an attractive target market. After identifying a primary target user population, learn as much as possible about that population.

How do you gather information about the intended users? By talking with them, inviting them to participate in focus groups, observing them in their “natural” environment, talking to their managers, or reading about their business.

Users: Not Just novice vs. experienced

Software developers often think of their intended users as varying on a continuum from computer “novice” to “expert.” People who have never used a computer are on the novice end; professional computer engineers are on the expert end. With that assumption, figuring out who the users are for a particular application is largely a matter of determining where they fall on the continuum.

However, the continuum is wrong. No such continuum exists. A more realistic and useful view is that the intended users can be placed along three independent knowledge dimensions:

• ■ General computer savvy: how much they know about computers in general
• ■ Tas...

Table of contents

• Cover image
• Title page
• Table of Contents
• Copyright
• Acknowledgments
• Introduction
• 1: First Principles
• 2: GUI Control Bloopers
• 3: Navigation Bloopers
• 4: Textual Bloopers
• 5: Graphic Design and Layout Bloopers
• 6: Interaction Bloopers
• 7: Responsiveness Bloopers
• 8: Management Bloopers
• Appendices
• Bibliography
• Index
• About the Author
• Web Appendix: Color Bloopers