**What is interactive design**
**Good vs bad design – primarily related to the products usability**
Bad – infuriating to use, confusing, too many steps, difficult to use, not obvious what to do.
Good – aesthetically pleasing, only one step to do thing, simple design, easy to read
**Interactive design definition** – designing interactive products to support the way
people communicate and interact in their every day and working lives. OR create user
experiences that enhance and augment the way people work, communicate and interact.
**User experience** – central to ID. Means how a product behaves and is used by people
in the real world. How a person feels about a product and their pleasure and satisfaction
when using it, holding it, opening and closing it.
**Process of Interactive Design– 4 activities**
1. Establish requirements
2. designing alternatives
3. prototyping
4. evaluating
**Usability goals – concerned with meeting specific usability criteria**
1. effective to use – **effectiveness** – how good the product is at doing what it needs to
do
2. efficient to use – **efficiency** – refers to how a system supports users to carry out
their tasks
3. safe to use – **safety** – system prevents users from hurting themselves or accidental
deletion of profiles
4. having good utility – **utility** – allows users to do exactly what they want eg. Drawing
program that allows all sorts of shapes
5. easy to learn – **learnability** – how easy is the system to learn to use
6. easy to remember how to use – **memorability** – how easy it is to remember to use
**User experience goals – concerned with explicating the nature of the user
experience**
**desirable – satisfying, enjoying, engaging, pleasurable, helpful, challenging**
**undesirable – boring, frustrating, annoying, childish, unpleasant**
**Design principles**
1. **visibility** – functions visible so the user knows what to do next
2. **feedback** – products designed so that they give feedback to the user who then
knows what to do next.
3. **constraints** – restrict users to specific tasks at a certain time. Grey out the
functions that are currently not available
4. **consistency** – design interfaces that have similar operations and use similar
elements for achieving similar tasks.
5. **affordance** – refers to an attribute of an object that allows people to know how to
use it. E.g a button on a mouse, people know to push it.
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
**Understanding and conceptualizing interaction**
Define the problem space - understand and conceptualise what is currently the user
experience/product and how it is going to be improved or changed. Having a good
understanding of the problem space helps design teams to then be able to conceptualize
the design space. Once a conceptual model has been agreed upon and formulated it can
then become a shared blueprint.
**Conceptual models – core components**
1. **metaphors and analogies** – that convey to people how to understand what a
product is for and how to use it for the activity
2. concepts that people are exposed to through the product, including the task-domain
objects they create and manipulate, their attributes and the operations that can be
performed on them.
3. relationships between those concepts
4. mappings between the concepts and the user experience the product is designed to
support or invoke. Eg revisit websites through a list of visited websites.
**Formulating a conceptual model**
1. what will the user be doing when carrying out their tasks
2. how will the system support these
3. what kind of interface metaphor, if any, will be appropriate
4. what kinds of interaction modes and styles to use?
Eg of a conceptual model – shopping on an online shop. Place items in a shopping cart,
proceed to checkout.
**Interface Metaphors**
Use metaphors to explain to others what they are doing or trying to do **e.g.** using a
search engine, poking someone, leaving a message on their wall. They are used in 3 ways –
1. As a way of conceptualise what we are doing **e.g.** surfing the web
2. As a conceptual model instantiated at the interface **e.g.** desktop metaphor
3. As a way of visualizing an operation **e.g.** an icon of a shopping cart
**Interaction types**
1. **Instructing** – where users issue instructions to a system, could be giving
instructions to a system to remind the user of an appointment or to print a file.
2. **Conversing** – where users have a dialog with a system, system is designed to
respond like another human being.
3. **Manipulating** – where users interact with objects in a virtual or physical space by
manipulating them, able to zoom in or zoom out, stretching and shrinking, actions which
are not possible in the real world. Also a user can see the visible action like dragging a file
across a screen. Benefits of direct manipulating are helping beginners learn functionality
rapidly, enable experienced users to work rapidly on a wide range of tasks, reduce users
experiences of anxiety, and helping users gain confidence and mastery and feel in control.
4. **Exploring** – where users move through a virtual environment or a physical space.
**E.g.** move through a 3D representation of a building
5. **Responding** - where users gets a feedback from the system
Paradigms, Theories, Models and Frameworks – other sources of inspiration and
knowledge that are used to inform design and guide research
**Paradigms** – refers to a general approach that has been adopted by a community of
researchers and designers for carrying out their work. To follow a particular paradigm
means adopting a set of practises that a community has agreed upon.
**Theories** – is a well substantiated explanation of some aspect of a phenomenon
**Model** – is a simplification of some aspect of Human computer interaction intended to
make it easier
**Framework** – is a set of interrelated concepts and/or a set of specific questions that is
intended to inform a particular domain area.
\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*
**Social Interaction**
**Face to face conversation vs remote conversation**
e.g. using a telephone. Asynchronous and synchronous technologies that have been
developed and experimented with to support and interaction at a distance are collectively
referred to as computer mediated communication CMC.
**Telepresence** – these have been designed to allow a person to feel as if they were
present or to give the appearance that they were present in the other location by projecting
their body movements, actions, voice and facial expressions to the other location or
person.
**Co-presence** – numerous shareable interfaces have been developed to enable more
than one person to use them at the same time.
**Mechanisms used in face to face interaction** –
1. Coordination – like moving a piano – they continually updating each other as they
progress
2. Awareness – knowing who is around, what is happening and who is talking to whom.
3. Shareable interfaces – people prefer to share a table-top as opposed to sitting in front
of a vertical display.
Emergent social phenomena – it is the inherent social nature of human beings, people will
always need to collaborate and communicate with one another and the diverse range of
applications, web-based services, and technologies that have emerged are enabling them
to do so in more extensive and diverse ways.
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
**Emotional Interaction**
Emotional interaction is concerned with how we feel and react when interacting with
technologies. It studies the emotional side from the finding out about a new product to the
point where we get rid of it.
Expressive forms like emoticons, sounds, icons, and virtual agents have been used at the
interface to a) convey emotional states b) elicit certain kinds of emotional responses in
users
Frustrating interfaces – elicit negative emotional responses such as anger or disgust. Often
resulted due to bad design, no design, inadvertent design, or ill-thought-out design.
1. Gimmicks – frustration can happen when clicking on a link and you get a message that
the page is still under construction.
2. Error messages – often not easily understood.
3. Waiting – websites that take forever to download are frustrating.
4. Upgrading – upgrading of software.
5. Appearance – overloaded with graphics, flashing animations, childish design
Persuasive Technologies and Behavioural change:
Persuasive technology – technology to draw peoples attention to certain kinds of
information in an attempt to change what they do or think.
Anthropomorphism – is the propensity people have to attribute human qualities to animals
and objects.
Zoomorphism – is the shaping of an object or design in animal form.
Models of emotion –
Emotional design model – has 3 levels
1. Visceral – responds rapidly, making judgements about what is good or bad,
pleasurable or not
2. Behavioural - most human activities occur here – such as talking, driving and typing
3. Reflective - conscious thought where people generalize across events or step back
from the routine.
Pleasure model – 4 types of pleasure
1. Physio-pleasure – bodily pleasures such as touch
2. Socio-pleasure – enjoyment of being in the company of others
3. Psycho-pleasure – peoples emotional and cognitive reactions to a product
4. Ideo-pleasure – refers to peoples values
Technology as experience framework – 4 core threads
1. Sensual thread – sensory engagement
2. Emotional thread – sorrow, anger, joy
3. Compositional thread – concerned with the narrative part of an experience as it
unfolds and the way a person makes sense of them.
4. Spatio-temporal thread – refers to space and time in which our experiences take place
and their effect upon those experiences.
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
Data gathering
5 key issues –
1. Setting goals
2. Identifying participants
3. Relationship with participants – very important that it is clear and professional
4. Triangulation – term used to define an investigation from two different perspectives
5. Pilot studies – small trial run of the main study
Data recording
1. Notes plus a still camera
2. Audio plus a still camera
3. Video
Interviews
1. Unstructured – open ended and no set questions – exploratory. Interviewee may
suggest things not considered by the interviewer. All interviews wont be the same though
2. Structured - predetermined questions. Questions may have predetermined answer
lists
3. Semi-structured – combination of unstructured and structured
4. Focus groups – interview groups of people – allows sensitive or diverse issues to be
raised
5. Also telephone and online interviews
Plan an interview
1. Develop interview questions – use open questions when doing exploratory but closed
questions when the answers are known.
2. Unstructured interview will consist of open questions.
3. Don’t use compound questions but rather separate into two questions.
Running an interview
1. Make use interviewee understands the purpose of the interview and is comfortable.
2. Introduce oneself
3. Ask easy questions to start
4. Questions asked in a logical order
5. Cool off questions if tension has arisen
6. Closing session
Questionnaires
Use questionnaire if you think the motivation to complete is high without assistance else
use an interview.
Structure of questionnaire
• Use some contextual questions to start that are relevant eg. How long you been in the
company
• Think about the order of the questions as prior questions can influence the answers
• Question and response format
• May be appropriate to select only one or multiple answers
Sometimes better to ask to locate answer in a range
Check boxes and ranges – choosing sex provides two answers and a choice of one. For age
one wouldoften use a range
Rating scales – likert scales – used for measuring opinions, attitudes and beliefs eg 1 – 5 or
agree to disagree
(place positive option first)
- Semantic differential scale – explore a range of bipolar attitudes eg list two itemswith
a
scale between them where one places an x which is closer on in the middle.
Administer questionnaire
Reach a suitable group and get a reasonable response rate,
get higher response rate for a selected group of participants and low for widespread
groups.
Online questionnaires
Reach large number of geographically dispersed people quickly. Can be email or web
based.
Web based can be interactive and include buttons etc.
Get faster response rate and the results can be automatically uploaded into a
database.
Develop web based questionnaire
1. Develop on paper
2. Develop strategy to get to target population
3. Produce an error free version from the paper one
4. Make sure it is accessible from multiple browsers
5. Make sure you can identify the sender to avoid duplication if he submits twice
6. Pilot test it thoroughly
Observation
1. Direct observation in the field – often difficult for people to explain what they do so
easier toobserve it.
Structured framework for observation in the field – Who? Where? What?
An observer can be either passive – in that he just purely observes or he can a
participant observer –
in that he attempts to become a full member of the group he is studying.
You need to focus on everyone in the group you are observing.
Some you will get on better with than others.
Also observing is tiring but essential that you write up notes at the end of each day to
ensure no data is lost.
Ethnography – its main feature compared to other approaches of data gathering is that
it aims to observe a situation
without imposing any a priori structureor framework upon it, and to view everything as
strange.
Activity or job descriptions, rules and procedures, recordings o talk talking place,
photographs, videos, workflow diagrams,
process maps are all materials that can be used in an ethnographic study.
2. Direct observation in controlled environments – observation in a purpose built
environment.
Cameras can be used to record different things eg facial expressions, mouse and
keyboard movements,
and body language. Can use the think aloud technique, where the interviewee verbalises
everything he is doing and thinking
Indirect observation – tracking users activities.
Two techniques are used – diaries and interaction logs.
• Diaries – users asked to write what they did, when they did it, how they found it easy or
hard, and what their reactions were.
• Interaction logs and web analytics – system records exactly what the user is doing.
Interaction logs are unobtrusive.
Web analytics involves collecting, analysing and report data that tracks a users behaviour
when interacting with a website.
Choosing and combining techniques
Focus of the study – techniques used must be compatible with the goal of the study.
Participants involved – characteristics of the target group for the product will affect the
kind of data gathering technique used. May not be feasible to use a focus group if users are
widespread. Some users may not be able to give adequate time to the study. Depends what
is being discussed could sway from questionnaire to rather an interview.
Nature of technique – Does the chosen technique require special equipment – does the
person using it have the knowledge on how to use it.
Available resources – sending out a questionnaire may be practical – but does someone
on the team have the knowledge on how to do it? Can it be completed effectively in the
required timeline.
\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*
The process of Interactive Design
4 approaches to design –
1. User centred – focus on user, users needs and goals
2. Activity centred – focus on behaviour surrounding particular tasks
3. Systems design – structured design process focus on context and ideal for complex
designs
4. Genius design – relies solely on the experience and creative flair of a designer
Importance of involving users - Involve users otherwise they may feel cheated by promises
that have not been fulfilled and this will then cause resistance and even rejection. Better to
exceed expectations. Another reason for involving users is ownership. Users who are
involved and feel that they have contributed to a products development are more likely to
feel a sense of ownership towards it and support its use.
Degrees of user involvement – can be full time or part time and be for the duration of the
project or for a limited time only. Otherwise users can just be kept abreast of developments
and not directly involved.
User-cented approach – 3 principles by Gould and Lewis
1. Early focus on users and tasks – observe users doing their normal tasks, studying the
nature of those tasks and the involving users in the design process
2. Empirical measurement – observe and measure the reaction by users at all stage of
development
3. Iterative design – as problems are found and fixed, observations done again to see the
effect of fixes. Design and development cycle is iterative, with design-test-measureredesign being repeated as often as necessary
Early focus on users and tasks – broken into 5 principles
1. Users tasks and goals are the driving force behind the development
2. Users behaviour and context of use are studied and the system is designed to support
them.
3. Users characteristics are captured and designed for
4. Users are consulted throughout development from earliest phases to the latest and
their input is seriously taken into account
5. All design decisions are taken within the context of the users, their work, and their
environment
4 activities of interactive design
1. Establish requirements – gleaned through data gathering and analysis
2. Designing alternatives – broken into 2 sub activities – conceptual design – produce a
conceptual model for the product – physical design – considers the detail of the product
including colours, sounds, images to use, menu design and icon detail
3. Prototyping – users interact with prototypes to evaluate the designs
4. Evaluating - -process of determining the usability and acceptability of the product or
design that is measured in terms of a variety of criteria, such as amount of errors, how
appealing it is, matches requirements etc
Lifecycle model – term used to represent a model that captures a set of activities and how
they are related.
Practical issues
Who are the users – the people who interact directly with the product to achieve a task.
Primary – hands on users, secondary – occasionally use the system, and tertiary may be
the people who will influence its purchase. Stakeholders – people who will be affected by
the system and who have a direct or indirect influence on the system requirements.
What do we mean by needs –
How do you generate alternative designs –
How do you choose amongst alternatives –
How do you integrate interactive design activities with other lifecycle models –
Contextual inquiry – it is tailored to gather data that can be used in design and it follows an
apprenticeship model – the designer works as an apprentice to the user. Has four
principles –
Context principle – emphasizes the importance of going to the workplace and seeing what
happens
Partnership principle – states that the developer and the user should collaborate in
understanding the work
Interpretation principle – observations must be interpreted in order to be used in design
Focus principle – keep the data gathering focused on the goals.
Data gathering guidelines
1. Focus on identifying the stakeholders needs
2. Involve all the stakeholder groups
3. Involving only one representative from each stakeholder group is not enough. Each one
may have their own perspective.
4. Support the data gathering sessions with suitable props eg task descriptions and
prototypes if available.
Brainstorming – rules for using
Involve participants from a wide range of disciplines
Don’t ban silly stuff – unconventional ideas often turn into useful requirements
Use catalysts for further inspiration
Keep records
Sharpen the focus – start off with a particular focus so you can pull it back to this idea if the
discussion wanders off topic
Use warm up exercises – particularly if they haven’t worked together before.
Task description - 3 types
Scenarios – an informal narrative description. Describes human activities or tasks in a story
that allows exploration and discussion of contexts, needs and requirements.
Use cases – also focus on user goals – but the emphasis here is on user-system interaction
rather than the users task itself. Use case is associated with an actor and it is the actors
goal in using the system that the use case wants to capture.
Essential use cases – combat the limitations of scenarios and use cases – they represent
abstractions from scenarios. They represent a more general case than a scenario
embodies, and try to avoid the assumptions of traditional use case.
Task Analysis – used mainly to investigate an existing situation, not to envision new
products. Information gleaned from task analysis establishes a foundation of existing
practises on which to build new requirements or design new tasks.
Most widely used form of task analysis is Hierarchical Task Analysis (HTA) – Involves
breaking down a task into subtasks, and then into sub-sub tasks and so on. These are then
grouped together as plans that specify how the task might be performed in an actual
situation. Graphical version of this shows each step as a block. Hierarchical relationship
between tasks is shown using a vertical line. If a task is not decomposed any further then a
thick horizontal line is drawn underneath the corresponding task. Eg hiring a dvd from a dvd
shop.
\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*
Evaluation Studies
DECIDE – a framework to guide evaluation
D – Determine the goals
E – Explore the questions
C – Choose the evaluation methods
I – Identify the practical issues
D – Decide how to deal with the ethical issues
E – Evaluate, analyse, interpret and present the data
Why evaluate – users expect more than just a working system – they also want a pleasing
and engaging experience.
Well designed products sell – so companies need to invest in evaluation.
What to evaluate – from prototypes to complete systems, a particular screens function to
the whole workflow.
From aesthetics to safety features.
Where to evaluate – Evaluation can take place anywhere. A new online system could be
tested in a laboratory,
whereas a new toy might need to be evaluated by children playing with it in a
natural environment.
These are know as wild studies.
When to evaluate – depends if it is a new system/product or just modified ones.
New system/product, companies will have spent a lot of money on establishing
the user requirements which could lead
to screen mockups or prototypes. These will be evaluated to check that the
developer has interpreted the user
requirements correctly. These evaluations are known as formulative evaluations.
Summative evaluations are done once the system/product is complete to check
if it is a success.
Types of evaluations – 3 categories
1. Controlled settings involving users – users activities are controlled in order to test
hypotheses and measure certain behaviours.
2. Natural settings involving users – no control over user activities in order to determine
how the product would be used in the real world.
3. Any settings not involving users – consultants and researchers critique, predict and
model aspects of the interface in order to identify the most obvious user problems.
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*
Evaluation: Inspections, Analytics and Models
Inspections – Heuristic Evaluation and Walkthroughs
Heuristic evaluation is a usability inspection method in which experts, guided by a set of
usability principles known as heuristics, evaluate whether user-interface elements, such
as dialog boxes, menus, navigation structure, online help, and so on, conform to tried and
tested principles.
Strive for consistency. Consistent sequences of actions should be required in similar
situations: identical terminology should be used in prompts, menus, and help screens; and
consistent color, layout, capitalization, fonts, and so on should be employed throughout.
Exceptions, such as required confirmation of the delete command or no echoing of
passwords, should be comprehensible and limited in number.
Cater to universal usability. Recognize the needs of diverse users and design for
plasticity, facilitating transformation of content. Novice to expert differences, age ranges,
disabilities, and technological diversity each enrich the spectrum of requirements that
guides design. Adding features for novices, such as explanations, and features for experts,
such as shortcuts and faster pacing, can enrich the interface design and improve perceived
system quality.
Offer informative feedback. For every user action, there should be system feedback. For
frequent and minor actions, the response can be modest, whereas for infrequent and
major actions, the response should be more substantial. Visual presentation of the objects
of interest provides a convenient environment for showing changes explicitly.
Design dialogs to yield closure. Sequences of actions should be organized into groups
with a beginning, middle, and end. Informative feedback at the completion of a group of
actions gives operators the satisfaction of accomplishment, a sense of relief, a signal to
drop contingency plans from their minds, and an indicator to prepare for the next group of
actions. For example, e-commerce websites move users from selecting products to the
checkout, ending with a clear confirmation page that completes the transaction.
Prevent errors. As much as possible, design the system such that users cannot make
serious errors; for example, gray out menu items that are not appropriate and do not allow
alphabetic characters in numeric entry fields. If a user makes an error, the interface should
detect the error and offer simple, constructive, and specific instructions for recovery. For
example, users should not have to retype an entire name-address form if they enter an
invalid zip code, but rather should be guided to repair only the faulty part. Erroneous
actions should leave the system state unchanged, or the interface should give instructions
about restoring the state.
Permit easy reversal of actions. As much as possible, actions should be reversible. This
feature relieves anxiety, since the user knows that errors can be undone, and encourages
exploration of unfamiliar options. The units of reversibility may be a single action, a dataentry task, or a complete group of actions, such as entry of a name-address block.
Support internal locus of control. Experienced users strongly desire the sense that they
are in charge of the interface and that the interface responds to their actions. They don't
want surprises or changes in familiar behavior, and they are annoyed by tedious data-entry
sequences, difficulty in obtaining necessary information, and inability to produce their
desired result.
Reduce short-term memory load. Humans’ limited capacity for information processing in
short-term memory (the rule of thumb is that we can remember ‘seven plus or minus two
chunks’ of information) requires that designers avoid interfaces in which users must
remember information from one screen and then use that information on another screen. It
means that smartphones should not require re-entry of phone numbers, website locations
should remain visible, multiple-page displays should be consolidated, and sufficient
training time should be allotted for complex sequences of actions.
Stages of heuristic evaluation:
The briefing session – where experts are told what to do.
The evaluation period – in which experts spend 1-2 hours independently inspecting the
product using the heuristics for guidance. The experts need to make 2 passes through the
interface.
The debriefing session – evaluators come together to discuss their findings and to prioritize
the problems they found and suggest solutions.