6PHCI Module 4

Long-Term Interaction Style

Understanding & Conceptualizing Interaction Design
Principles of Human Computer Interaction
2nd Semester (SY 2024-2025)
Assistant Professor Kathrine S. Aguilar, MIS
1
Interaction or Dialog Styles
• distinctive ways in which a client & computer
framework has the capacity to communicate
with each other

• important for the user to communicate or

interact with the computer system

• types: command line, menu, form-filling, GUIS

2
Types of Interaction or Dialog Styles
COMMAND LINE
• Advantages:
üaffordable (no graphical screens)
üsimple to implement, needs less
development time
üless system resources (memory, CPU
time)
• Disadvantages:
ülow visibility (interface) - can't see the
commands before use (must
remember)
üinstruction unacceptable for
inexperienced/casual users 3
Types of Interaction or Dialog Styles
MENUS
• simplest way to visually organize a giant set of actions
• labels on the menus are comprehensible & sorted well
• users accomplish tasks with negligible learning or
memorization
• Advantages:
üUser indicates a selection and receives a feedback
üAllows a giant palette of structured commands which
may be simply "explored"
• Disadvantages:
üToo several menus might cause info overload or
quality of discouraging proportions
üMay be slow for frequent users 4
Types of Interaction or Dialog Styles
FORM-FILLING
• Fill-In-The-Blanks interaction (also called "Form Fill-in")
• applicable once loads of data need to be gathered from the user
• helpful for routine, clerical work or for tasks that need an great deal of data entry
• should guarantee simple movement & correction facilities
• Advantages:
üApplicable once tons of data need to be gathered from the user
üSimplifies data entry
• Disadvantages:
üRequires handling writing errors (bad for users with poor writing skills)
üMay be slow for frequent users
üScreen space consuming
5
Types of Interaction or Dialog Styles
GUIs (Graphical User Interaface)
• could be a system of interactive visual elements
• displays objects that convey data & represent actions that may be taken by the user
(objects modify size or visibility once the user interacts with them)
• associate interface or interactive system, that permits professionals to accomplish tasks
on their computers through pictures & icons
• Advantages:
üEasiness for non-technical folks
üLooks a nicer than text interface
• Disadvantages:
üTesting & implementation take tons of time
üIt takes heaps of time to develop & style a decent interface
6
Good & Bad Examples of Interaction Style
COMMAND LINE
Good Examples:
• Command line interfaces are frequently implemented in
terminal gadgets that are additionally successful of screen-
oriented textual content use interfaces that use cursor
addressing to location symbols on a show screen
• Programs with command-line interfaces are generally
simpler to automate by using scripting
• Many software program structures put into effect
command line interface for management & operation
(programming environments & utility programs)
Bad Examples:
• Requires fewer system assets to implement
• May not supply the graphics enhancements such as special
fonts or extended edit home window located in a GUI 7
Good & Bad Examples of Interaction Style
MENUS
Good Examples:
• Few keystrokes: Typing effort is minimal, less user error
• Single Menus, Command Menus & Hierarchical Menus
Bad Examples:
• Inefficient: complicated menu with many choices on each display screen & many degrees in the hierarchy
• Difficult to find the preferred feature
• Which kind to use, what to include in menus & how to group items

8
Good & Bad Examples of Interaction Style
FORM-FILLING
Good Examples:
• Kick-starter's sign-up - clean, with a
fundamental white background (makes you
focus on the shape fields that matter); doesn't
ask for a lot of info (key for holding the
interest of a busy audience)

• Compare the market - one of the most

effortless ones with icons you can hover over
to choose A or B; buttons are huge & colorful
(develop an engaging & visually attractive
consumer experience)
9
Good & Bad Examples of Interaction Style
GUIS
Good Examples:
• Android General Interface provides a variety of pre-built UI elements such as structured
graph objects & UI controls that permit you to construct the graphical person interface
for your app. Android also provides different UI modules for one-of-a-kind interfaces
such as dialogs, notifications & menus.
• Google drive or The Drive User Interface (UI) is Google-provided software permitting
Drive customers to create, organize, discover & share content material saved on Google
Drive.
Bad Examples:
• Windows 8 released their design they looked to Android & did precisely the opposite all
told respects, rejecting the very Computer-like nature android gracefully invokes &
making a multitude nobody knows the way to use without a tutorial.
• In YouTube scrolling on a site that needs navigation off the list to view an item is hard.
10
 RECAP - HCI
• has moved beyond designing interfaces
for desktop machines
• about extending & supporting all
manner of human activities in all
manner of places
• facilitating user experiences through
designing interactions:
üMake work effective, efficient & safe
üImprove & enhance learning & training
üProvide enjoyable & exciting
entertainment
üEnhance communication & understanding
üSupport new forms of creativity &
expression 11
Understanding the Problem Space
• What do you want to create?

• What are your assumptions?

• Will it achieve what you hope it will?

12
What is an assumption?
• taking something for granted when it needs
further investigation
• Example: people will want to watch TV while
driving

What is a claim?
• stating something to be true when it is still open
to question
• a multimodal style of interaction for controlling
GPS (one that involves speaking while driving) is
safe
13
A framework for analysing the problem space
• Are there problems with an existing product or user experience? If so, what are they?
• Why do you think there are problems?
• How do you think your proposed design ideas might overcome these?
• If you are designing for a new user experience how do you think your proposed design ideas support,
change, or extend current ways of doing things?
• Example: What are the assumptions & claims made about 3D TV?

Assumptions: realistic or wish-list?

• People would not mind wearing the glasses that are needed to
see in 3D in their living rooms – reasonable
• People would not mind paying a lot more for a new 3D-enabled
TV screen – not reasonable
• People would really enjoy the enhanced clarity & color detail
provided by 3D – reasonable
• People will be happy carrying around their own special glasses
– reasonable only for a very select bunch of users
14
From problem space to design space
• Having a good understanding of the problem space can help inform the design space
(what kind of interface, behavior, functionality to provide)
• But before deciding must develop a conceptual model first
• conceptual model
ü “…a high-level description of how a system is organized & operates”
ü Enables “…designers to straighten out their thinking before they start laying out their widgets”
(Johnson & Henderson, 2002, pp26-28)
• components:
ü Metaphors & analogies - understand what a product is for and how to use it for an activity
ü Concepts that people are exposed to using the product - task–domain objects, their attributes &
operations (saving, revisiting, organizing)
ü Relationship & mappings between these concepts
• First steps in formulating a conceptual model
ü What will the users be doing when carrying out their tasks?
ü How will the system support these?
ü What kind of interface metaphor, if any, will be appropriate?
ü What kinds of interaction modes and styles to use?
• always keep in mind when making design decisions how the user will understand the underlying 15
conceptual model
Interface Metaphors
• describes conceptual models
• conceptualizing what you are doing (example: surfing the
web)
• visualizing an operation (example: icon of a shopping cart
for placing items into)
• can be based on activity, object or a combination of both
• exploit user’s familiar knowledge, helping them to
understand ‘the unfamiliar’
• benefits
ümakes learning new systems easier
ühelps users understand the underlying conceptual
model
ücan be very innovative & enable computers & their
applications to be made more accessible to a greater
diversity of users
16
Interaction Types
• INSTRUCTING (issuing commands
& selecting options)
üwhere users instruct a system &
tell it what to do (tell the time,
print a file, save a file)
üvery common conceptual model,
underlying a diversity of devices
and systems (word processors,
VCRs, vending machines)
üsupports quick and efficient
interaction (good for repetitive
kinds of actions performed on
multiple objects)
17
Interaction Types • CONVERSING (interacting with a system
as if having a conversation)
üunderlying model of having a
conversation with another human
ürange from simple voice recognition
menu-driven systems to more complex
‘natural language’ dialogs (timetables,
search engines, advice-giving systems,
help systems, virtual agents, toys & pet
robots)
üallows usersto interact with the system
in a way that is familiar
üMisunderstandings can arise when the
system does not know how to
parse/analyze what the user says

18
Interaction Types
• MANIPULATING (interacting with
objects in a virtual or physical space
by manipulating them)
üinvolves dragging, selecting, opening,
closing & zooming actions on virtual
objects
üexploit’s users’ knowledge of how
they move & manipulate in the
physical world
ücan involve actions using physical
controllers (e.g. Wii) or air gestures
(e.g. Kinect) to control the
movements of an on screen avatar
19
Interaction Types
• EXPLORING (moving through a virtual environment or a physical space)
üPhysical environments with embedded sensor technologies

20
Which conceptual model is best?
• Direct manipulation is good for ‘doing’ types of tasks, e.g. designing,
drawing, flying, driving, sizing windows
• Issuing instructions is good for repetitive tasks, e.g. spell-checking,
file management
• Having a conversation is good for children, computer-phobic,
disabled users and specialised applications (e.g. phone services)
• Hybrid conceptual models are often employed, where different ways
of carrying out the same actions is supported at the interface - but
can take longer to learn

21
Conceptual Models: Interaction & Interface
• Interaction type:
üwhat the user is doing
when interacting with a
system (instructing, talking,
browsing)
• Interface type:
• the kind of interface used to
support the mode (speech,
menu-based, gesture)

22
Paradigms • inspiration for a conceptual
model
• a way of thinking about the
relationship between humans
& computers
• examples:
üUbiquitous computing
üPervasive computing
üWearable computing
üTangible bits, augmented
reality
üAttentive environments
üTransparent computing23
Other HCI concepts
• vision - driving force that frames research & development (concrete
scenarios of how society can use the next generation of imagined
technologies)
• theory - explanation of a phenomenon (information processing that explains
how the mind is assumed to work) that can help identify factors relevant to
the design & evaluation of interactive products
• models - simplification of an HCI phenomenon (abstracted from a theory,
intended to make it easier for designers to predict and evaluate alternative
designs)
• framework - set of interrelated concepts and/or specific questions for
‘what to look for’ that provide advice on how to design

24
• Developing a conceptual model involves good understanding of the
problem space, specifying what it is you are doing, why, & how it will
support users
• A conceptual model is a high-level description of a product in terms of
what users can do with it & concepts they need to understand how to
interact with it
• Interaction types (e.g. conversing, instructing) provide a way of thinking
about how best to support user’s activities
• Paradigms, visions, theories, models, and frameworks provide different
ways of framing and informing design & research
25
26