Professional Documents
Culture Documents
3123
HUMAN COMPUTER INTERACTION
Table of Contents
TOPICS
PAGES
ACTIVITY 1:
ACTIVITY 3:
Introduction
to
Human
Interaction
Introduction
to
Human
Interaction
The Design Process
ACTIVITY 4:
14
ACTIVITY 5:
15
ACTIVITY 6:
16
ACTIVITY 7:
Evaluation Techniques
17
ACTIVITY 8:
Evaluation Techniques
18
ACTIVITY 9:
Evaluation Techniques
21
ACTIVITY 10:
Evaluation Techniques
23
ACTIVITY 11:
Universal Design
27
ACTIVITY 12:
Universal Design
29
ACTIVITY 2:
Computer
Computer
8
13
Learning Outcomes
This Tutorial encompasses activities 1A, 1B, 1C, 1D and 1E.
By the end of this tutorial session, you should be able to:
1. List example of command line interface in real life application.
2. Define advantages and disadvantages of WIMP.
3. List features of Question/answer and query dialog.
4. Define applications of 3D interfaces technology.
5. List the best practices for navigation on the mobile web.
Activity 1A:
Discuss and list three example of software that used command line interface in real life
application.
1. Mac OS X
2.Linux
3.Command line interface
Activity 1B:
WIMP interface stands for Window, icon, menu and pointer. In a group discuss the
advantages and disadvantages of WIMP interface.
Activity 1C:
List features of Question/answer and query dialog.
Activity 1D:
Activity 1E:
Todays smartphone owners use their phones to perform specific tasks such as checking
locations of destinations, public transit schedules, and bank balances. While internet
browsing on handheld devices does occur when many people prefer to surf the web from
the comfort of their home or office.
In a group discuss the best practices for navigation on the mobile web.
Because smartphone will save time and costs because they did not have to queue at the
bank or while queuing to buy tickets for public transport
Duration: 2 Hours
Learning Outcomes
This Tutorial encompasses activities 2A and 2B
By the end of this tutorial session, you should be able to:
1. Explain the role of ergonomics in interface design
2. Understand and identify the role of interaction.
Activity 2A
1. Open website as follow http://www.exmouth-view.co.uk/.
4. Discuss the arrangement of the text, menu and image in the website.
10
5. Create re-designs (hand sketches) the better interface of the website. Give a
suggestion on identified problem.
Activity 2B
Identify the activities in model of interaction and understand the framework.
11
Normans model of interaction is perhaps the most influential in HCI. The interactive cycle
can be divided into three phases:
form goal
execute
evaluate
These can then be subdivided into further stages, giving seven in all.
Seven Stages of Action
establishing the goal
forming the intention
specifying the action sequence
executing the action
perceiving the system state
interpreting the system state
evaluation the system state with respect to the goals and intentions
Does the system perform the action and meet the goal?
12
Presentation
O
output
Observation
core
task
I
input
Performance
Articulation
Duration: 2 Hours
Learning Outcomes
This Tutorial encompasses activity 3A
By the end of this tutorial session, you should be able to:
1. Explain the principles to support usability in interactive systems design.
Activity 3A
Complete the table given with correct definition for the principles and give an example for
each principle.
NO.
1
PRINCIPLES
LEARNABILITY :
The ease with which new
users can begin effective
interaction and achieve
maximal performance.
Predictability
DEFINITION
EXAMPLE
Operation visability
can see
items)
-assessing the effect -In a Windows system, to move a
of past actions
file from one directory to another
directory, the user drags the visual
Synthesizability
icon of the file from the original
directory to the destination
directory where it remains visible
-immediate vs. eventual honesty
-how prior
In the design of GUI, the regions
knowledge applies
on the screen which denote buttons
Familiarity
to new system
should be shaded to give a
threedimensional appearance
-guessability; affordance
extending specific
drawing circles ! drawing
ellipses. applications should
interaction
offer the Cut/Copy/Paste
Generalizability
knowledge to new
Consistency
situations
likeness in
behaviour arising
from similar
keyboards
input/output
situations or task
14
objectives
Dialog Initiative
Multithreading
FLEXIBILITY :
Multiplicity of ways in
2
Substitutivity
-freedom from
system imposed
constraints on input
dialogue
Customizability
multimodality
-user can perfectly able to check
his spelling.
this task also is perfectly suited
to automation.
It is not desirable to leave this
task completely to computer...
-spell checking is best Performed
user (adaptability)
opportunity
-users ability to adjust the form of
input and output
- automatic customization of the
user interface by the system
or system
3
Observability
(adaptivity)
-ability of user to
evaluate the
ROBUSTNESS :
The level of support
Recoverability
take corrective
has been
determining successful
recognized
-how the user
perceives the rate
of communication
with the system
-degree to which
system services
support all of the
user's tasks
assessment of goals
Responsivenes
s
Task
Conformance
reachability; forward/backward
visibility
Stability
16
Activity 4A
Semester break is just around the corner. You and six other friends are planning to have a
vacation to the interesting travel destination. Referring to the situation, produce a graphic
solution using design space analysis (QOC notation) to indicate transportation method to
your selected destination.
i)
BAS
Expensives
Widely Spaces
TRANSPORTATION
CAR
Cheap
Limited Spaces
Duration: 2 Hours
Learning Outcomes
This Tutorial encompasses activity 5A
By the end of this tutorial session, you should be able to:
1. Identify the design rules to improve interface design based on the given scenario.
17
Activity 5A
Select a suitable example for each of the following environments.
i)
ii)
a. Snap shot the interface design selected and find where the interfaces does meets the
Schneidermans Eight Golden Rules that you had learned.
18
Activity 6A
In a group, you are required to select a suitable example for each of the following
environments.
i)
ii)
iii)
a. Snap shot the interface design selected and find where the interfaces does meets the
Schneidermans Eight Golden Rules that you had learned.
Activity 7A
19
www.psmza.edu.my
ii.
www.psis.edu.my
Step 2: Explore each website chosen using its navigation provided within 15 minutes.
Step 3: Make some comparison between the systems. Explain the PRINCIPLES OF
LEARNABILITY
Step 4: Describe how interfaces influence the user on element below:
i.
ii.
For every operator action, there should be some system feedback. For
frequent and minor actions, the response can be modest, while for
infrequent and major actions, the response should be more substantial.
iii.
Activity 8A
20
3.
1.
2.
Likert questions
Dichotomous questions
Step 1: Open www.nst.com.my as a reference for your research. All the questions should
be referring to the website.
Step 2: Use Microsoft Word to create the questionnaire.
Step 3: The title of research is THE USABILITY AND FUCTIONALITY OF A WEBSITE.
Insert the question wording for category below:
a) Demographic information ( 5 questions )
b) Usability of the system ( 10 questions )
21
22
Activity 9A
Variables:
characteristic changed to produce different conditions
Example:
interface style, number of menu items
Hypotheses:
prediction of outcome of an experiment
- framed in terms of independent variables (IV) and dependent variables (DV)
Example:
error rate will increase as font size decreases
2.
You are required to design an experiment to test whether the learning style of
Soft skill will improve students assessment in university
23
Participants
ii) Hypothesis
24
Activity 10A
Step 1: You are required to develop a simple web design prototype by using Microsoft
PowerPoint. The title of web page is Dynamic Tuition Centre.
Step 2: Your prototype must include the items below:
-
Texts
Graphics
Company Logo
Menu Buttons
25
ii.
26
iii.
iv.
27
Step 3: The lecturer will evaluate the prototype after finish (Evaluation Method : Think
Aloud)
28
o Gesture recognition
2. Design an appropriate interface design by using the alternative mode
3. Describes the accessibility guidelines and standards
4. Demonstrate the accessibility features in user interfaces : biometric access control,
narrator
Activity 11A
1. In a group, design an interface of the email application. The interface would only
cater for the main page of the email and compose page. The application needs to
include the entire following alternative mode:
a. Sound in the interface
b. Touch in the interface
c. Handwriting recognition
d. Gesture recognition
a.
Activity 11B
29
Step 2: Go to http://www.w3.org/standards/webdesign/accessibility
Step 3: Understand the article to help for design website accessibility.
Step 4: Search another website and list the rules for website accessibility.
Activity 11C
1. In a group, demonstrate the accessibility features in user interfaces:
a.
b.
Narrator
a. Introduction
b. Example of software
c. Show how it work
Duration: 2 Hours
Learning Outcomes
This Tutorial encompasses activity 12A and 12B.
By the end of this tutorial session, you should be able to:
1. Describe the differences between mobile computing and wearable computing.
2. Understand the important of both computing to Human to complete their task.
3. Understand the important of emerging technologies towards user in the society.
Activity 12A
In a group discuss the following issues:
a. How wearable computing differs from mobile computing?
b. What is the difference between wearable computing and mobile computing?
c. Why do we need sensors for wearable computing?
Activity 12B
1. In a group discuss the following issue:
a. The impacts of emerging technologies towards user interface in the society.
31