You are previewing Designing with the Mind in Mind: Simple Guide to Understanding User Interface Design Rules.

Designing with the Mind in Mind: Simple Guide to Understanding User Interface Design Rules

  1. Copyright
  2. Acknowledgments
  3. Foreword
  4. Introduction
    1. User-Interface Design Rules: Where Do They Come From and How Can They Be Used Effectively?
    2. User Experience Design and Evaluation Requires Understanding and Experience
    3. Comparing User-Interface Design Guidelines
    4. Where Do Design Guidelines Come From?
    5. Intended Audience of this Book
  5. 1. We Perceive What We Expect
    1. Perception Biased by Experience
    2. Perception Biased by Current Context
    3. Perception Biased by Goals
    4. Design Implications
      1. Avoid ambiguity
      2. Be consistent
      3. Understand the goals
  6. 2. Our Vision is Optimized to See Structure
    1. Gestalt Principle: Proximity
    2. Gestalt Principle: Similarity
    3. Gestalt Principle: Continuity
    4. Gestalt Principle: Closure
    5. Gestalt Principle: Symmetry
    6. Gestalt Principle: Figure/Ground
    7. Gestalt Principles: Common Fate
    8. Gestalt Principles: Combined
  7. 3. We Seek and Use Visual Structure
    1. Structure Enhances People’s Ability to Scan Long Numbers
    2. Data-Specific Controls Provide Even More Structure
    3. Visual Hierarchy Lets People Focus on the Relevant Information
  8. 4. Reading is Unnatural
    1. We’re Wired for Language, But Not for Reading
    2. Is Reading Feature-Driven or Context-Driven?
    3. Skilled and Unskilled Reading Uses Different Parts of the Brain
    4. Poor Information Design Can Disrupt Reading
      1. Uncommon or unfamiliar vocabulary
      2. Difficult scripts and typefaces
      3. Tiny fonts
      4. Text on noisy background
      5. Information buried in repetition
      6. Centered text
      7. Combining flaws that disrupt reading
      8. Design implications: don’t disrupt reading; support it!
    5. Much of The Reading Required By Software is Unnecessary
      1. Design implications: minimize the need for reading
    6. Test on Real Users
  9. 5. Our Color Vision is Limited
    1. How Color Vision Works
    2. Vision is Optimized for Edge Contrast, Not Brightness
    3. Ability to Discriminate Colors Depends on How Colors are Presented
    4. Color-Blindness
    5. External Factors That Influence the Ability to Distinguish Colors
    6. Guidelines for Using Color
  10. 6. Our Peripheral Vision is Poor
    1. Resolution of the Fovea Compared to That of the Periphery
    2. Is The Visual Periphery Good for Anything?
    3. Examples From Computer User Interfaces
    4. Common Methods of Making Messages Visible
    5. Heavy Artillery for Making Users Notice Messages: Use Sparingly
      1. Pop-up message in error dialog box
      2. Use sound (e.g., beep)
      3. Flash or wiggle briefly
      4. Use them sparingly
  11. 7. Our Attention is Limited; Our Memory is Imperfect
    1. Short vs. Long-Term Memory
    2. A Modern View of Memory
      1. Long-term memory
      2. Short-term memory
    3. Characteristics of Short-Term Memory
    4. Implications of Short-Term Memory Characteristics for User Interface Design
      1. Modes
      2. Search results
      3. Instructions
    5. Characteristics of Long-Term Memory
      1. Error prone
      2. Weighted by emotions
      3. Retroactively alterable
    6. Implications of Long-Term Memory Characteristics for User Interface Design
  12. 8. Limits on Attention, Shape, Thought and Action
    1. We Focus on Our Goals and Pay Little Attention to Our Tools
    2. We Use External Aids to Keep Track of What We are Doing
    3. We Follow Information “Scent” Toward Our Goal
    4. We Prefer Familiar Paths
    5. Our Thought Cycle: Goal, Execute, Evaluate
    6. After We Achieve a Task’s Primary Goal, We Often Forget Cleanup Steps
  13. 9. Recognition is Easy; Recall is Hard
    1. Recognition is Easy
    2. Recall is Hard
    3. Recognition Versus Recall: Implications for UI Design
      1. Use thumbnail images to depict full-sized images compactly
      2. The larger the number of people who will use a function, the more visible the function should be
      3. Use visual cues to let users recognize where they are
      4. Make authentication information easy to recall
  14. 10. Learning from Experience and Performing Learned Actions are Easy; Problem Solving and Calculation are Hard
    1. We Have Three Brains
    2. Learning From Experience is (Usually) Easy
    3. Performing Learned Actions is Easy
    4. Problem Solving and Calculation are Hard
    5. Implications for User Interface Design
    6. Answers to Puzzles on Pages 124 and 125
  15. 11. Many Factors Affect Learning
    1. We Learn Faster When Operation is Task-Focused, Simple, and Consistent
      1. Task analysis
      2. Objects/actions analysis
      3. As simple as possible
      4. Consistency
      5. The objects/actions matrix
      6. Keystroke consistency
    2. We Learn Faster When Vocabulary is Task-Focused, Familiar, and Consistent
      1. Terminology should be task-focused
      2. Terminology should be familiar
      3. Terminology should be consistent
      4. Developing task-focused, familiar, consistent terminology is easier with a good conceptual model
    3. We Learn Faster When Risk is Low
    4. Summary
  16. 12. We Have Time Requirements
    1. Responsiveness Defined
    2. The Many Time Constants of the Human Brain
      1. Shortest gap of silence that we can detect in a sound: 1 millisecond (0.001 second)
      2. Shortest time a visual stimulus can be shown and still affect us (perhaps unconsciously): 5 milliseconds (0.005 second)
      3. Speed of flinch reflex (involuntary motor response to possible danger): 80 milliseconds (0.08 second)
      4. Time lag between a visual event and our full perception of it: 100 milliseconds (0.1 seconds)
      5. Maximum interval between events for perception that one event caused another event: 140 milliseconds (0.14 second)
      6. Time to subitize (determine the number of) up to four to five items in our visual field: 200 milliseconds (0.2 second; 50 milliseconds/item)
      7. Editorial “window” for events that reach consciousness: 200 milliseconds (0.2 second)
      8. Attentional “blink” (inattentiveness to other objects) following recognition of an object: 500 milliseconds (0.5 second)
      9. Visual-motor reaction time (intentional response to unexpected event): 700 milliseconds (0.7 second)
      10. Maximum duration of silent gap between turns in person-to-person conversation: ~ 1 second
      11. Duration of unbroken attention to a single task (“unit task”): ~ 10 seconds
    3. Engineering Approximations of Time Constants: Orders of Magnitude
    4. Designing to Meet Real-Time Human Interaction Deadlines
      1. 0.001 second (1 millisecond)
      2. 0.01 second (10 milliseconds)
      3. 0.1 second (100 milliseconds)
      4. 1.0 second
      5. 10 seconds
      6. 100 seconds (~ 1.5 minutes)
    5. Additional Guidelines for Achieving Responsive Interactive Systems
      1. Use busy indicators
      2. Use progress indicators
      3. Delays between unit tasks are less bothersome than delays within unit tasks
      4. Display important information first
      5. Fake heavyweight computations during hand-eye coordination tasks
      6. Work ahead
      7. Process user input according to priority, not the order in which it was received
      8. Monitor time compliance; decrease the quality of work to keep up
      9. Provide timely feedback even on the Web
    6. Achieving Responsiveness is Important
  17. Epilogue
    1. Summary
    2. Caveat
  18. Appendix: Well-known User Interface Design Rules
    1. Norman (1983A)
      1. Inferences from research
      2. Lessons
    2. Shneiderman (1987); Shneiderman and Plaisant (2009)
    3. Nielsen and Molich (1990)
    4. Stone et al. (2005)
    5. Johnson (2007)
      1. Principle 1 Focus on the users and their tasks, not on the technology
      2. Principle 2 Consider function first, presentation later
      3. Principle 3 Conform to the users’ view of the task
      4. Principle 4 Design for the common case
      5. Principle 5 Don’t complicate the users’ task
      6. Principle 6 Facilitate learning
      7. Principle 7 Deliver information, not just data
      8. Principle 8 Design for responsiveness
      9. Principle 9 Try it out on users; then fix it
  19. Bibliography
O'Reilly logo

Introduction

User-Interface Design Rules: Where Do They Come From and How Can They Be Used Effectively?

For as long as people have been designing interactive computer systems, some have attempted to promote good design by publishing user-interface design guidelines (also called design rules). Early ones included:

  • Cheriton (1976) proposed user-interface design guidelines for early interactive (time-shared) computer systems.

  • Norman (1983a, 1983b) presented design rules for software user interfaces based on human cognition, including cognitive errors.

  • Smith and Mosier (1986) wrote perhaps the most comprehensive set of user-interface design guidelines.

  • Shneiderman (1987) included “Eight Golden Rules of Interface Design” in the first edition of his book ...

The best content for your career. Discover unlimited learning on demand for around $1/day.