| Chapter 1 - Primer of Human-Computer Interaction |
| Affordances 3 Real vs. Perceived Affordances 3 Cues 4 Constraints 5 Example 1: login at petco.com 7 Example 2: the "wheelbarrow" link at garden.com 8 Natural Mappings 9 Metaphors 10 Norman's principles of good design 10 Slips 12 Mistakes 13 Instructions won't prevent errors 13 Ways to prevent errors 15 Handling Errors 17 |
Chapter 2 - Form Design |
|
Overview of the major input elements 19 Input type usage 22 Text vs. specialized input types: select, checkbox, & radio Select vs. radio Select vs. radio vs. checkbox for true/false questions Checkbox vs. multiple select list box Text vs. select pulldown Password vs., well, password… Form visual design 28 Sizing text fields Making form elements noticeable Labeling input elements Labeling required fields Button design 34 Using contrast Button placement Button labels Disabling buttons The "Reset" button The "Submit" button Grouping & differentiating tasks through button design Adding interactivity 41 Input validation 41 Error message tips |
Chapter 3 - Content Design |
|
Tips for creating bite-sized, scannable written content 47 Content presentation tips 49 Example: writing for scannability 51 Common types of useless written content 52 Designing Lists 53 Designing Tables 54 Designing Charts 56 Chart Example 58 The liabilities of automatically changing content 58 "I" versus "You" 59 |
| Chapter 4 - Organizational Models |
|
Classification 63 Association 63 Homogeneity and granularity 64 Classification schemes 64 Ambiguity 65 Cross-referencing 66 Item vs. category cross-referencing 67 Minicase: Category cross-referencing at Staples.com 68 Designing more robust hierarchies to reduce ambiguity 70 Minicase: Nordstrom.com's boot shop 71 Mixing classification schemes 72 |
| Chapter 5 - Navigation Design |
|
High-level navigation 76 A counterpoint: Mark Hurst and the page paradigm. 78 Low-level navigation 81 Utilities 83 Button or link: "Your Account" utility link on Amazon.com? 84 Breadcrumbs 84 Site map 87 Associative links 88 The browser 91 Dynamic menus 93 Link hovereffects 97 |
| Chapter 6 - Winnowing Tools |
|
The navigation spectrum 101 Faceted browsing 102 Example 1: epicurious.com 102 Example 2: beachhouse.com 104 The features of good faceted browsing systems 107 Minicase: Nordstrom.com women's boot shop (cont'd) 107 Treemaps: using faceted metadata to visualize hierarchies & data 109 Guided search 110 Minicase: "Search by Feature" at Sears 112 The features of good guided search tools 115 Conclusion 117 |