1 / 45

Dr. Gitte Lindgaard

Dr. Gitte Lindgaard. HOTLab (Human Oriented Technology Lab) Carleton University. Today’s talk. What is usability Human information processing models Signal detection theory in user interface design Objective and subjective performance criteria

leon
Download Presentation

Dr. Gitte Lindgaard

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Dr. Gitte Lindgaard HOTLab (Human Oriented Technology Lab) Carleton University

  2. Today’s talk • What is usability • Human information processing models • Signal detection theory in user interface design • Objective and subjective performance criteria • Applying signal detection theory to user interface design • Taking advantage of perception and human information processing in user interface design • Screen design principles applied

  3. What usability is about • Usability is about • The ease with which interactive technology can be learned, used, continue to be used • Performance • Likeability • Capitalizing on what people are best at and what computers are better at • Taking into account human perceptual, cognitive, and affective capabilities and limitations

  4. Stage 2 Stage 1 Stage 3 Stage 4 Output Compare Select Response Execute Response Encode A model of Human Information processing IP

  5. Sensory perception • Sensory modalities • Vision objects, size, colour, shape, density, texture • Auditory tone, timbre, pitch, intensity, frequency • Tactile feel pressure, temperature • Olfactory discriminate odours • Gustatory taste sweet/sour/bitter/salty • Stages in perception • Detect a stimulus • Attend to important aspects • Interpret the meaning, take • Action in response • How does this work with our model of information processing?

  6. Stage 2 Stage 1 Stage 3 Stage 4 Output Compare Select Response Execute Response Encode Act Information processing stages Information processing stages IP D e t e c t Interpret Attend

  7. Conflicting perceptual theories • Constructivist theory • Seeing is an active process that constructs our view of the world from information in the environment and stored knowledge • Perception involves intervention of representations and memory • Ecological theory • perception is a direct process in which information is detected rather than being constructed • We see what is afforded by the object, system or event • Both argue that we are active perceivers, but • Constructivists say we embellish and elaborate retinal images • Ecologists say we explore the objects in our environment

  8. Perceptual Depth Cues • Size • Overlay • Contrast • Shadow • Converging • Texture

  9. Sensory Information Store Short-term Memory Long-term Memory Human Memory Visual: 0.1 sec Auditory: 3-4 sec without processing ~ 30 sec without processing ?Forever

  10. Stage 2 Stage 1 Stage 3 Stage 4 Output Compare Select Response Execute Response Encode Act Information processing stages Information processing stages IP D e t e c t Interpret Attend Sensory Information Store Long-term Memory Short-term Memory

  11. Perception & interpretation in design • Can the user see the stimulus? • Is it distinguishable from the background? • Is it clear which is the important item? • Does the meaning of the display stand out? • Is it obvious what action is required?

  12. Software development without guidance • Software developers may not appreciate the difference to the user between data and information • Too much data hides the message • Starting from applied research in Human Perception and Cognition, the objective in design of complex applications is to facilitate all of the above for the operator

  13. Example of applied Perceptual research: Signal Detection Theory Noise Signal Peopledetect signals by making judgments based on the strength of the signal against the background “noise” in which it is embedded

  14. Signal Detection Theory: four probable outcomes in a statistical decision

  15. Signal Detection Theory: effects of shifting the objective criterion • To help your users detect important information: • Strengthen the signal • Lower the noise • Remember that the user will have a bias to determine whether or not the information is present

  16. What is this? Is the journal in the library? Is it clear which are buttons here?

  17. Possible responses Response observed YES NO YES NO Response predicted

  18. Decision matrix State of the world Event occurred Event did not occur Event did Event not occur occurred Judgment by observer

  19. Objectives in design • Pull the signal and noise distributions as far apart from each other as possible • Regardless of where you set the objective criterion, there is a cost • The purpose of the system determines the position of the objective criterion • The complexity of the user’s tasks must be considered also

  20. c Applying Signal Detection Theory • Which display shows a network problem spot more clearly? • Background noise reduced • Signal is strengthened by adding visual weight

  21. Subjective performance criteria • How it works: • At low task demand levels, human performance is aligned with task demands • As demands increase beyond human capacity, the performer reduces his internal criterion. • The gap between task demands and performance increases over time, but the human performer is unaware of this shift in performance criterion and continues to believe his performance is Ok • Think of “speed blindness”, drunk drivers, tired truck drivers (Moray, 1983) p e r f o r m a n c e Task demands Human performance time

  22. 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 69395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39398502 1702847 5959531Fo0S 484230P< 39395502 1182847 5959530Fo1S 484229P< 39395502 1882847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959563Fo0S 484229P< 39395602 1182847 5979530Fo0S 484229P< 39845502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502

  23. 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 69395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39398502 1702847 5959531Fo0S 484230P< 39395502 1182847 5959530Fo1S 484229P< 39395502 1882847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959563Fo0S 484229P< 39395602 1182847 5979530Fo0S 484229P< 39845502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502

  24. Task complexity • Think about this task…The operator must • Find the right column • Transform a number into a perception of the location of an approaching aircraft relative to himself • Remember what that number was on the last screen and the screen before that and before that…. • Compare these numbers mentally to • Decide whether or not the aircraft is descending

  25. 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 69395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39398502 1702847 5959531Fo0S 484230P< 39395502 1182847 5959530Fo1S 484229P< 39395502 1882847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959562Fo0S 484229P< 39395602 1182847 5979530Fo0S 484229P< 39845502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182849 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 69395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39398502 1702847 5959531Fo0S 484230P< 39395502 1182847 5959530Fo1S 484229P< 39395502 1882847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959562Fo0S 484229P< 39395602 1182847 5979530Fo0S 484229P< 39845502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182849 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 69395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39398502 1702847 5959531Fo0S 484230P< 39395502 1182847 5959530Fo1S 484229P< 39395502 1882847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959562Fo0S 484229P< 39395602 1182847 5979530Fo0S 484229P< 39845502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182849 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 69395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39398502 1702847 5959531Fo0S 484230P< 39395502 1182847 5959530Fo1S 484229P< 39395502 1882847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959562Fo0S 484229P< 39395602 1182847 5979530Fo0S 484229P< 39845502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182849 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 69395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39398502 1702847 5959531Fo0S 484230P< 39395502 1182847 5959530Fo1S 484229P< 39395502 1882847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959562Fo0S 484229P< 39395602 1182847 5979530Fo0S 484229P< 39845502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182849 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 69395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39398502 1702847 5959531Fo0S 484230P< 39395502 1182847 5959530Fo1S 484229P< 39395502 1882847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959562Fo0S 484229P< 39395602 1182847 5979530Fo0S 484229P< 39845502 1182847 5959530Fo0S 484229P< 39395502 1182847 5959530Fo0S 484229P< 39395502 1182849 5959530Fo0S 484229P< 39395502 Etc. 60 sec ago 45 sec ago 30 sec ago 15 sec ago Now

  26. Altitude Time

  27. Design for usability • Designer’s job is to make it easy to • See/hear that something is happening that should be attended to • Locate the important stimulus • Interpret what it means • Take the correct action • Make it easy to remember information from one occasion to the next • Prevent errors • Slips • Mistakes • Support rapid error recovery

  28. Example of a screen design OEO50I INIT ENTRY: ANDREW MEDICI I11489 SERV#: _______ EXT#: _________ EE#: _____ *** TPIS/2 ORDER S&E ENTRY *** EXCH ACT: J EXCH CODE: ______ INPLACE: _________ IP DATE: ______ EXCH RMK: ____________________________________________________________________ SERVICE NAME: ________________________________________________________________ ADD ADDR INFO: _______________________________________________________________ SUB ADDR TYPE: ______________________________ SUB ADDR#: ____________________ STREET#SFX: _______ ________ NAME: ____________________ TP/SFX: ______________ LOCALITY: __________________________ POSTCODE: ________ FLT CLR PTY: ___ TEMPORARY: _ AL CONN: _______ ROT CONN: ___ PEXT? __ LINE TYPE: _____ NEXT FAC: _ LN SEL: __ ARE CODE: REM/CCN(R/N): __ - SERV STATUS: ___ DISC TYPE: PAL#: _______ RENTAL RATE: ___ METER RATE: ___ CONC AUTH: _________ CAB#: ______ ASIC: _________ DIRECTORY ACTION REQ (Y/N): _ DIRECTORIES#=-> WH: __ YE: _ COM: ___ COMMAND: ______

  29. No better when it is filled in OEO50I INIT ENTRY: ANDREW MEDICI I11489 SERV#: _______ EXT#: _________ EE#: _____ *** TPIS/2 ORDER S&E ENTRY *** EXCH ACT: J EXCH CODE: PBX334 INPLACE: 3374606 IP DATE: 04089996 EXCH RMK: N/A QREMM SERVICE NAME:PETER JAMES HOUSTON ADD ADDR INFO: ROWANVILLE MELA SUB ADDR TYPE: SEMI-ATT. DUAL H/H DWELLING SUB ADDR#: 337A STREET#SFX: CRESCENT NAME: ST BARTHOLOMEW TP/SFX: PMT/YY LOCALITY: ROWANVILLE WEST POSTCODE: 3957 FLT CLR PTY: ROP TEMPORARY: N AL CONN: P/T ROT CONN: 3F PEXT? Y LINE TYPE: PBX NEXT FAC: N LN SEL: PR ARE CODE:TTYP-M REM/CCN(R/N): 2X - SERV STATUS: INP DISC TYPE: PAL#: POTT/P RENTAL RATE: RES METER RATE: PM1 CONC AUTH: MELA CAB#: 228FS/476PW ASIC: 338PY DIRECTORY ACTION REQ (Y/N): N DIRECTORIES#=-> WH: N YE: N COM: PB COMMAND: EXT

  30. Simple ways to improve screens • In Western culture, people start reading from the upper left corner, across, then down the page, ending in the lower right corner • Apply that simple principle in screen design

  31. …use a consistent pattern • Area 1: The tree and the selection criteria areas allow the user to specify a subset of data to be retrieved • Area 2: The results of the search are displayed in this region • Area 3: A set of filters are sometimes provided to further select specific data from the retrieved data • Area 4: Details regarding a selected object are displayed in this area.

  32. Simple remedies OEO50I INIT ENTRY: ANDREW MEDICI I11489 SERV#: _______ EXT#: _________ EE#: _____ *** TPIS/2 ORDER S&E ENTRY *** EXCH ACT: J EXCH CODE: ______ INPLACE: _________ IP DATE: ______ EXCH RMK: _______________________________________________________________ SERVICE NAME: ________________________________________________________________ ADD ADDR INFO: _______________________________________________________________ SUB ADDR TYPE: _____________ SUB ADDR#: ____________________ STREET#SFX: _______ ________ NAME: ____________________ TP/SFX: ______________ LOCALITY: _____________ POSTCODE: ________ FLT CLR PTY: ___ TEMPORARY: _ AL CONN: _______ ROT CONN: ___ PEXT: __ LINE TYPE: _____ NEXT FAC: _ LN SEL: __ ARE CODE: REM/CCN(R/N): __ SERV STATUS: ___ DISC TYPE: ______ PAL#: _______ RENTAL RATE: ___ METER RATE: ___ CONC AUTH: _____ CAB#: ______ ASIC: __ DIRECTORY ACTION REQ (Y/N): _ DIRECTORIES#=-> WH: __ YE: _ COM: ___ COMMAND: ______ Reduce alignments

  33. Improvements to this screen… • Use a mixture of CAPITAL and lower case letters • We ‘see’ words as shapes • Using the downward strokes as in p j y • And the upward strokes as in k l b helps us detect the word shape with less effort than reading PJY or KLB because the shape is lost when using capital letters • Use highlights to make those fields stand out that users must fill • Eyes can ‘jump’ straight to those items • This reduces the probability of users making errors like missing fields they should fill in

  34. Further improvements Oeo50I Init Entry: ANDREW MEDICI I11489 Serv#: _______ Ext#: _________ Ee#: _____ *** TPIS/2 ORDER S&E ENTRY *** Exch Act: J Exch code: ______ Inplace: _________ IP date: ______ Exch Rmk: _______________________________________________________________ Service Name: ________________________________________________________________ Add Addr info: _______________________________________________________________ Sub Addr Type: _____________ Sub Addr#: ____________________ Street#Sfx: _______ ________ Name: ____________________ TP/Sfx: ______________ Locality: _____________ Postcode: ________ Flt Clr Pty: ___ Temporary: _ Al Conn: _______ Rot Conn: ___ Pext: __ Line Type: _____ Next Fac: _ Ln Sel: __ Are Code: Rem/Ccn(R/N): __ Serv Status: ___ Disc Type: ______ Pal#: _______ Rental Rate: ___ Meter Rate: ___ Conc Auth: _____ Cab#: ______ Asic: __ Directory Action Req (Y/N): _ Directories#=-> WH: __ YE: _ Com: ___ Command: ______

  35. Semantics • Group items that ‘belong’ together • Give visual cues about the status of these • Make actions clear that user can take • Show additional information to help the user learn for the future • Be aware of users’ expectations

  36. New… Ctrl+N Open… Ctrl+O Close Save Ctrl+S Save As Save as web page Search… Versions… Screen elements: Menus • What may you deduce from the following? • Semantic groups • Hot keys shown • “more” (open another window) • “more” (primary menus) • Can be activated • Cannot be activated

  37. Large impact of small changes • If you want to impact user performance negatively • Don’t give people what they expect • Apply design norms inconsistently • Make users guess how the system will behave today • Invent your own standards, but don’t stick with them everywhere • Use a lot of different colors, shapes, sizes, rules • Usability is also about predictability

  38. File Edit View Insert Format Tools Other Other Help Other Edit Format Help View Tools File Other Insert File Edit View Insert Format Tools Other Other Help File Edit View Insert Format Tools Other OtherHelp Impact of minute changes These examples are trivial but annoying and time-wasting because they force more work on the central cognitive subsystems

  39. Here is a more serious example of a seemingly minor change Before automation • Paper roll from high-pressure petro-chemical • Factory undergoing automation: • Shows pressure and temperature over time • One rectangle (horizontal) shows amount of change • One rectangle (vertical) shows 30 minutes in time • Changes are readily visible • Operators can enter notes as product progresses • Easy to go back in time to see whole procedure • This display was not kept time Amount

  40. Changes made: • Pressure and temperature now • Separated on different displays • The scale has been rotated 90 • Time is now horizontal • Amount is vertical • One square (horizontal) is 5min • One square (vertical) is 1/10 of • Earlier measure • Effects: • Operators were unable to run the factory • The quality of output dropped through the floor • The company nearly lost its biggest customer (60% of product) • Engineers were put on team 24/7 for first six months After automation Amount Time

  41. Could this have been avoided? • Studying the users and how they ran the factory before a system was ordered would have helped to understand • how they make decisions • What cues they rely on for making decisions • What else they need (documenting the product history in a simple, accessible way) • How to manage the transition period • Etc.

  42. Conclusion • Understanding how people detect, encode, and process information promotes usability • Signal detection theory can be applied to user interface design to help users distinguish between important and unimportant information • Users have a memory  and they will use it! • Clarity and consistency promotes usability • Designing user interfaces is a very important activity • 60-70% of software code is related to the user interface

  43. This is what we do in the HOTLab • Contact Dr. Gitte Lindgaard for more on ext 2255 • E-mail: gitte_lindgaard@carleton.ca • Web site: www.carleton.ca/hotlab

More Related