Lecture 9: Design & Prototyping

DESIGN PROCESS

Two types of design:
conceptual – developing conceptual model, captures what the product will do and how it will behave
physical – details of the design, e.g. screen, icons, graphics, menus

To effectively evaluate the design of an interactive product, must produce and interactive versions of the design

PROTOTYPE
A limited representation of a design that allows users to interact with it and to explore its suitability
Allows stakeholders to interact with the envisioned product, gain some experience of using and explore imagined uses
E.g. paper-based storyboards of a system,, cardboard mockup for a desktop laser printer, hyperlinked screens
E.g. PalmPilot’s founder Jeff Hawkin, carry a carved wood about the shape and size of the device to simulate scenarios of use.

WHY PROTOTYPE

Communication device among team members
Test out technical feasibility of an idea
Effective way for user testing/evaluation
Clarifying vague requirements
Check if the design direction is compatible with the rest of the system development
Recommended in software design, to come before any writing of code

TYPES OF PROTOTYPING



LOW FIDELITY PROTOTYPING

The prototype only retains limited characteristics of the final product
They are cheap and quick to produce -
therefore, they support the exploration of alternative
designs (multiple iterations)
They are particularly good for:
Considering early design issues, e.g. layout of controls and display items, sequencing, etc.
Identifying fundamental problems, I.e. those which lead to errors, confusions, major dislikes

Storyboarding
Series of sketches showing how a user might progress through a task using the device being developed
Often based on scenarios - typical activities
involving the product/system in a story form, e.g.
“a patron wants to purchase Harry Potter movie ticket from the cinema, he uses his mobile phone to make the booking while he is on the bus”

Index Card/Stickies:
Each card/sticky represents an element of a task, one screen or a screen element
Used in user evaluations where a member of
the design team “plays the computer”
Difficulties encountered are observed and/or recorded

Advantages:
Lower cost
Evaluate multiple design concepts
Useful communication device
Disadvantages:
Limited error/usability checking
Facilitator driven
Navigational and flow limitations

HIGH FIDELITY PROTOTYPING

Retains many of the characteristics of the final product
Time consuming and expensive to develop, however:
Enable a wider range of usability issues/ problems to be considered/uncovered
Enable other quality attributes such as aesthetics to be evaluated
Impress management, serve as a good marketing and sales tool

3D form with some limited interaction possible
A range of materials may be employed
Very useful when the physical fit/feel of the product is critical, e.g. a handheld device, a wearable device

Software prototyping
Computer-based mock-ups of interface enabling sophisticated user-system interactions
Variety of prototyping tools exist to support developers with differing levels of fidelity, e.g.
MS PowerPoint
Authorware
Macromedia Flash
Macromedia Director

Advantages:
Complete functionality, look and feel of final product
Fully interactive
User-driven
Marketing/sales tools
Disadvantages:
Expensive to develop
Time-consuming to create
Not effective for requirements gathering

COMPARING PROTOTYPING