1 / 168

IAT 334 Interface Design

IAT 334 Interface Design. Chris Shaw. ______________________________________________________________________________________ SCHOOL OF INTERACTIVE ARTS + TECHNOLOGY [SIAT] | WWW.SIAT.SFU.CA. Exam Materials. Slides Shneiderman & Plaisant Chapters 1-8 Programming materials

kyrene
Download Presentation

IAT 334 Interface Design

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. IAT 334Interface Design Chris Shaw ______________________________________________________________________________________SCHOOL OF INTERACTIVE ARTS + TECHNOLOGY [SIAT] | WWW.SIAT.SFU.CA IAT 334

  2. Exam Materials • Slides • Shneiderman & Plaisant Chapters 1-8 • Programming materials • Supplemantary: Glassner Book • Chapters 1-5, • Chapters 10.2, 13.1-13.6 • On Sakai: Password: GlassnerIAT334 IAT 334

  3. Why We Are Here • Look at human factors that affect software design and development • Central Topic: User interface design IAT 334

  4. HCI • What happens when a human and a computer get together to perform a task • Task • Write a document • Plan a budget • Design a presentation • Play a video game • Not a task.. • Goof off (obviously) IAT 334

  5. Why is this important? • Computers (in one way or another) affect every person in society • Increasing % use computers in work, at home in the road… • Product success depends on ease of use IAT 334

  6. Course Aims • Consciousness raising for you • Eg. Don Norman • “The Design of Everyday Things” • Doors • Handles afford various opening method • Design critic IAT 334

  7. Goals of HCI (Shneiderman & Plaisant Chap1) • Allow users to carry out tasks • Safely • Effectively • Efficiently • Enjoyably IAT 334

  8. Goals of System Engineering Functionality • Tasks and sub-tasks to be carried out Reliability • Maintaining trust in the system Standardization, integration, consistency and portability Schedules and budgets • Adhering to timelines and expense • Human factors principles and testing reduces costs IAT 334

  9. Usability • Five Measurable Goals of UI Design • Combination of • Ease of learning • High speed of user task performance • Low user error rate • Subjective user satisfaction • User retention over time IAT 334

  10. Interests in Human Factors in Design • Life-critical systems: air traffic control, emergency, power utilities etc. • high reliability, error-free performance, lengthy training for systems, subjective satisfaction less of an issue • Industrial and commercial uses: banking, inventory management, airline and hotel reservations, etc. • low costs is critical over reliability, ease of learning, errors calculated against costs, subjective satisfaction of modest importance IAT 334

  11. Interests in Human Factors in Design • Office, home, entertainment: productivity and entertainment applications • ease of learning, low error rates, subjective satisfaction are paramount since use is discretionary and competition is fierce. Range of types of users from novice to expert. • Exploratory, creative, and cooperative: web-based, decision-making, design-support, collaborative work, etc. • users knowledgeable in domain but vary in computer skills, direct-manipulation using familiar routines and gestures work best, difficult systems to design and evaluate. IAT 334

  12. Accommodating Human Diversity Personality Differences Physical Abilities and Workplaces Users with Disabilities Cognitive and Perceptual Abilities Elderly Users Cultural and International Diversity IAT 334

  13. Key Historical Event • Design of the first Mac 1983-1984 • “The computer for the rest of us” IAT 334

  14. Improving Interfaces • Know the User! • Physical abilities • Cognitive abilities • Personality differences • Skill differences • Cultural diversity • Motivation • Special needs IAT 334

  15. Two Crucial Errors • Assume all users are alike • Assume all users are like the designer IAT 334

  16. Another Crucial Error • Have the user design it! • Users bring vital knowledge to design: • They know a lot about the problem • They know a lot about the current tools • They typically know very little about design IAT 334

  17. UI Design/Develop Process • Analyze user’s goals • Create design alternatives • Analyze designs • Implement prototype • Test • Refine Design Implement Evaluate IAT 334

  18. Evaluation • Things we can measure • Time to learn • Speed of performance • Rate of errors by user • Retention over time • Subjective satisfaction IAT 334

  19. Interfaces in the World • VCR • Mouse • Phone • Copier • Car • Airline reservation • Air traffic control IAT 334

  20. History of HCI ______________________________________________________________________________________SCHOOL OF INTERACTIVE ARTS + TECHNOLOGY [SIAT] | WWW.SIAT.SFU.CA IAT 334

  21. Ivan Sutherland • SketchPad - ‘63 PhD thesis at MIT • Hierarchy - pictures & subpictures • Master picture with instances • Constraints • Icons • Copying • Light pen as input device • Recursive operations IAT 334

  22. Douglas Engelbart • Invented the mouse • Landmark system/demo: • hierarchical hypertext, multimedia, mouse, high-res display, windows, shared files, electronic messaging, CSCW, teleconferencing, … • http://www.youtube.com/watch?v=JfIgzSoTMOs IAT 334

  23. The Mouse Doug Engelbart’s mouse - 1963-64 source: resonancepub.com & brittanica.com IAT 334

  24. Alan Kay • Dynabook - Notebook sized computer loaded with multimedia and can store everything • Personal Computing • Desktop Interface IAT 334

  25. PCs with GUIs • Xerox PARC - mid 1970’s • Alto • Local processor, Bitmap display, Mouse • Precursor to modern GUI • LAN - Ethernet IAT 334

  26. Menus Bill Atkinson’s Polaroids of the first pull-down menu prototype - circa 1979 source: folklore.org IAT 334

  27. Xerox Star - ‘81 • First commercial PC designed for “business professionals” • Desktop metaphor, pointing, WYSIWYG • First system based on usability engineering IAT 334

  28. Windows 95 IAT 334

  29. Handhelds • Portable computing + phone • Newton, Palm, Blackberry, iPhone IAT 334

  30. Human Capabilities • Want to improve user performance • Know the user! • Senses • Information processing systems IAT 334

  31. Senses • Sight, hearing, touch important for current HCI • smell, taste ??? IAT 334

  32. Sight • Visual System workings • Color - color blindness: 8% males, 1% females • Much done by context & grouping (words, optical illusions, …) IAT 334

  33. Hearing • Often taken for granted how good it is • Pitch - frequency • Loudness - amplitude • Timbre - type of sound (instrument) • Sensitive to range 20Hz - 22000Hz • Limited spatially, good temporal performance IAT 334

  34. Touch • Three main sensations handled by different types of receptors: • Pressure (normal) • Intense pressure (heat/pain) • Temperature (hot/cold) • Where important? IAT 334

  35. Models of Human Performance • Predictive • Quantitative • Time to perform • Time to learn • Number and type of errors • Time to recover from errors • Approximations IAT 334

  36. Basic HCI • Model Human Processor • A simple model of human cognition • Card, Moran, Newell 1983 • Components: • Senses • Sensory store • Short-term memory • Long-term memory • Cognition IAT 334

  37. Information Processing • Usually serial action • Respond to buzzer by pressing button • Usually parallel recognition • Driving, reading signs, listening to radio IAT 334

  38. Model Human Processor Basics • Parameters • Processors cycle time of 50-200ms • Memories have type, capacity, decay time • Types • Visual • Auditory • Tactile • Taste, smell, proprioception, etc IAT 334

  39. Model Picture Closeup IAT 334

  40. Perceptual Processor • Continually “grabs data” from the sensory system • Cycle time: 100ms [50 - 200] ms • Passes data to Image Store in unrecognized form • “Array of Pixels” (or whatever it is) from eyes • “Sound Intensities” from ears IAT 334

  41. Sensory Store • The “input buffer” of the senses • Stores most recent input unrecognized • Storage time and capacity varies by type • Visual: Nominal Range • Capacity: 17letters of text [7 - 17] letters • Decay Time: 200ms [70 - 1000] ms • Audio: • Capacity: 5 letters of text [4.4-6.6] letters • Decay Time: 1500 ms [900 - 3500] ms IAT 334

  42. Memory • Three “types” • Short-term memory Conscious thought, calculations • Intermediate Storing intermediate results, future plans • Long-term Permanent, remember everything ever happened to us IAT 334

  43. Memory: Sort Term • Short Term (Working) Memory (WM) • Gets basic recognition from Sensory Store • “Stop sign” vs. “red octagon w/white marks” • 7 +/- 2 “chunks” • 4048946328 vs. 404-894-6328 • WM: Nominal Range • Capacity: 7 chunks [5 - 9] chunks • Decay Time: 7 seconds [5 - 226] seconds • Access Time: 70ms [25 - 170] ms IAT 334

  44. Memory: Long Term • Long Term Memory (LTM) • “Unlimited” size • Slower access time (100ms) • Little decay • Episodic & Semantic • Why learn about memory? • Know what’s behind many HCI techniques • Predict what users will understand IAT 334

  45. LT Memory Structure • Episodic memory • Events & experiences in serial form • Semantic memory • Structured record of facts, concepts & skills IAT 334

  46. Read the colors of the words Black Red Orange Yellow Blue IAT 334

  47. MHP Operation • Recognize-Act Cycle • On each cycle, contents in WM initiate actions associatively linked to them in LTM • Actions modify contents of WM • Discrimination Principle • Retrieval is determined by candidates that exist in memory relative to retrieval cues • Interference by strongly activated chunks IAT 334

  48. Perception • Stimuli that occur within one PP cycle fuse into a single concept • movies (frame rate) • Frame rate > 1 / Tp = 1/(100 msec/frame) = 10 f/sec • morse code listening rate • Perceptual causality • two distinct stimuli can fuse if the first event appears to cause the other • events must occur in the same cycle IAT 334

  49. Operation • Variable Cognitive Processor Rate • Cognitive Processor cycle time Tc is shorter with greater effort • Induced by increased task demands/information • Decreases with practice IAT 334

  50. Operation: Target finding • Task: Move hand to target area • Fitts Law • A series of microcorrections • Correction takes Tp + Tc + Tm • Time Tpos to move hand to target width W which is distance D: • Tpos = a + b log2 (d/w + 1.0) • Movement time depends on relative precision IAT 334

More Related