Introduction

Human Computer
Interaction

1
Human-Computer Interaction (HCI)
Definition
• Human-Computer Interaction is the study, planning,
and design of how people and computers work
together so that a person’s needs are satisfied in the
most effective way.
• It is a field related to the design, evaluation and
installation of interactive computer systems for
human use and the research of the main problem
occurring on them (ACMSIGCHI 1992).

2
HCI Goals
• A basic goal of HCI is
– To improve the interactions between users and
computers
– By making computers more usable and receptive to
the user's needs.
• A long term goal of HCI is
– To design systems that minimize the barrier between
the human's cognitive model of what they want
– To accomplish and the computer's understanding of
the user's task

3
HCI Factors
HCI designers must consider a variety of factors:
• Human:
– What people want and expect,
– What physical limitations and abilities people possess,
– How their perceptual and information processing systems
work,
– What people find enjoyable and attractive.
• Computer:
– Technical characteristics and limitations of the computer
hardware and software must also be considered

4
Related fields
• HCI uses the
knowledge of many
different fields
– Computer science
– Artificial intelligence
– Study of language
– Philosophy (triết học)
– Art
– Ergonomics (công thái
học): Improve machine
design for easy use by
people
6
Related fields
Very closely and
extensively related to
the fields:
• Interaction Design
(ID)
• User Experience
Design (UxD)

7
Why we have to research HCI
• UI is the place to communicate between users and
computers. Cannot access the computer without the UI.
• In Programming:
– A large part of the code relates to the interface
– If the wrong interface design => must do it again
– If it cannot be fixed => the user must use a bad interface
– Good interface design => reduced programming time
• User satisfied
– Create products of higher quality. Users save time when
using the interface, so they can focus on the main task.
– For example: search data, text format ....

9
Why we have to research HCI
• Increase the ability to sell products
– DOS is not comparable with other operating systems
at the same time
– Windows and Explorer give Microsoft huge profits
– Windows is reproduced from the Macintosh
interface!!!
– Macintosh interface copied from Bravo - developed at
Xerox PARC !!!
• Nice interface, easy to get contracts
• Bad interfaces may be removed at the beginning, no
matter how good the program

10
Research contents of HCI

11
Ergonomic in HCI
• Ergonomics (or human factors)
is the scientific discipline
concerned with the
understanding of interactions
among humans and other
elements of a system, and the
profession that applies theory,
principles, data and methods
to design to optimize human
well-being and overall system
performance. (International
Ergonomics Association)
Factors of interest
When designing a HCI, interest the factors
• Organizational elements: Training, job design, policies, roles
and job organization
• Environmental factors (noise, lighting, ...)
• Health and safety factors: stress, headache, muscle fatigue
• Users: Motivation, satisfaction, enjoyment, experience level
• Convenient factors: Sitting posture, equipment arrangement
• User interface: I / O devices, using colors, symbols,
commands, graphics, natural language, multimedia
• Mission elements: Ease, complexity, new, job allocation,
skills
13
Who participates in developing HCI
• Graphic designer
• Interactive designer / interface
• Person making technical documents
• Marketing staff
• Test engineer
• Software engineer

14
Human Computer Interaction

15
User Interface design
• User interface design is a subset of a field of study
called human-computer interaction (HCI).
• The user interface is the part of a computer and its
software that people can see, hear, touch, talk to, or
understand or direct.
• The user interface has essentially two components:
input and output.
– Input is how a person communicates his or her needs
or desires to the computer.
• Common input components: the keyboard, mouse, and one’s
voice (for spoken instructions).
– Output is how the computer conveys the results of its
computations and requirements to the user.
• Display screen
16
The importance of Good Design
• Proper interface design will provide a mix of well-
designed input and output mechanisms that satisfy
the user’s needs, capabilities, and limitations in the
most effective way possible.
• A screen’s layout and appearance affect a person in
a variety of ways.
– If they are confusing and inefficient, people will have
greater difficulty in doing their jobs and will make
more mistakes.
– Poor design may even chase some people away
from a system permanently. It can also lead to
aggravation, frustration, and increased stress.

17
User Experience (UX)
• User experience includes all the users' emotions,
beliefs, preferences, perceptions, physical and
psychological responses, behaviors and
accomplishments that occur before, during, and
after use of a system, product or service
• User experience (UX) design is the process design
teams use to create products that provide
meaningful and relevant experiences to users.
• UX design involves the design of the entire process
of acquiring and integrating the product, including
aspects of branding, design, usability and function.
18
Difference between UX and UI?
• UX (user experience) and UI (user interface) are two
interdependent terms.
• UI generally deals with the interaction between
users and computer systems, software and
applications.
• UX deals more generally with a user’s overall
experience with a brand, product or service.

19
Difference between UX and UI?
• UX relates to how a • UI specifically refers to
user feels whenever the touchpoints a
they interact with a person uses to engage
product or service. with a digital product.
• it’s the ease and user- • It relates specifically to
friendliness of the the screens, buttons
interaction as a whole. and other visual and
interactive features a
person uses to interact
with a digital product, a
website or app
20
UX Design vs. UI Design
• UX design is the careful • UI design is the process
planning and creation of of designing how digital
the user experience and interfaces look and
everything it entails. behave.
• It focuses on creating a • It covers all the visual and
product or service that interactive properties of
solves a particular user websites, software and
problem, making sure the apps – from colours and
proposed solution is easy typography to buttons,
and enjoyable to use. scroll functions,
animations and more.

21
Difference between UX and UI

22
UX, UI Design Example

24
Interaction Design
• Interaction design (IxD) involves examining and
defining the interactions (via an interface – UI)
between a system and its user (UX).
– As a practice, it strives to create more meaningful
relationships between people and the products and
services that they use.
• Describes the practice as: “The goal of creating
products that enable the user to achieve their
objective(s) in the best way possible”

25
Interaction Design

26
Reference

27