HCI - 13 - Design Rules Human Interaction Computer.pptx

Design Rules Human Interaction Computer

1. DESIGN RULES 2

2. Color Vision is Limited Vision is optimized for edge contrast, not brightness

3. Ability to discreminate color, depends on how color are presented. T hree presentation factors affect our ability to distinguish colors from each other: Paleness: The paler (less saturated) two colors are, the harder it is to tell them apart Color patch size: The smaller or thinner objects are, the harder it is to distinguish their colors. Text is often thin, so the exact color of text is often hard to determine. Separation: The more separated color patches are, the more difficult it is to distinguish their colors, especially if the separation is great enough to require eye motion between patches

4. Red/green color-blind people can’t d istinguish : dark red from black blue from purple light green from white E xternal factors that influence the ability to distinguish colors Variation among color displays Grayscale displays Display angle Ambient illumination

5. Guidelines for using color: Distinguish colors by saturation and brightness as well as hue Use distinctive colors Avoid color pairs that color-blind people cannot distinguish dark red versus black, dark red versus dark green, blue versus pur-ple, light green versus white. Don’t use dark reds, blues, or violets against any dark colors Use color redundantly with other cues Separate strong opponent colors

6. Our Peripheral Vision is Poor The fovea is small: just a centimeter or two on a computer screen, assuming the user is the usual distance from the screen W hy we even have peripheral vision. What is it good for? O ur peripheral vision exists mainly to provide low-resolution cues to guide our eye movements so that our fovea visits all the interesting and crucial parts of our visual field.

7. Common methods of making messages visible : Put it where users are looking Mark the error: placing the error message near what it refers to, unless that would place the message too far from where users are likely to be looking Reserve red for errors

8. Heavy artillery for making users notice m essages : use sparingly Pop up message in error dialog box Use sound  signaling errors and other conditions with sound are remedies that can be used only in very special, controlled situations . In games, sound isn’t annoying; it is expected Flash or wiggle briefly

9. Our Attention is Limited; Our Memory is Imperfect Implications of short-term memory characteristics for user interface design Modes Search Result Instruction

10. Implications of long-term memory characteristics for user interface design : people need tools to augment it

11. The more consistent the operation of different functions, or the more consistent the actions on different types of objects, the less users have to learn.

12. Limits on Attention, Shape, Thought and Action We have limited capacity of attention and short-term memory We focus on our goals and pay little attention to our tools Don’t Make Me Think (Krug, 2005). That is, if your software or Web site makes me think about it , rather than what I am trying to do, you’ve lost me. We notice things more when they are related to our goals: inattentional blindness : When our mind is intensely occupied with a task, goal, or emotion, we sometimes fail to notice objects and events in our environment that we otherwise would have noticed and remembered change blindness : people don’t notice differences in features other than those their goals made them pay attention to

13. Because our short-term memory and attention are so limited, we learn not to rely on them  we mark up our environment to show us where we are in a task Bookmark, Checklist, etc Impact: interactive systems should indicate what users have done versus what they have not yet done interactive systems should allow users to mark or move objects to indicate which ones they have worked on versus which ones they have not worked on

14. We follow the information “ scent” toward our goal If the goal in their head is to make a flight reservation, their attention will be attracted by anything displaying the words “buy,” “flight,” “ticket,” or “reservation. Impact: designers need to understand the goals that users are likely to have at each decision point in a task, AND ensure that each choice point in the software provides options for every important user goal and clearly indicates which option leads to which goal

15. When we reach goal, we often let everything related to it fall out of STM We often forget “loose ends” of tasks: Removing last page of document from copier Turning car headlights OFF Switching device or software back to normal mode Therefore: Systems should remind users of loose ends Modes should revert to “normal” automatically

16. Recognition is Easy; Recall is Hard We evolved to recognize things quickly We assess situations very fast We recognize faces blindingly fast

17. We did not evolve to recall arbitrary facts Tricks for memorizing use recognition to stimulate recall, e.g., Greek “method of loci” Developed writing to avoid memorizing We rely on external memory aids: calendars, PDAs Implication for UI design: See & choose easier to learn than remember & type Use picture where possible to convey function

18. Another rules: U se thumbnail images to depict full-sized images compactly The larger the number of people who will use a function, the more visible the function should be Use visual cues to let users recognize where they are Make authentication information easy to recall

19. Easy: Learning from Experience & Performing Learned Actions Generalizing from experience is easy Main fault is overgeneralization Performing well-learned actions is easy Automatic routines don’t require STM or conscious awareness It’s “compiled mode, parallel” processing Can multi-task (many processors) Brains have done both for hundreds of millions of years

20. Test: Performing Learned vs. Novel Actions! Recite alphabet, A – M Recite alphabet backwards, M – A Write your name with dominant hand Write your name with non-dominant hand Countdown from 10 to 1 Countdown from 21 to 1 by 3s

21. Hard: Problem Solving & Calculation! Problem solving is evolutionarily new Only a few mammals & birds can do it. We’re the best. Cerebral cortex is where conscious reasoning happens Lets us write programs for ourselves & run them in monitored, emulated mode, rather than compiled mode But monitored thought runs slowly, uses up STM, can’t be multi-tasked (only one processor) Calculation is extremely new Originated only ~5K years ago Expensive: mainly done in controlled, monitored mode

22. Only small problems don’t tax memory & attention 9 x 10 = ? Most exceed STM or require retrieval from LTM 93.3 x 102.1 = ? Diagnosing computer problems Requires systematic testing of possibilities We invented writing, numbers, arithmetic, calculators & computers to overcome our brain’s limitations

23. EASY: Learning from Experience & Performing Learned Actions HARD: Problem Solving & Calculation Implications for user interface design: Prominently indicate system status and users’ progress toward their goal Guide users toward their goals Tell users explicitly and exactly what they need to know Don’t make users diagnose system problems Minimize the number and complexity of settings. Let people use perception rather than calculation. Make the system familiar Don’t make people calculate what software can calculate

24. Many Factors Affect Learning We learn faster when : Vocabulary is familiar and task-focused Vocabulary is consistent Risk is low

25. Familiar Terms Speed Learning Geek-speak hurts learning

26. Geek-speak hurts learning

27. Human Real Time Characteristics Shortest audible silent gap in sound: 0.001 sec Briefest visual stimulus that affects us: 0.005 sec Shortest noticeable lag in ePen ink: 0.01 sec Threshold for auditory fusion of clicks: 0.02 sec Threshold for visual fusion of images: 0.05 sec Speed of (involuntary) flinch reflex: 0.08 sec Lag in full awareness of visual event: 0.1 sec Limit on perception of cause/effect: 0.14 sec

28. Time for skilled reader to comprehend a word: 0.15 sec Time to subitize 1-5 items: 0.2 sec Time to identify (name) visual object: 0.25 sec Time to count items in visual field: 0.5 sec/item Minimum visual-motor reaction time: 0.7 sec Average conversational gap: 1 sec Length of unbroken attention to task: 6-30 sec

29. Applicability to UI Design Controls must react within 0.14 sec to clicks, or perception of cause/effect is broken