210 likes | 2.66k Views
Human-Computer Interaction. CS100: The World of Computing John Dougherty Haverford College. Overview of HCI. HCI and user-centered development Human perception and memory Content and visual organization Navigation Color and multimedia issues Accessibility Globalization
E N D
Human-Computer Interaction CS100: The World of Computing John Dougherty Haverford College
Overview of HCI • HCI and user-centered development • Human perception and memory • Content and visual organization • Navigation • Color and multimedia issues • Accessibility • Globalization [lecture based on McCraken & Wolfe, 2002]
Definitions of HCI “A discipline concerned with the design, evaluation, and implementation of interactive computing systems for human use and with the study of major phenomenon surrounding them.” [SIGCHI, 1992] “HCI is the study and the practice of usability.” [Carroll, 2002]
Goals of HCI • Safety - of users, of data • Utility - services are provided • Effectiveness - easy to find and use services • Efficiency - how quickly users can work • Usability - ease of learning and use • Appeal - how well user like the interface • from first impression to long-term satisfaction
Brief History of HCI • Human Factors in Computer Systems [1982] • Grew out of • Software engineering • Software psychology and human factors • Graphics and user interfaces • Cognitive science (e.g., GOMS: goals, operators, methods and selection [1983])
User-Centered Development • Distinct from traditional SW development • User-centric: user over data, user as part of design team • Interdisciplinary: art, psychology, technical writing, computer science, cognitive science • Highly iterative: design, implement, test, learn, redesign, …
Human Capabilities and HCI • Senses and perception • What we see and what we recall (meaning) • Memory • Sensory, long-term, short-term • Chunking • Recognition vs. recall • Interruptions • Mental models and metaphors • Perceived affordance
Implications for HCI Design • Lessen memory burden of user • Use recognition, chunk information • Provide visual cues/memory aids to help resume interrupted tasks • Provide feedback • Input received • Approximate time to process • Incremental metaphor and completion/failure
Content Organization • Exact schemes • alphabetical, chronological, geographical • Ambiguous schemes • Topical, task-oriented, audience-specific • Metaphor-driven, hybrid • Structures • Linear, hierarchy, database, hyperlink
Visual Organization • Proximity - spatially close items are perceived as related • Alignment - outline to express organization • Consistency - across pages in a site, as well as within a page (buttons, font) • Contrast - distinguish different items, and use size, color; make it visually-clear
Navigation Issues • Site-level • Hierarchy vs. hyperlink • Build context where possible • Navigation bars, menus • Page-level • Links with a page • Frames
Issues of Color • Physics and perception • Models of color • RYB: primary colors • RGB: additive color • CMYK: subtractive color • HSB: hue, saturation and brightness • Issues of color harmony • Color to organize content
Multimedia • Audio - music, speech, sound • Formats: .wav, .au, .aiff, mid, .mp3, .ra • Video - impractical for most browsers • Animation - graphics over time • Video format • Vector format • Program/Script (Java, JavaScript) • 3D animation soon ???
Accessibility/Universal Design • Universal design works for more people • Some US statistics (2002): • 8 million blind/visually impaired • 20 million deaf/hearing impaired • 250 thousand with spinal cord injuries • 500 thousand with cerebral palsey • 333 thousand with multiple sclerosis • 34.8 million seniors (≥65) now, near 54 million by 2020, and 50% impaired
Vision Issues • Blindness • Text to speech, HTML table markup • Low vision • Text enlargers, screen magnifiers • Color blindness • Avoid red/green confusion, contrast brightness • Photosensitive epilepsy • Avoid flashing text, animation
Mobility Issues • Assistive technology • Sticky Keys • predictive typing • larger physical interface devices • speech recognition • Alternative pointing devices • Eye-gaze, head wand, mouth stick, temporal select • For web, ensure keyboard-only navigation
Hearing Impairment Issues • Captioned audio (open, closed) • Web options • SMIL (W3C) • QuickTime (Apple) • SAMI (Microsoft) • American Sign Language (ASL) • Video, avatar
Globalization • Internationalization • Identify cultural items • Localization • Add cultural items to provide context • Translation • Personalization vs. privacy
Concluding Remarks on HCI • Important & emerging • Interdisciplinary, add .. • AI, media, networking • Promote effective leveraging of computing for people • Computer should adapt to people