SLIDE 1
Prototyping 11-04-2012 Design & Prototyping benefits (and - - PowerPoint PPT Presentation
Prototyping 11-04-2012 Design & Prototyping benefits (and - - PowerPoint PPT Presentation
Prototyping 11-04-2012 Design & Prototyping benefits (and disadvantages) of prototyping low fidelity vs. high fidelity prototyping horizontal vs. vertical prototyping Transform user requirements/needs into a conceptual
SLIDE 2
SLIDE 3
■ Transform user requirements/needs into a conceptual model ■ “a description of the proposed system in terms of a set of integrated ideas and concepts about what it should do, behave and look like, that will be understandable by the users in the manner intended” ■ Don’t move to a solution too quickly. Iterate, iterate, iterate ■ Consider alternatives: prototyping helps
SLIDE 4
4 www.id-book.com
- What is a prototype?
- Why prototype?
- Different kinds of prototyping
low fidelity high fidelity
- Compromises in prototyping
vertical horizontal
SLIDE 5
5 www.id-book.com
In other design fields a prototype is a small-scale model:
- a miniature car
- a miniature building or town
- the example here comes
from a 3D printer
SLIDE 6
In interaction design it can be (among other things):
- a series of screen sketches
- a storyboard, i.e. a cartoon-like series of scenes
- a Powerpoint slide show
- a video simulating the use of a system
- a lump of wood (e.g. PalmPilot)
- a cardboard mock-up
- a piece of software with limited functionality
written in the target language or in another language
6 www.id-book.com
SLIDE 7
7 www.id-book.com
- Evaluation and feedback are central to interaction
design
- Stakeholders can see, hold, interact with a
prototype more easily than a document or a drawing
- Team members can communicate effectively
- You can test out ideas for yourself
- It encourages reflection: very important aspect of
design
- Prototypes answer questions, and support
designers in choosing between alternatives
SLIDE 8
8 www.id-book.com
- Technical issues
- Work flow, task design
- Screen layouts and information display
- Difficult, controversial, critical areas
SLIDE 9
9 www.id-book.com
- Uses a medium which is unlike the final
medium, e.g. paper, cardboard
- Is quick, cheap and easily changed
- Examples:
sketches of screens, task sequences, etc ‘Post-it’ notes storyboards ‘Wizard-of-Oz’
SLIDE 10
10 www.id-book.com
- 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
SLIDE 11
11 www.id-book.com
- Sketching is important to low-fidelity
prototyping
- Don’t be inhibited about drawing ability.
Practice simple symbols
SLIDE 12
Sketch all screens (including variations) involved in the tasks you want to get feedback on Usually useful to use a large sheet of paper Pencils better for initial sketches Colored pens may be used for more elaborate sketches May use additional pieces of paper/other materials to show changes on the same screen (e.g. keep navigation menu, change content)
SLIDE 13
Use is common for developing websites Also useful for applications with a large number of screens Each card represents a screen Can help organize websites Can help with information architecture
SLIDE 14
14 www.id-book.com
- The user thinks they are interacting with a
computer, but a developer is responding to
- utput rather than the system.
- Usually done early in design to understand
users’ expectations
- What is ‘wrong’ with this approach?
>Blurb blurb >Do this >Why?
User
SLIDE 15
How do you use low-fidelity prototypes to get feedback on your design? Go over user tasks to see how well the prototype will work Evaluate in terms of requirements, usability goals, user experience goals Evaluate using usability principles and heuristics
SLIDE 16
Examples
Can users complete tasks? How many steps does it take to complete
tasks?
Are all the necessary functions available? Are the necessary actions easily identifiable? Is it easy to recuperate from errors? What is the likelihood that users will make
mistakes?
SLIDE 17
Users can also evaluate low-fidelity prototypes Decide which tasks you want to get feedback on Make sure your low-fidelity prototype shows every step user would have to go through in completing those tasks
SLIDE 18
Ask users to complete a particular task For each step in the task
Ask: what would you do next? After they show you what they would do,
show them how the system would react
- Show sketch for another screen
- Use materials to modify current sketch
Ask: how do you interpret the system’s
response?
SLIDE 19
- Uses materials that you would expect to be in the
final product.
- Prototype looks more like the final system than a
low-fidelity version.
- For a high-fidelity software prototype common
environments include Macromedia Director, Visual Basic, and Smalltalk.
- Danger that users think they have a full
system…….see compromises
SLIDE 20
- 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
SLIDE 21
- Taking the prototypes (or learning from
them) and creating a whole
- Quality must be attended to: usability (of