62
What is HCI and where does GUI design fit in? Lecture 1 CSE3030

What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Embed Size (px)

Citation preview

Page 1: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

What is HCI and where does GUI design fit in?

Lecture 1 CSE3030

Page 2: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Outcomes of the lecture

• Be able to describe the field of HCI

• Be able to argue whether or not specific subjects should fall within the field

• Understand how the design of graphical interfaces fit within the broader field of HCI

Page 3: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

HCI defined

• Human-computer interaction is a discipline concerned with the design, evaluation and implementation of interactive computing systems for human use and with the study of major phenomena surrounding them

• This is a ‘working definition’• From the ACM SIGCHI (Association of

Computing Machinery, Special Interest Group for Human-Computer Interaction)

Page 4: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

What is and isn’t HCI?

• On the H side?

• On the C side?

Page 5: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Three Mile Island

Page 6: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

The Control Panel

Page 7: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Palm Beach Ballot

Page 8: What is HCI and where does GUI design fit in? Lecture 1 CSE3030
Page 9: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Beyond intuition

• Human-machine system designers cannot just rely on intuition – too many complex factors are operating.

• Instead, need to look to:– High level theories/models/principles– Middle level principles– Specific & practical guidelines

Page 10: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

HCI principles

• General design principles involve being aware of, and catering to, human abilities, skills and differences (human factors). These apply to design of any human-machine system e.g. cars, playgrounds, lifts, phones, computers.

• Designing human-computer interaction is a particular area of human factors design with specific principles and guidelines.

• Designing user interfaces is specific area of HCI and concerns general principles & low level concerns.

Page 11: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

HCI: Three basic principles

• People want ease of use – usually provided by simplicity and transfer of existing experience.

• The user view is different to the system engineers view. Often engineers design systems to perform a set of functions rather than with the user in mind.

• Computers and people are both better at some tasks than others – however they are better at different tasks.

Page 12: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Human factors

• Invention of machines (cars, airplanes, electronic devices ...) taxed people’s sensorimotor abilities to control them.

• Even after high degree of training, frequent errors (often fatal) occurred.

• Result: human factors became critically important.

Page 13: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Human factors

• However, designers still often consider cost and appearance over human factors design.

• People tend to blame themselves when errors occur:– “I was never very good with machines”– “I knew I should have read the manual!”– “Look at what I did! Do I feel stupid!”

• Bad design not always visible, but sometimes it is very obvious!

Page 14: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Human factors

• How many of you can program or use all aspects of your:– digital watch? Fax machines?– VCR?– stereo system (especially car stereos)– unfamiliar water taps?

• “..no need to understand the underlying physics ..(or code) of everything …simply the relationship between the controls and the outcomes” - Donald Norman – “The design of everyday things”

Page 15: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Related Fields

• Computer science – application design and engineering of human

interfaces

• Psychology– the application of theories of cognitive processes and

the empirical analysis of user behavior

• Sociology and anthropology– interactions between technology, work, and

organization

• Industrial design – interactive products

Page 16: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Design process

• Important to consider the What, Why and How of design process for an application before you even begin to think about the interface, coding, etc.

• User needs and usability goals must be addressed at the beginning of the design process. Designers can make incorrect assumptions about the requirements.

Page 17: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

WAP mobile phone example

• People want to be kept informed of up-to-date news wherever they are - reasonable

• People want to interact with information on the move - reasonable

• People are happy using a very small display and using an extremely restricted interface - unreasonable

• People will be happy doing things on a cell phone that they normally do on their PCs (e.g. surf the web, read email, shop, bet, play video games) - reasonable only for a very select bunch of users

• See http://www.useit.com/alertbox/20001210.html

Page 18: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

User needs & usability

• 63% of large software projects go over cost

• Managers gave four usability-related reasons– users requested changes– overlooked tasks– users did not understand their own requirements– insufficient user-developer communication

and understanding

(Greenberg, 2001)

Page 19: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Human factors

Norman – “Design of everyday things”

• Most failures of human-machine system are due to poor designs that don’t recognize peoples’ capabilities and fallibility's

• This leads to apparent machine misuse and “human error”

• Good design always accounts for human capabilities.

Page 20: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Darn these hooves! I hit the wrong switch again!Who designs these instrument panels, raccoons?

Page 21: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Human characteristics

Designer must take into account variations in human senses and motor abilities:

• Vision – e.g. depth, contrast, colour blindness, and motion sensitivity.

• Hearing - e.g. audio cues must be distinct. • Touch: e.g. keyboard and touchscreen

sensitivity.• Motor control/ hand-eye coordination e.g use of

pointing devices.• Physical strength, coordination.

Page 22: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Cognitive and perceptual abilities

There are many aspects to human cognitive abilities. For example:

• short-term memory • long-term memory and learning • problem solving, decision making • attention and set (scope of concern) • perception & recognition

Page 23: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

• from Science magazine– In 1988, the Soviet Union’s Phobos 1 satellite was lost on its

way to Mars, when it went into a tumble from which it never recovered.

“not long after the launch, a ground controller omitted a single letter in a series of digital commands sent to the spacecraft. And by malignant bad luck, that omission caused the code to be mistranslated in such a way as to trigger the [ROM] test sequence [that was intended to be used only during checkout of the spacecraft on the ground]”

Page 24: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Factors affecting cognitive, perceptual & motor performance

• Arousal, vigilance, fatigue

• Cognitive (mental) load

• Boredom, isolation, sensory deprivation

• Anxiety and fear

• Illness, ageing

• Drugs and alcohol

• Circadian rhythms, sleep deprivation

Page 25: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Personality factors

• There is no single taxonomy for identifying user personality types.

• Designers must be aware that populations are subdivided and that these subdivisions have various responses to different stimuli.

Myers-Briggs Type Indicator (MBTI) – extroversion versus introversion – sensing versus intuition – perceptive versus judging – feeling versus thinking

Page 26: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Awareness of cultural and international diversity

• Characters, numerals, special characters, grammar, spelling

• L-to-r vs r-to-l vs vertical input & reading • Date and time formats • Numeric and currency formats • Telephone numbers and addresses • Names and titles (Mr., Ms., Mme.) • Social-security, national id & passport numbers • Etiquette, policies, tone, formality, metaphors

Page 27: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Which are universal and which are culturally-specific?

Page 28: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Users with disabilities

• Need to plan early to accommodate users with disabilities as costs may be very high later

• Some countries have laws which specify requirements to comply with equal opportunity legislation

http://www.useit.com/alertbox/20011111.htmlhttp://www.w3.org/TR/WCAG/

Page 29: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Current Computing Systems

• Human factors and HCI design impact on all of the large variety of current and emerging computer systems.

• However, the impact of various human factors and design decisions depends on the nature of the system.

Page 30: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

System types: Critical systems

Examples: air traffic control, nuclear reactors: • High costs, reliability and effectiveness are

expected. • Lengthy training periods are acceptable to

provide error-free performance. • Subject satisfaction is less an issue due to well

motivated users. Retention via frequent use and practice.

Page 31: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Systems types: Commercial/industrial

Examples: banking, production control, banking, insurance, order entry, inventory management, reservation, billing, and point-of-sales systems:

• Lower cost may sacrifice reliability. • Training is expensive, learning must be easy. • Speed and error rates are relative to cost,

however speed is the supreme concern. Subject satisfaction is fairly important to limit operator burnout.

Page 32: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

System types: Office/home/entertainment

Examples: Word processing, electronic mail, computer conferencing, and video games, education:

• Choosing functionality is difficult because the population has a wide range of both novice and expert users.

• Competition causes the need for low cost.• Subject satisfaction is very important.

Page 33: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

System types: ???

Examples: Artist toolkits, statistical packages, and scientific modelling systems

• Benchmarks are hard to describe due to the wide array of tasks

• With these applications, the computer should "vanish" so that the user can be absorbed in their task domain.

Page 34: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

System engineering versus interface design

System engineering evaluated by:

• Coverage of task functionality.

• Reliability, security, integrity of system and data.

• Standardization, consistency and portability.

• Time and budget considerations.

Page 35: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

User interface evaluation

Depends largely on human factors criteria:

1. Learning time

2. Performance speed

3. Error rates of users

4. Retention over time

5. Subjective satisfaction

Page 36: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

HCI is concerned with…

• Humans and machines jointly performing tasks • The structure of communication between human

and machine • Human capabilities to use and learn to use

machines• Algorithms and programming of the interface• Engineering concerns that arise in designing and

building interfaces• The process of specifying, designing, and

implementing interfaces• Design trade-offs

Page 37: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

5 Areas of HCI

• The nature of human-computer interaction

• Use and context of computers

• Human characteristics

• Computer system and interface architecture

• Development processes

Page 38: What is HCI and where does GUI design fit in? Lecture 1 CSE3030
Page 39: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Nature of Human-Computer Interaction

• Overviews of, and theoretical frameworks for, topics in human-computer communication

Page 40: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

N1 The Nature of Human-Computer Interaction

• Points of view– HCI as communication– agent paradigm, tool paradigm– Human / system / tasks division

• Objectives or goals– productivity, user empowerment

• History and intellectual roots • HCI as an academic topic

– journals, literature– relation to other fields– science vs. engineering vs. design aspects

Page 41: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Use and Context of Computers

• Applications of computers • Applications and appropriate interfaces • The general social, work, and business context• In addition to technical requirements, an

interface may have to – satisfy quality-of-work-life goals of a labor union– meet legal constraints on "look and feel“– position the image of a company in a certain market

• General problems of fitting computers, uses, and context of use together

Page 42: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

U1 Social Organization and Work

• The human as an interacting social being• The nature of work• Human and technical systems mutually adapt to each

other and must be considered as a whole• Models of human activity, groups, organizations • Models of work, workflow, cooperative activity• Organizations as adaptive open systems• Impact of computer systems on work and vice versa• Computer systems for group tasks, case studies • Quality of work life and job satisfaction

Page 43: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

U2 Application Areas

• Characterization of application areas • Document-oriented interfaces • Communications-oriented interfaces• Design environments: programming environments,

CAD/CAM • On-line tutorial and help systems • Multimedia information kiosks • Continuous control systems: (process control systems,

simulators, cockpits, video games)• Embedded systems (Copier controls, elevator controls,

consumer electronics and home appliances)

Page 44: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

U3 Human-Machine Fit and Adaptation

• Design addresses ‘fit’ between the object and its use• Adjustments can be made

– (1) at design time or at time of use – (2) by changing the system or the user– (3) by the users or by the system.

• Adaptive systems• Theories of system adoption • Customizing and tailoring • Compatible users and systems • User adaptation: learning, training • User guidance: help, documentation, error-handling

Page 45: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Human Characteristics

• human information-processing characteristics

• how human action is structured

• the nature of human communication

• human physical and physiological requirements

Page 46: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

H1 Human Information Processing

• The human as a processor of information. • Models of cognitive architecture• Phenomena and theories of

– memory – perception – motor skills – attention and vigilance – problem solving – learning and skill acquisition – motivation

• Users' conceptual models • Models of human action • Human diversity, including disabled populations

Page 47: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

H2 Language, Communication and Interaction

• Language as a communication and interface medium• Aspects of language: syntax, semantics, pragmatics • Formal models of language • Conversational interaction

– turn-taking, repair

• Special languages – graphical interaction, query, command, production systems,

editors

• Interaction reuse– history lists

Page 48: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

H3 Ergonomics

• Human anthropometry and workspace design • Arrangement of displays and controls • Human cognitive and sensory limits • Sensory and perceptual effects of display technologies• Control design • Fatigue and health issues • Furniture and lighting design • Temperature and environmental noise issues • Design for stressful or hazardous environments • Design for the disabled

Page 49: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Computer System and Interface Architecture

• Machines have specialized components for interacting with humans

• Transducers for moving information physically between human and machine

• Have to do with the control structure and representation of parts of the interaction

Page 50: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

C1 Input and Output Devices

• Technical construction of devices • Input devices

– Mechanics and performance– Devices for the disabled– Handwriting and gestures, virtual keyboard– Speech input– Eye tracking, EEG, other biological signals

• Output devices– Mechanics and performance– Devices for the disabled– Sound and speech output– 3D displays, motion (e.g., flight simulators)

• Device weight, portability, bandwidth, sensory mode

Page 51: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

C2 Dialogue Techniques

• Techniques for interacting with humans• Dialogue Interaction Techniques

– Dialogue type and techniques– Navigation, orientation, error management – Agents and AI techniques – Multi-person dialogues

• Dialogue Issues– Real-time response– Manual control theory – Supervisory control, automatic systems, embedded systems – Standards – "Look and feel," intellectual property protection

Page 52: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

C3 Dialogue Genre

• Conceptual uses for the technical means• Concepts arise in any media discipline (film, graphic

design)• Interaction metaphors• Content metaphors • Persona, personality, point of view • Workspace models • Transition management • Techniques from other media (film, theater, graphic

design) • Style and aesthetics

Page 53: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

C4 Computer Graphics

• Concepts from computer graphics that are useful for HCI

• Geometry in 2- and 3-D space, linear transformations

• Graphics primitives and attributes• Solid modeling, splines, surface modeling,

hidden surface removal, animation, rendering algorithms, lighting models

• Colour representation, colour maps, colour ranges of devices

Page 54: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

C5 Dialogue Architecture

• Software architectures and standards • Layers and windows• Screen imaging models (e.g. postscript)• Window manager models, analysis of major

window systems • Models for specifying dialogues • Multi-user interface architectures • Standardization and interoperability

Page 55: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Development Process

• Both design and engineering

• The methodology and practice of interface design

• The relationship of interface development to the engineering of the rest of the system

Page 56: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

D1 Design Approaches

• The process of design• Alternative system development processes • Choice of method under time/resource constraint • Task analysis techniques • Design specification techniques • Design analysis techniques• Graphic design basics• Industrial design basics • Design case studies and analyses of design

Page 57: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

D2 Implementation Techniques and Tools

• Tactics and tools for implementation. • Relationships among design, evaluation, and

implementation • Independence and reusability, application

independence, device independence • Prototyping techniques • Dialogue toolkits • Object-oriented methods • Data representation and algorithms

Page 58: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

D3 Evaluation Techniques

• Philosophy and methods for evaluations • Productivity • Measures

– Time– Errors– Learnability– Design for guessing– Preference

• Testing techniques, link testing to specifications • Formative and summative evaluation• Methods from psychology and sociology• Ethics

Page 59: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

D4 Example Systems and Case Studies

• Classic designs that serve as examples of HCI

• Command-oriented

• Graphics-oriented

• Frame-based

• User-defined

Page 60: What is HCI and where does GUI design fit in? Lecture 1 CSE3030
Page 61: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

Where does GUI fit in?

• U3 human-machine fit and adaptation• H1 human information processing• H2 language, communication and interaction• C1 input and output devices• C2 dialog techniques• C3 dialogue genre• C4 computer graphics• C5 dialogue architecture• D1 design approaches• D3 evaluation techniques

Page 62: What is HCI and where does GUI design fit in? Lecture 1 CSE3030

References

ACM Special Interest Group on Computer-Human Interaction (SIGCHI). ACM SIGCHI is an international, interdisciplinary forum for the exchange of ideas about the field of human-computer interaction. http://www.acm.org/sigchi/

Norman, D. A. (1998). The Design of Everyday Things. New York, New York, USA: Basic Books.

Shneiderman, B., & Plaisant, C. (2005). Designing the User Interface: Strategies for Effective Human-Computer Interaction (Fourth ed.). USA: Pearson Education, Inc.

Stone, D., Jarrett, C., Woodroffe, M., & Minocha, S. (2005). User Interface Design and Evaluation. San Francisco, California, USA: Elsevier.