UID_Unit-2-Part-1
UID_Unit-2-Part-1
Part-1:
• It is important to realize that having a clear understanding of what, why, and how you
are going to design something, before writing any code, can save enormous amounts of
time and effort later on in the design process.
• Ill-thought-out ideas, incompatible and unusable designs can be ironed out while it is
relatively easy and painless to do.
• Once ideas are committed to code (which typically takes considerable effort, time, and
money), they become much harder to throw away-and much more painful. Such
preliminary thinking through of ideas about user needs and what kinds of designs might
be appropriate is, however, a skill that needs to be learned.
• It is not something that can be done overnight through following a checklist, but requires
practice in learning to identify, understand, and examine the issues-just like learning to
write an essay or to program. In particular, we focus on what it takes to understand and
conceptualize interaction.
• In the process of creating an interactive product, it can be tempting to begin at the "nuts
and bolts" level of the design. By this, we mean working out how to design the physical
interface and what interaction styles to use (e.g., whether to use menus, forms, speech,
icons, or commands).
• A problem with trying to solve a design problem beginning at this level is that critical
usability goals and user needs may be overlooked. For example, consider the problem
of providing drivers with better navigation and traffic information. How might you
achieve this? One could tackle the problem by thinking straight away about a good
technology or kind of interface to use.
• For example, one might think that augmented reality, where images are superimposed
on objects in the real world, would be appropriate, since it can be useful for integrating
additional information with an ongoing activity (e.g., overlaying X-rays on a patient
Department of Information Technology | APSIT
Department of Information Technology
Academic Year: 2021-22 Semester: VIII
Class / Branch: BE IT Subject: UID
during an operation).
• In the context of driving, it could be effective for displaying information to drivers who
need to find out where they are going and what to do at certain points during their
journey.
• In particular, images of places and directions to follow could be projected inside the car,
on the dashboard or rear-view mirror. However, there is a major problem with this
proposal: it is likely to be very unsafe.
• It could easily distract drivers, luring them to switch their attention from the road to
where the images were being projected.
• A problem in starting to solve a design problem at the physical level, therefore, is that
usability goals can be easily overlooked. While it is certainly necessary at some point to
decide on the design of physical aspects, it is better to make these kinds of design
decisions after understanding the nature of the problem space.
• By this, we mean conceptualizing what you want to create and articulating why you
want to do so. This requires thinking through how your design will support people in
their everyday or work activities. In particular, you need to ask yourself whether the
interactive product you have in mind will achieve what you hope it will. If so, how?
• In the above example, this involves finding out what is problematic with existing forms
of navigating while driving (e.g., trying to read maps while moving the steering wheel)
and how to ensure that drivers can continue to drive safely without being distracted.
• Clarifying your usability and user experience goals is a central part of working out the
problem space. This involves making explicit your implicit assumptions and claims.
Assumptions that are found to be vague can highlight design ideas that need to be better
formulated. The process of going through them can also help to determine relevant user
needs for a given activity.
• In many situations, this involves identifying human activities and interactivities that are
problematic and working out how they might be improved through being supported with
a different. In other situations, it can be more speculative, requiring thinking through
why a novel and innovative use of a new technology will be potentially useful.
• One of the benefits of working through your assumptions for a problem space before
building anything is that it can highlight problematic concerns. In so doing, it can
identify ideas that need to be reworked, before it becomes too late in the design process
to make changes.
• Having a good understanding of the problem space can also help greatly in formulating
what it is you want to design.
• Another key aspect of conceptualizing the problem space is to think about the overall
structure of what will be built and how this will be conveyed to the users. In particular,
Activity 1: A large software company has decided to develop an upgrade of its web browser.
They assume that there is a need for a new one, which has better and more powerful
functionality. They begin by carrying out an extensive study of people's actual use of web
browsers, talking to lots of different kinds of users and observing them using their browsers.
One of their main findings is that many people do not use the bookmarking feature effectively.
A common finding is that it is too restrictive an underused. In fathoming why this is the case, it
was considered that the process of placing web addresses into hierarchical folders was an
inadequate way of supporting the user activity of needing to mark hundreds and sometimes
thousands of websites such that any one of them could be easily returned to or forwarded onto
other people. An implication of the study was that a new way of saving and retrieving web
addresses was needed.
[Assumption: -Taking Something for granted.
Claim: - Stating something true when it still opens for question.]
First assumption made here is: -Something is wrong with the browser and their rival had better
browser. Thus, there a need to improve usability of a number of the browser function.
Claim: - They can win back user by making feature of interface simpler, attractive and flexible.
In working out why users find the existing feature of bookmarking cumbersome to use, a further
assumption was explicated:
The existing way of organizing saved web addresses into folders is inefficient because it takes
too long and is prone to errors. A number of underlying reasons or claim why this was assumed
to be the case were further identified, including:
• It is easy to lose web addresses by placing them accidentally into the wrong folders.
• It is not easy to move web addresses between folders.
• It is not obvious how .to move a number of addresses from the saved favourite
• list into another folder simultaneously.
• It is not obvious how to reorder web addresses once placed in folders.
Based on this analysis, a set of assumptions about the user needs for supporting this activity
more effectively were then made. These included:
• If the bookmarking function was improved users would find it more useful and use it
more to organize their web addresses.
• Users need a flexible way of organizing web addresses they want to keep for further
reference or for sending on to other people.
• Reasoning through your assumptions about why something might be a good idea enables
you to see the strengths and weaknesses of your proposed design.
• In so doing, it enables you to be in a better position to commence the design process.
We have shown you how to begin this, through operationalizing relevant usability goals.
• In addition, the following questions provide a useful framework with which to begin
thinking through the problem space:
- Are there problems with an existing product? If so, what are they? Why do you
think there are problems?
- Why do you think your proposed ideas might be useful? How do you envision
people integrating your proposed design with how they currently do things in
their everyday or working lives?
- How will your proposed design support people in their activities? In what way
does it address an identified problem or extend current ways of doing things?
Will it really help?
Conceptual Model
• To develop a conceptual model involves envisioning the proposed product, based on the
users' needs and other requirements identified.
• To ensure that it is designed to be understandable in the manner intended requires doing
iterative testing of the product as it is developed.
• A key aspect of this design process is initially to decide what the users will be doing
when carrying out their tasks.
• For example, will they be primarily searching for information, creating documents,
communicating with other users, recording events, or some other activity? At this stage,
the interaction mode that would best support this needs to be considered.
• For example, would allowing the users to browse be appropriate, or would allowing
Department of Information Technology | APSIT
Department of Information Technology
Academic Year: 2021-22 Semester: VIII
Class / Branch: BE IT Subject: UID
them to ask questions directly to the system in their native language be more effective?
Decisions about which kind of interaction style to use (e.g., whether to use a menu-
based system, speech input, commands) should be made in relation to the interaction
mode.
• Thus, decisions about which mode of interaction to support differ from those made about
which style of interaction to have; the former being at a higher level of abstraction. The
former is also concerned with determining the nature of the users' activities to support,
while the latter are concerned with the selection of specific kinds of interface.
• Once a set of possible ways of interacting with an interactive system has been identified,
the design of the conceptual model then needs to be thought through in terms of actual
concrete solutions.
• This entails working out the behaviour of the interface, the particular interaction styles
that will be used, and the "look and feel" of the interface. At this stage of "fleshing out,"
it is always a good idea to explore a number of possible designs and to assess the merits
and problems of each one.
• Another way of designing an appropriate conceptual model is to select an interface
metaphor.
• This can provide a basic structure for the conceptual model that is couched in knowledge
users are familiar with. Examples of well-known interface metaphors are the desktop
and search engines
• Interaction paradigms can also be used to guide the formation of an appropriate
conceptual metaphor. They provide particular ways of thinking about interaction design,
such as designing for desktop applications or ubiquitous computing
• As with any aspect of interaction design, the process of fleshing out conceptual models
should be done iteratively, using a number of methods.
• These include sketching out ideas, storyboarding, describing possible scenarios, and
prototyping aspects of the proposed behaviour of the system.
1. Instructing
2. Conversing
3. Manipulating and navigating
4. Exploring and browsing
• A first thing to note is that the various kinds of activity are not mutually exclusive, as
they can be carried out together. For example, it is possible for someone to give
instructions while conversing or navigate an environment while browsing.
• However, each has different properties and suggests different ways of being developed
at the interface. The first one is based on the idea of letting the user issue instructions to
the system when performing tasks.
• This can be done in various interaction styles: typing in commands, selecting options
from menus in a windows environment or on a touch screen, speaking aloud commands,
pressing buttons, or using a combination of function keys.
• The second one is based on the user conversing with the system as though talking to
someone else. Users speak to the system or type in questions to which the system replies
via text or speech output.
• The third type is based on allowing users to manipulate and navigate their way through
an environment of virtual objects. It assumes that the virtual environment shares some
of the properties of the physical world, allowing users to use their knowledge of how
physical objects behave when interacting with virtual objects.
• The fourth kind is based on the system providing information that is structured in such
a way as to allow users to find out or learn things, without having to formulate specific
questions to the system.
Instructing
• This kind of conceptual model describes how users carry out their tasks through
instructing the system what to do.
• Examples include giving instructions to a system to perform operations like tell the time,
print a file, and remind the user of an appointment.
• A diverse range of devices has been designed based on this model, including VCRs, hi-
fi systems, alarm clocks, and computers.
• The way in which the user issues instructions can vary from pressing buttons to typing
in strings of characters. Many activities are readily supported by giving instructions.
• Operating systems like Unix and DOS have been specifically designed as command-
based systems, to which the user issues instructions at the prompt as a command or set
of commands.
• In Windows and other GUI-based systems, control keys or the selection of menu options
via a mouse are used. Well-known applications that are command-based include word
processing, email, and CAD.
• Typically, a wide range of functions is provided from which users choose when they
want to do something to the object they are working on.
• For example, a user writing a report using a word processor will want to format the
document, count the numbers of words typed, and check the spelling.
• The user will need to instruct the system to do these operations by issuing appropriate
commands. Typically, commands are carried out in a sequence, with the system
responding appropriately (or not) as instructed.
• One of the main benefits of an instruction-based conceptual model is that it supports
quick and efficient interaction. It is particularly suited to repetitive kinds of actions
performed on multiple objects. Examples include the repetitive actions of saving,
deleting, and organizing email messages or files.
Activity: 1
Fig:1
There are many different kinds of vending machines in the world. Each offers a range of
goods, requiring the user initially to part with some money. Figure 1 shows photos of two
different vending machines, one that provides soft drinks and the other a range of snacks.
Both support the interaction style of issuing instructions. However, the way they do it is
quite different. What instructions must be issued to obtain a can of soft drink from the first
machine and a bar of chocolate from the second? Why has it been necessary to design a
more complex mode of interaction for the second vending machine? What problems can
arise with this mode of interaction?
• The first vending machine has been designed on a very simple instruction-based
conceptual model. There are a small number of drinks to choose from and each
is represented by a large button displaying the label of each drink. The user
simply has to press one button and (hopefully) this will have the effect of
returning the selected drink.
• The second machine is more complex, offering a wider range of snacks. The
trade-off for providing more choices, however, is that the user can no longer
instruct the machine by using a simple one-press action but is required to use a
more complex process, involving:
(i) reading off the code (e.g., C12) under the item chosen, then
(ii) keying this into the number pad adjacent to the displayed items,
and
(iii) checking the price of the selected option and ensuring that the
amount of money inserted is the same or more (depending on
whether or not the machine provides change). Problems that can
arise from this mode of interaction are the customer misreading
the code and or mistyping in the code, resulting in the machine
not issuing the snack or providing the wrong sort.
• A better way of designing an interface for a large number of choices of variable cost
is to continue to use direct mapping, but use buttons that show miniature versions
of the snacks placed in a large matrix (rather than showing actual versions). This
would use the available space at the front of the vending machine more
economically. The customer would need only to press the button of the object
chosen and put in the correct amount of money.
• Much research has been carried out on how to optimize command-based and other
instruction-giving systems with respect to usability goals. The form of the
commands (e.g., the use of abbreviations, full names, icons, and/or labels), their
syntax (how best to combine different commands), and their organization (e.g., how
to structure options in different menus) are examples of some of the main areas that
have been investigated. In addition, various cognitive issues have been investigated
that we will look at in the next chapter, such as the problems people have in
remembering the names of a set of commands. Less research has been carried out,
however, on the best way to design the ordering and sequencing of button pressing
for physical devices like cell phones, calculators, remote controls and vending
machines.
Conversing
• This conceptual model is based on the idea of a person conversing with a system, where
the system acts as a dialog partner. In particular, the system is designed to respond in a
way another human being might when having a conversation with someone else.
• It differs from the previous category of instructing in being intended to reflect a more
two-way communication process, where the system acts more like a partner than a
machine that simply obeys orders.
• This kind of conceptual model has been found to be most useful for applications in which
the user needs to find out specific kinds of information or wants to discuss issues.
Examples include advisory systems, help facilities, and search engines.
• The kinds of conversation that are supported range from simple voice-recognition menu
driven systems that are interacted with via phones to more complex natural-language
based systems that involve the system parsing and responding to user queries typed in
by the user. Examples of the former include banking, ticket booking, and train time
inquiries, where the user talks to the system in single-word phrases (e.g., yes, no, three)
in response to prompts from the system.
• Examples of the latter include search engines and help systems, where the user types in
a specific query (e.g., how do I change the margin widths?) to which the system responds
by giving various answers.
• A main benefit of a conceptual model based on holding a conversation is that it allows
people, especially novices, to interact with a system in a way they are already familiar
with.
• For example, the search engine "Ask Jeeves for Kids!" allows children to ask a question
in a way they would when asking their teachers or parents rather than making them
reformulate their question in terms of key words and Boolean logic.
• A disadvantage of this approach, however, is the misunderstandings that can arise when
the search engine is unable to answer the child's question in the way the child expects.
For example, a child might type in a seemingly simple question like "How many legs
does a centipede have?" which the search engine finds difficult to answer. Instead, the
search engine replies by suggesting a number of possible websites that may be relevant
but-as can be seen in Figure 2.4-can be off the mark.
• Another problem that can arise from a conversational-based, conceptual model is that
certain kinds of tasks are transformed into cumbersome and one-sided interactions. This
is especially the case for automated phone-based systems that use auditory menus to
advance the conversation.
• Users have to listen to a voice providing several options, then make a selection, and
repeat through further layers of menus before accomplishing their goal (e.g., reaching
• This conceptual model describes the activity of manipulating objects and navigating
through virtual spaces by exploiting users' knowledge of how they do this in the physical
world. For example, virtual objects can be manipulated by moving, selecting, opening,
closing, and zooming in and out of them.
• Extensions to these actions can also be included, such as manipulating objects or
navigating through virtual spaces, in ways not possible in the real world. For example,
some virtual worlds have been designed to allow users to teleport from place to place or
to transform one object into another. A well-known instant of this kind of conceptual
model is direct manipulation. According to Ben Schneiderman (1983), who coined the
term, direct manipulation interfaces possess three fundamental properties:
▪ continuous representation of the objects and actions of interest
▪ rapid reversible incremental actions with immediate feedback about the
object of interest
▪ physical actions and button pressing instead of issuing commands with
complex syntax
o Apple Computer Inc. was one of the first computer companies to design an operating
environment using direct manipulation as its central mode of interaction. The highly
successful Macintosh desktop demonstrates the main principles of direct manipulation.
To capitalize on people's understanding of what happens to physical objects in the real
world, they used a number of visual and auditory cues at the interface that were intended
to emulate them.
o One of their assumptions was that people expect their physical actions to have physical
results, so when a drawing tool is used, a corresponding line should appear and when a
file is placed in the trash can a corresponding sound or visual cue showing it has been
successfully thrown away is used (Apple Computer Inc., 1987).
o A number of specific visual and auditory cues were used to provide such feedback,
including various animations and sounds (e.g. shrinking and expanding icons
accompanied with 'shhhlicc' and 'crouik' sounds to represent opening and closing of
files). Much of this interaction design was geared towards providing clues to the user to
know what to do, to feel comfortable, and to enjoy exploring the interface.
o Many other kinds of direct manipulation interfaces have been developed, including
video games, data visualization tools and CAD systems. Virtual environments and
virtual reality have similarly employed a range of interaction mechanisms that enable
users to interact with and navigate through a simulated 3D physical world. For example,
users can move around and explore aspects of a 3D environment (e.g., the interior of a
building) while also moving objects around in the virtual environment, (e.g.,
rearranging the furniture in a simulated living room).
o While direct manipulation and virtual environments provide a very versatile mode of
interaction, they do have a number of drawbacks. At a conceptual level, some people
may take the underlying conceptual model too literally and expect certain things to
happen at the interface in the way they would in the physical world.
o The conceptual confusion arises because the designers opted to use the same action
(dropping) on the same object (trash can) for two completely different operations,
deleting and ejecting.
o Another problem is that not all tasks can be described by objects and not all actions can
be done directly. Some tasks are better achieved through issuing instructions and having
textual descriptions rather than iconic representations.
o Imagine if email messages were represented as small icons in your mailbox with
Department of Information Technology | APSIT
Department of Information Technology
Academic Year: 2021-22 Semester: VIII
Class / Branch: BE IT Subject: UID
abbreviations of who they were from and when they were sent. Moreover, you could
only move them around by dragging them with a mouse. Very quickly they would take
up your desk space and you would find it impossible to keep track of them all.
• This conceptual model is based on the idea of allowing people to explore and
browse information, exploiting their knowledge of how they do this with existing
media (e.g., books, magazines, TV, radio, libraries, pamphlets, brochures).
• When people go to a tourist office, a bookstore, or a dentist's surgery, often they
scan and flick through parts of the information displayed, hoping to find
something interesting to read. CD-ROMs, web pages, portals and e-commerce
sites are applications based on this kind of conceptual model.
• Much thought needs to go into structuring the information in ways that will
support effective navigation, allowing people to search, browse, and find
different kinds of information.
Interface Metaphors
• Interface metaphors are intended to provide familiar entities that enable people
readily to understand the underlying conceptual model and know what to do at the
interface.
• However, they can also contravene people’s expectations about how things should
be, such as the recycle bin (trash can) that sits on the desktop. Logically and
culturally (meaning, in the real world), it should be placed under the desk. But users
would not have been able to see it because it would have been hidden by the desktop
surface. So, it needed to go on the desktop.
• While some users found this irksome, most did not find it to be a problem. Once
they understood why the recycle bin icon was on the desktop, they simply accepted
it being there.
• An interface metaphor that has become popular in the last few years is the card.
Many of the social media apps, such as Facebook, Twitter, and Pinterest, present
their content on cards.
• Cards have a familiar form, having been around for a long time. Just think of how
many kinds there are: playing cards, business cards, birthday cards, credit cards, and
postcards to name a few.
• They have strong associations, providing an intuitive way of organizing limited
content that is “card sized.” They can easily be flicked through, sorted, and themed.
• They structure content into meaningful chunks, similar to how paragraphs are used
to chunk a set of related sentences into distinct sections (Babich, 2016). In the
context of the smartphone interface, the Google Now card provides short snippets
of useful information.
• This appears on and moves across the screen in the way people would expect a real
card to do—in a lightweight, paper-based sort of way. The elements are also
structured to appear as if they were on a card of a fixed size, rather than, say, in a
scrolling web page
• Just ask yourself or someone else to describe Twitter and Facebook and how people
use them. Then try doing it without using a single metaphor.
• Albrecht Schmidt (2017) suggests a pair of glasses as a good metaphor for thinking
about future technologies, helping us think more about how to amplify human
cognition.
• Just as they are seen as an extension of ourselves that we are not aware of most of
the time (except when they steam up!), he asks can we design new technologies that
enable users to do things without having to think about how to use them? He
contrasts this “amplify” metaphor with the “tool” metaphor of a pair of binoculars
that is used for a specific task—where someone consciously has to hold them up
Department of Information Technology | APSIT
Department of Information Technology
Academic Year: 2021-22 Semester: VIII
Class / Branch: BE IT Subject: UID
against their eyes while adjusting the lens to bring what they are looking at into
focus. Current devices, like mobile phones, are designed more like binoculars, where
people have to interact with them explicitly to perform tasks.