ACTIVITY 1: Introduction to Human Computer

Interaction
Duration: 2 Hours

Learning Outcomes
This Tutorial encompasses activities 1A, 1B, 1C, 1D, 1E, 1F and 1G.

By the end of this tutorial session, you should be able to:

1. Identify and describe the type of interface style.
2. Identify and describe command line interface style.
3. Identify and describe WIMP and 3D interface style.
4. Identify, describe and differentiate between menu interface style and point-and-click
interface style.
5. Identify and describe natural language interface style.
6. Identify, describe and differentiate between question/answer and query dialog
interface style and form-filling style.
7. Identify and describe web navigation interface style.

Activity 1A
Complete the tables below by filling the empty spaces.

Interface Style Description

Command Line Interface The earliest interactive dialog style and
provides a means of expressing instructions
to the computer directly.

Menu-driven Interface Set of options displayed on the screen.

Options visible so demand less recall - rely
on recognition so names should be
meaningful. Selected by using mouse,
numeric or alphabetic keys. Often options
hierarchically grouped: sensible grouping is
needed.

Natural Language The interface that interact with computer

using a human language.
WIMP interface Default interaction style for majority of
interaction computer systems, especially
PCs and desktop machines.

Question/answer and query dialog A simple mechanism for providing input to

an application in a specific domain

Form-fills and spreadsheet

Primarily for data entry or data retrieval

Point to an object on the screen and click it

Point-and-click interfaces to seek information.

3D Interfaces This interface given a 3D appearance using

shading, giving appearance of being
sculpted out of stone.

Web Navigation Web navigation refers to the process of

navigating a network of information
resources in the World Wide Web, which is
organized as hypertext or hypermedia

2
Activity 1B
a) Based on Figure 1, identify the interface style and lists out the forms that it can
represent.

Figure 1
=Command Line Interface.

b) Describe three advantages and disadvantages of command line interface.

Advantages Disadvantages

The command-line interface uses less It is difficult to remember all the commands
memory. used in the CLI.

CLI can be run on any processor whether It is difficult to error handling.

it is a slow processor or high processor.

You don’t need to install windows to run The new user will be confusing and cannot
commands in CLI. All operating systems judge how the CLI can work and what to
support CLI. type in the CLI.

3
Activity 1C
a. List four elements that WIMP interface stands represented.
-Window
-Icons
-Menus
-Pointer

b. Based on the answer in a, describe about the four listed elements and their examples.
-Window= A rectangular area on the screen where commonly used applications run
-Icons= A picture or symbol which is used to represent software application
-Menus= A list of options from which the user can choose what they require
-Pointer= A symbol such as an arrow which moves around the screen as you move your
mouse.

c. Based on the answer in a and b, discuss either some interactive computer systems that
display a virtual 3D space with user only interacts indirectly with this space—e.g., by
manipulating 2D widgets, entering coordinates, or choosing items from a menu. Does
this consider as 3D interfaces?
=Nope

Activity 1D
Answer all the questions based on Figure 2

Figure 2

a) Identify the interface style that being used.

=Menu-driven interface
b) Describe the properties of the style and also at least two forms that it could take.
=Mouse or numeric

4
c) List out three weakness that is related to menu.

• Can be hard to find a specific option if the menu system is complex.

• Menu-driven interfaces are less flexible
• Menus take large space

d) Based on the answer in a, briefly describe the differences in point-and-click interfaces.

Please provide at least two points.
-Single click whether on icons or text

5
Activity 1E
Answer all the questions based on Figure 3.

Figure 3

a) Based on Figure 3 above, natural language could be the most attractive way of
interacting with computer. Describe about the natural language style.

=An interface that allows users to interact with the computer using a human language.

b) Identify two limitations that are related with the style and also give the reason
associated with it.

= Reliability remains an issue - the interfaces can only respond to commands that have
been programmed.

- Highly complex to program and so only warrants this kind of interface where other
types of interface are unsuitable.

6
Activity 1F
a. Differentiate between question/answer and query dialog layout. Give at least three
differences.

Question/ answer Query Dialog

The computer displays a question for the The computer receive command from the
user on the screen. user.

The user send command through

The user enters an answer with the
keyboard
The computer acts on that input information
in a programmed manner.
microphone on radio,mobile phones and
other devices.
The computer controlling the interface will
make sense of command and take action.

b. Based on the answer in a, briefly describe three differences in form-filling interfaces.

-the form interfaces will normally provides limited choices of option to interact with an
application.

-the user will choose answer via keyboard or mouse.

-the computer will acts on the input information in a programmed manner.

Activity 1G
a. List at least four styles of web navigations.
-Text link
-Navigation Bar
-Tab navigation
-Breadcrumbs
b. Based on the answer in a, describe about the four listed elements and their examples.
*Text links
-Text links are words (text) which are surrounded by the anchor set of tags to create clickable
text which takes the visitor to another web page within your website, a downloadable
document from your website, or to another website on the Internet.
*Breadcrumbs
-Breadcrumb navigation shows the website visitor the path within your website to thepage
they are currently on.

7
*Navigation Bar
-A navigation bar is the collection of website navigation links all grouped together. A
navigation bar can be horizontal or vertical.
*Tab Navigation
-Tab navigation is where the website navigations links appear as tabs, similar to thetabs you
use in a binder to divide the contents into sections.