Post on 30-Dec-2015
Chapter 11
Design, prototyping, and construction
Outline
Prototyping and construction Conceptual design Physical design Using scenarios in design Using prototypes in design
Prototyping and construction
What is a prototype? Ranges from a paper-based storyboard through
to a complex piece of software Allows stakeholders to
Interact with an envisioned product Gain real experiences Explore imagined uses
So, a prototype is a limited representation of a design that allows users to interact with it and to explore its suitability
Why prototype?
To test out the technical feasibility of an idea To clarify some vague requirements To do some user testing and evaluation To check that a certain design direction is
compatible with the rest of the system development
Your purpose will influence the kind of prototype you build
Low-fidelity prototyping
Does not look very much like the final product Simple, cheap, and quick to produce/modify Only for exploration
Low-fidelity prototyping
Examples: Storyboarding – shows steps a user might go
through to perform a task by using the product Sketching Prototyping with index cards Wizard of Oz – a human operator sits and
simulates the software’s response to the user
Storyboards
• Often used with scenarios, bringing more detail, and a chance to role play
• It is a series of sketches showing how a user might progress through a task using the device
• Used early in design
From: www.id-book.com
Sketching
• Sketching is important to low-fidelity prototyping
• Don’t be inhibited about drawing ability. Practice simple symbols
From: www.id-book.com
Card-based prototypes
• Index cards (3 X 5 inches) • Each card represents one screen or part of
screen• Often used in website development
From: www.id-book.com
‘Wizard-of-Oz’ prototyping• The user thinks they are interacting with a
computer, but a developer is responding to output rather than the system.
• Usually done early in design to understand users’ expectations
>Blurb blurb>Do this>Why?
User
From: www.id-book.com
High-fidelity prototyping
Looks much more like the final product
Powerpoint prototype has characteristics of high and low fidelity
Low-fidelity prototype
Advantages Lower development cost Evaluate multiple design
concepts Useful communication
device Address screen layout
issues Useful for identifying
market requirements Proof-of-concept
Disadvantages Limited error checking Poor detailed
specification to code to Facilitator-driven Limited utility after
requirements established Limited usefulness for
usability tests Navigational and flow
limitations
High-fidelity prototype
Advantages Complete functionality Fully interactive User-driven Clearly defines navigational
scheme Use for exploration and test Look and feel of final
product Serves as a living
specification Marketing and sales tool
Disadvantages More expensive to develop Time-consuming to create Inefficient for proof-of-
concept designs Not effective for
requirements gathering
Compromises in prototyping
• All prototypes involve compromises• For software-based prototyping maybe there is a
slow response? sketchy icons? limited functionality?
• Two common types of compromise• ‘horizontal’: provide a wide range of
functions, but with little detail• ‘vertical’: provide a lot of detail for only a few
functions• Compromises in prototypes mustn’t be ignored.
Product needs engineering
Construction: from design to implementation
Evolutionary prototyping involves evolving a prototype into the final product The prototypes should be subjected to rigorous
testing along the way
Throwaway prototyping uses the prototypes as stepping stones towards the final design The prototypes are thrown away and the final
product is built from scratch
Conceptual design
Transform needs/requirements into a conceptual model
A conceptual model is an outline of what people can do with a product what concepts are needed to understand how to
interact with it Empathize with users – really understand the
users’ experience
Conceptual design
Key guiding principles of conceptual design are: Keep an open mind but never forget the users
and their context Discuss ideas with other stakeholders as much as
possible Use low-fidelity prototyping to get rapid feedback Iterate, iterate, iterate
Conceptual design
Requirements activity Provide information about the concepts involved
in a task and their relationships Empathize with users together with
requirements Provide information about the product’s user
experience goals Give a good understanding of what the product
should be like
Developing an initial conceptual model
Interface metaphors
Which interface metaphors would be suitable to help users understand the product?
3 steps to choose a good metaphor Understand what the system will do Understand which parts of the system users may
have difficulties with Generate metaphors
Interface metaphors
Evaluate metaphors How much structure does the metaphor provide? How much of the metaphor is relevant to the
problem? Is the interface metaphor easy to represent? Will your audience understand the metaphor? How extensible is the metaphor?
Interface metaphors
Example- a group travel organizer : printed travel brochure
Structure? A book with pages, a cover, binding, an index, table of contents, and content about destinations and accommodation
Relevant? Content is relevant. Page turning is less relevant. Keeping info updated should be easier with the organizer.
Interface metaphors
Example- a group travel organizer : printed travel brochure
Easy to represent? Holiday info could be a set of brochure-like ‘pages’
Understood by audience? Yes
How extensible? Extended to include functionalities of a book
Interface metaphors
Example- a group travel organizer : travel consultant
Structure? Travelers specify their needs. Consultants do research.
Relevant? To some extent. Some may like someone else to search for their holidays; some may not.
Interface metaphors
Example- a group travel organizer : travel consultant
Easy to represent? Represented by a software agent, or database entry and search facility
Understood by audience? Yes
How extensible? The consultant could give a few or a large number of options
Interaction type
Which interaction type(s) would best support the users’ activities? Instructing, conversing, manipulating, or exploring
Example: travel organizer Instructing – finding information about visa
regulations Conversing – finding information about holiday
plans
Interface type
Do different interface types suggest alternative design insights or options?
Thinking about a conceptual model should not be influenced by a predetermined interface type
Considering different interfaces prompt alternatives one step towards producing practical prototypes
Expanding the initial conceptual model
Expanding the conceptual model
What functions will the product perform? i.e. how the task will be divided up between the human and the machine (task allocation) Too high cognitive load for the user, the device
may be too stressful Too much control taken by the device (inflexible),
the product may not be used What functions will be ‘hard-wired’, what will
be left under software control
Expanding the conceptual model
How are the functions related to each other? Temporally, e.g. one must be performed before
another Categorizations, e.g. all functions relating to
telephone memory storage in a cell phone
The relationships between tasks (task analysis) supply information to support these kinds of decisions
Expanding the conceptual model
What information needs to be available? What data is required to perform a task? How is this data to be transformed by the system?
Physical design
Where the border between conceptual design and physical design lies is not relevant
What’s more important is that the conceptual design should not be tied to physical constraints too early because this might inhibit creativity
Using scenarios in design
Expressed proposed or imagined situations Used throughout design in many ways
Used as scripts for user evaluation of prototypes Provide a concrete example of a task Used as the basis of storyboard creation Build a shared understanding among team
members Sell ideas to users, managers, potential
customers
Using scenarios in design
Plus and minus scenarios to capture the most positive and negative consequences of a particular proposed design solution
Using prototypes in design
Generate storyboard from scenario
From: www.id-book.com
Scenario for holiday planner
“The Thomson family enjoy outdoor activity holidays and want to try their hand at sailing this year. There are four members of the family: Sky who is 10 years old, Eamonn who is 15 years old, Claire who is 35, and Will who is 40. While out on a shopping trip they call by at the travel agents
in their local town to start exploring the possibilities ... The travel organizer is located in a quiet corner of the agents’ office, where there
are comfortable seats and play things for young children. They all gather around the organizer and enter their initial set of requirements—a sailing holiday for four novices. The stand-alone console is designed so that all members of the family can interact easily and comfortably with it. The
system’s initial suggestion is that they should consider a flotilla holiday, where several novice crews go sailing together and provide mutual
support for first-time sailors…”
Generate card-based prototype from use case
From: www.id-book.com
Use case for holiday planner1. The system displays options for investigating visa and vaccination
requirements.
2. The user chooses the option to find out about visa requirements.
3. The system prompts user for the name of the destination country.
4. The user enters the country’s name.
5. The system checks that the country is valid.
6. The system prompts the user for her nationality.
7. The user enters her nationality.
8. The system checks the visa requirements of the entered country for a
passport holder of her nationality.
9. The system displays the visa requirements.
10. The system displays the option to print out the visa requirements.
11. The user chooses to print the requirements.
Summary
• Different kinds of prototyping are used for different purposes and at different stages
• Prototypes answer questions, so prototype appropriately
• Construction: the final product must be engineered appropriately
• Conceptual design (the first step of design)
• Consider interaction types and interface types to prompt
creativity
• Storyboards can be generated from scenarios• Card-based prototypes can be generated from use cases
From: www.id-book.com
Chapter 12
Introducing evaluation
Outline
Why, what, where and when of evaluation Evaluation approaches and methods Evaluation case studies
Why, what, where and when of evaluation
Why evaluate? Get feedback on early design ideas Able to fix problems before launching to market Focus on real problems rather than on designers’
preferences What to evaluate
Early design ideas Prototypes Finished products
Why, what, where and when of evaluation
Where to evaluate laboratory or natural settings
When to evaluate Formative evaluation – to check that the product
continues to meet users’ needs Summative evaluation – to assess whether the
finished product meets required standards
The language of evaluation
Analytical evaluation an approach to evaluation that does not involve
end-users, e.g. heuristic evaluation, walkthroughs, and modeling
Controlled experiment A study that is performed in a laboratory which is
controlled by the evaluator Field study
A study that is done in a natural environment
The language of evaluation
Formative evaluation Heuristic evaluation
An approach to evaluation in which knowledge of typical users is applied to identify usability problems
Predictive evaluation An approach to evaluation in which theoretically
based models are used to predict user performance
The language of evaluation
Summative evaluation Usability laboratory
a laboratory that is designed for usability testing User studies
Any evaluation that involves users directly Usability study
An evaluation that is performed to examine the usability of a design or system
The language of evaluation
Usability testing An approach to evaluation that involves
measuring users’ performance and evaluating their satisfaction with the system in question on certain tasks in a laboratory setting
User testing An evaluation approach where users are asked to
perform certain tasks using a system or prototype in an informal or laboratory setting
Evaluation approaches
Usability testing Field studies Analytical evaluation
Evaluation methods
Observing users Asking users Asking experts User testing Inspections Modeling users’ performance
Characteristics of approaches
Usability testing
Field studies
Analytical
Users do task natural not involved
Location controlled natural anywhere
When prototype early prototype
Data quantitative qualitative problems
Feedback measures & errors
descriptions problems
Type applied naturalistic expert
From: www.id-book.com
Evaluation approaches and methods
Method Usability testing
Field studies
Analytical
Observing x x
Asking users
x x
Asking experts
x x
Testing x
Modeling x
From: www.id-book.com
Evaluation case studies
Evaluation to design a mobile record system for Indian ANMs A field study using observations and
interviews to refine the requirements. It would replace a paper system. It had to be easy to use in rural
environments. Basic information would be recorded: identify
each house-hold, head of house, no. members, age and medical history of members, etc.
From: www.id-book.com
Could these icons be used with other cultures?
For more interesting examples of mobile designs for the developing world see Gary Marsden’s home page:http://people.cs.uct.ac.za/~gaz/research.html
From: www.id-book.com
Multiple methods to evaluate the 1984 OMS
• Early tests of printed scenarios & user guides. Early simulations of telephone keypad. An Olympian joined team to provide feedback. Interviews & demos with Olympians outside US. Overseas interface tests with friends and family. Free coffee and donut tests. Usability tests with 100 participants. A ‘try to destroy it’ test. Pre-Olympic field-test at an international event. Reliability of the system with heavy traffic.
From: www.id-book.com
Key points
Evaluation & design are closely integrated in user-centered design.
Some of the same techniques are used in evaluation as for establishing requirements but they are used differently (e.g. observation interviews & questionnaires).
Three main evaluation approaches are:usability testing, field studies, and analytical evaluation.
The main methods are:observing, asking users, asking experts, user testing, inspection, and modeling users’ task performance.
Different evaluation approaches and methods are often combined in one study.
Triangulation involves using a combination of techniques to gain different perspectives, or analyzing data using different techniques.
Dealing with constraints is an important skill for evaluators to develop.
From: www.id-book.com
Chapter 13
An evaluation framework
DECIDE: a framework to guide evaluation
1. Determine the goals 2. Explore the questions 3. Choose the evaluation approach and
methods 4. Identify the practical issues 5. Decide how to deal with the ethical issues 6. Evaluate, analyze, interpret, and present
the data
Determine the goals
Goals determine the scope of evaluation Different goals
To make sure that the design met users’ needs To fine tune an interface To examine how mobile tech changes working
practices To investigate what makes collaborative computer
games engaging
Explore the questions
Questions make goals operational Example:
Goal: Find out why some people prefer to purchase paper airline tickets rather than e-tickets
Questions: What are customers’ attitudes to these e-tickets? Do they trust the system? Is the user interface to the ticketing system poor?
Explore the questions
Questions can be further broken down into very specific subquestions
Example: Question: Is the user interface to the ticketing
system poor? Subquestions:
Is the system difficult to navigate? Is the terminology confusing? Is the response time too slow?
Choose the approach and methods
Depend on Goals Questions Resources Practical issues Ethical issues
Identify the practical issues
Kind of users to be involved target user groups (level of experience, gender,
age, etc.) tasks
Logistical issues Facilities and equipment
How will you do the video recording? How will you record the data when users move quickly
from one environment to another? Schedule and budget
Identify the practical issues
Kind of expertise needed to perform the evaluation Running user tests requires knowledge of
experimental design and video recording
Using statistical measures needs knowledge of statistics -> consult a statistician
Decide about ethical issues
Develop an informed consent form
Participants have a right to:- Know the goals of the study;- Know what will happen to the findings;- Privacy of personal information;- Leave when they wish; - Be treated politely
From: www.id-book.com
Evaluate, interpret & present data
The approach and methods used influence how data is evaluated, interpreted and presented
The following need to be considered:- Reliability: can the study be replicated?- Validity: is it measuring what you expected?- Biases: is the process creating biases?- Scope: can the findings be generalized?- Ecological validity: is the environment influencing the findings?
i.e. Hawthorn effect
From: www.id-book.com
Key points
There are many issues to consider before conducting an evaluation study.
These include the goals of the study, the approaches and methods to use, practical issues, ethical issues, and how the data will be collected, analyzed and presented.
The DECIDE framework provides a useful checklist for planning an evaluation study.
From: www.id-book.com