Human computer interaction

Chapter Four
Interactive UI-design
Introduction

 Computers are used to proceed information. Since the information is needed by

people, people and computers have to interact.
 Different computer applications (programs) follow different styles of the
interaction.
 It is obvious, that the interaction style influences the overall usability of a program.
 On the other hand, there are no good or bad interaction styles by default - each of
them could suit a particular user group.
 Moreover, there are specific requirements for each interaction style to make it
expressive and usable.

Interaction style

 Interaction = Exchange of acts between Computer and Human

 Interaction Style = Ways of communication
The concept of Interaction Styles refers to all the ways the user can communicate or
interact with the computer system.
Among interaction Styles
 Command entry
 Form-fill-in
 Menus and navigation
 Direct manipulation.
 Natural language.

By Gizachew B. Page 1
 Human computer interaction

Command language (or command line interaction)

 Command language is the earliest form of interaction style and is still being
used, though mainly on Linux/Unix operating systems.
 These "Command prompts" are used by (usually) expert users who type in
commands and possibly some parameters that will affect the way the command
is executed.
 Command language places a considerable mental burden on the user in that the
interaction style relies on recall as opposed to recognition.
 The learnability of command languages is generally very poor.

Advantages
 Cheap. Easy to develop and suitable for slow machines and communication lines.
 Flexible. Suitable for experienced users
Disadvantages
 Learnability of commands is very poor.
 Low visibility.
 Difficult for novice and casual users [non-expert users]
 Difficult error corrections.
 Text-only data representation.

By Gizachew B. Page 2
 Human computer interaction

The guidelines for good command line interface could be derived from three main
goals:
1. Offer maximum flexibility
 Conduct task analysis to determine the necessary commands
 Provide a way to combine and execute sets of commands.
2. Facilitate command remembering
 Use meaningful, descriptive names.
 Use options for small modifications in command's behavior.
 Command names/abbreviations should be meaningful .
 Provide on-line help
3. Facilitate error correction.
 Provide a way to edit and replay last command.
 Give feedback on both successful and unsuccessful commands

Form fill-in

 The form fill-in interaction style (also called "fill in the blanks") was aimed at a
different set of users than command language, namely non-experts users.
 When form fill-in interfaces first appeared, the whole interface was form-
based.
 Form fill-in interfaces were (and still is) especially useful for routine, clerical
work or for tasks that require a great deal of data entry.
 Even today, a lot of computer programs like video rental software, financial
systems, payroll systems etc. are still purely forms-based.

By Gizachew B. Page 3
 Human computer interaction

Advantages
 Simplifies data entry.
 Shortens learning in that the fields are predefined and need only be 'recognized'.
 Guides the user via the predefined rules.

Disadvantages
 Consumes screen space.
 Usually sets the scene for rigid formalization of the business processes.

Menu selection

 A menu is a set of options displayed on the screen where the selection and
execution of one (or more) of the options results in a state change of the
interface.
 Using a system based on menu-selection, the user selects a command from a
predefined selection of commands arranged in menus and observes the effect.
 If the labels on the menus/commands are understandable (and grouped well)
users can accomplish their tasks with negligible learning or memorization as
finding a command/menu item is recognition as opposed to recall.
 To save screen space menu items are often clustered in pull-down or pop-up
menus.
 Webpage in general can be said to be based on menu selection.

By Gizachew B. Page 4
 Human computer interaction

Advantages
 Ideal for novice users.
 Can appeal to expert users if display and selection mechanisms are rapid and if
appropriate "shortcuts" are implemented.
 Affords exploration (users can "look around" in the menus for the appropriate
command, unlike having to remember the name of a command and its spelling
when using command language.)
 Structures decision making.
 Allows easy support of error handling as the user's input does not have to be
parsed.

Disadvantages
 Too many menus may lead to information overload or complexity of
discouraging proportions.
 May be slow for frequent users.
 May not be suited for small graphic displays.

Direct manipulation

 Graphical metaphors are used to represent the objects on the screen

 Operations on these objects are performed by direct manipulation by mouse like
pointing, dragging and dropping or selecting.
 The system responds immediately to the user actions by changing appearance of
the objects .
for example recycle bin becomes full, when a document is put into it.

By Gizachew B. Page 5
 Human computer interaction

Basic principle
 Objects on the screen represent real-world objects
 Actions on computer resemble real-world actions
 Immediate feedback on actions

Guidelines

1. Regarding the screen design

 Use relatively less arbitrary metaphors to represent objects

 Display only objects which can be manipulated at the given time
 Represent the state of the object too, possibly by color coding.
 Keep consistency by putting common objects at the same place on all screens.

2. Regarding the interaction design

 Make interactions as direct as possible by using selecting, dragging, etc.

 Make operations reversible when possible.
 Issue a "warning" message before any destructive operation.
 Always display clearly marked object for exiting program
 Provide keyboard shortcuts for most often used commands.

3. Regarding the user support

 Provide both context-sensitive and object-sensitive help.

By Gizachew B. Page 6
 Human computer interaction

Advantages
 Visually presents task concepts.
 Easy to learn.
 Errors can be avoided more easily.
 Encourages exploration.
 High subjective satisfaction.
 Recognition memory (as opposed to cued or free recall memory)

Disadvantages
 May be more difficult to programme.
 Not suitable for small graphic displays.
 Compact notations may better suit expert users.

Natural language

 AI based systems.

 Golden rule of design: Understand your materials

o Understand computers: limitations, capacities, tools, platforms.
o Understand peoples: psychological, social aspects, human error.
>>Human ‘error’ is normal
->We know how users behave under stress
->So design for it!
o Their interaction (computer and people):

By Gizachew B. Page 7
 Human computer interaction

Interaction frameworks

 Norman’s model of interaction is perhaps the most influential in Human–

Computer Interaction, possibly because of its closeness to our intuitive
understanding of the interaction between human user and computer.
 The user formulates a plan of action, which is then executed at the computer
interface.
 When the plan, or part of the plan, has been executed, the user observes the
computer interface to evaluate the result of the executed plan, and to determine
further actions.
 The interactive cycle can be divided into two major phases: execution and
evaluation.
 These can then be subdivided into further stages, seven in all.

Donald Norman’s Interaction framework

1. Establishes the goal.

2. Formulate the intention.
3. Specify the action.
4. Execute the action.
5. Perceive the system state.
6. Interpret the system state.
7 Evaluates system state with respect to goal.

By Gizachew B. Page 8
 Human computer interaction

Interaction framework has four parts

User
Input
 System
 Output

Some systems are harder to use than others based on

Gulf of Execution [to describe the gap between a user's goal for action and the means to execute
that goal]
o user’s formulation of actions may be different to those actions allowed by
the system
Gulf of Evaluation [is the degree to which the system/artifact provides representations that can
be directly perceived and interpreted in terms of the expectations and intentions of the user]
o user’s expectation of the changed system state may be different to the
actual presentation of this state

By Gizachew B. Page 9
 Human computer interaction

Types of User Interfaces

To work with a system, the users need to be able to control the system and assess the
state of the system.

Definition of User Interface

 In computer science and human-computer interaction, the user interface (of a

computer program) refers to the graphical, textual and auditory information
the program presents to the user.
 The user employs several control sequences (such as keystrokes with the
computer keyboard, movements of the computer mouse, or selections with the
touch screen) to control the program.

There are two types of user interfaces.

 Command-Line Interface (CLI)
o The user provides the input by typing a command string with the
computer keyboard and the system provides output by displaying text on
the computer monitor.

By Gizachew B. Page 10
 Human computer interaction

 Graphical User Interface (GUI)

o The use of pictures rather than just words to represent the input and
output of a program.
o Input is accepted via devices such as keyboard and mouse.

By Gizachew B. Page 11
 Human computer interaction

Chapter Five
HCI aspects of Multimedia System

Introduction
What is multimedia?
Multimedia= multi + media
Multi means many
Media is medium or means by which information is stored, transmitted,
presented or perceived.
Storage- refers to the type of physical means to store data
Example: HDD, CD, DVD
Presentation- refers to the type of physical means to reproduce information to
the user.
Example: speakers, video windows etc.
Perception- describes the nature of information as perceived by the user
Example: speech, Music, Film

Categorization of Multimedia

Linear Multimedia

A Multimedia Project is identified as Linear when:

o It is not interactive

o Users have no control over the content that is being showed to them.

By Gizachew B. Page 12
 Human computer interaction

Non- linear [Interactive Multimedia]

A Multimedia Project is identified as Non-Linear when:

o It is interactive

o Users have control over the content that is being showed to them.

o Users are given navigational control

Application of Multimedia

Business

 Presentation
 Training
o Simulation
o Animation
 Marketing/advertisements
 E-commerce

Education

 Training
o Simulation
o Animation
 Courseware
 E-learning

By Gizachew B. Page 13
Entertainments Human computer interaction

 Games
 Movie
 3D cartoon animation

Medical

 Telemedicine
 Virtual surgery
 Micro surgery
 E-Health

Public places

 Information kiosk
 Electronic billboard

By Gizachew B. Page 14
 Human computer interaction

HCI and Multimedia

 Nowadays, modern applications have large varieties of multimedia in them.
 Multimedia is a combination of text, graphic, sound, animation, and video that
is delivered interactively to the user by electronic or digitally manipulated
means.
 Specially, on web site HCI and multimedia has great relationship.
 Nowadays, most of Business centers are run their activity electronically and
they have their own website in order to communicate with their customer.
 For example: if the business is car selling the company displays every car
specification on their own website and the customer can choose easily from
anywhere without going to the company.
 And Education also is given electronically.
 Different course has courseware
Courseware- is educational material intended as software for teachers or
trainers or as tutorials for students, usually packaged for use with a computer.

Example of HCI and Multimedia relationship

 Animation
o Copying
o Loading
o Searching
o Downloading
 Sound
o Slide end sound
o Welcome and shutdown sound
o Empty recycle bin sound
 Information kiosk
o ATM machine [there is a monitor that shows us how to use the ATM card]

By Gizachew B. Page 15
 Human computer interaction

Conclusion

HCI and Multimedia has strong relationship, so we have to know our user when
including multimedia in our system. We have to use high quality multimedia to
impress our user. Knowing our user means understanding your user needs. To
understand your user you have to know user’s age, experience, psychology, social and
cultural trends etc.

By Gizachew B. Page 16