Mock-ups in Design

Infinit Interessegruppemøde

CSC Scandihealth 20/1 2011Lars Bo Larsen

lbl@es.aau.dk

Outline

Different kinds of prototyping

low fidelity (aka mock-ups / paper prototypes)

high fidelity

A few examples

Can results on Mock-ups be trusted?

Litterature and references

p.2

What to prototype?

Technical issues

Work flow, task design

Screen layouts and information display

Difficult, controversial, critical areas

p.3

Using prototypes in conceptual design

Allow evaluation of emerging ideas

Low-fidelity prototypes used early on, high-fidelity

prototypes used later

Prototypes are used for testing, but are also

excellent for communicating ideas!

p.4

Simulating wall-screen interaction

A Lo-Fi prototype for air-traffic controllers

p.5

The Washing Machine

Redesign of controls

to focus on the clothes

to be washed rather

than programming the

settings of the

washing machine

p.6(thanks to grp. ST855a + ST857c 2008)

The Washing Machine

Redesign of controls

to focus on the clothes

to be washed rather

than programming the

settings of the

washing machine

p.7

The Washing Machine

p.8

Tilbage

Duge

Håndklæder

Karklude

Sengelinned

Sokker

Træningstøj

Undertøj

Viskestykker

Badetøj

Cowboy-tøj

Bukser

Lingeri

Nylonstrømper

Sko

Overtøj

Fint tøj

Tørklæder

Nederdele

Uld

VÆLG TØJTYPER

Videre

Hi-fidelity or Lo-fidelity, Paper or Computer?- Choosing attributes when testing web prototypes

Experiment and slides by:

Miriam Walker

Leila Takayama

Professor James Landay

Group for User Interface

Research

University of California Berkeley

http://dub.washington.edu:2007/projects/fidelity/pubs/Walker_HFES_2002.pdf

Making early stage prototypes

10

Paper Medium

Computer

Medium

Low-fidelity

High-

fidelity

Sketched with

paper and

pens

Scanned in

paper pages

Printed

screens

Coded in

HTML

Low-Fidelity Prototype

11

High-Fidelity Prototype

12

Quantitative Analysis of Results

1270 comments and 169 issues

Low-fidelity vs High-fidelity

No significant differences in number of comments or issues

Paper vs. computer

Average of 5 more comments about computer prototype (Wilcoxon

signed ranks test, p = 0.015)

Issues – no significant differences

No differences in severity of issues found

No differences in scope of issues

Only 10% of comments mentioned aesthetics

13

Usefulness of Paper Prototyping

In a survey 172

usability professionals

were asked the

question: “What is the

importance of paper

prototyping to your

work”?

p.14

Usefulness of Paper Prototyping

Useless:

0%

Marginal

15%

Useful

55%

Essential

30%

From ”Paper Prototyping” by C. Snyder

Video:

Jakob Nielsen and Don Norman’s company the ”Nielsen

Norman group” (NN/g http://www.nngroup.com/) has

produced the video:

”Paper Prototyping: A How-To Video”

p.15

Book:

Carolyn Snyder:

“Paper Prototyping: The Fast

and Easy Way to Design and

Refine User Interfaces"

(Interactive Technologies)

http://www.paperprototyping.com

p.16

Projektsamarbejder

Infinit støtter (mindre) projektsamarbejder mellem

medlemmerne – institutioner og firmaer

Budget op til et par 100.000 kr

Kan lede til større satsninger

Udspringer af interessegrupperne

Eksempel på projektforslag:

Synkronisere smart-phone/Ipad/tablet med TV via lydsignalet

for at præsentere relevant information tidsmæssigt afstemt

med TV udsendelser. Under overvejelse – partnere indtil nu:

AAU og DR-medier, andre meget velkomne.

Diskutere ideer og interesser i grupperne

Vi skal melde forventninger ind i februar

p.17

Studentersamarbejder

Forårssemestret starter første februar – ideer og forslag til

projekter – inkl. specialer er velkomne

God måde at skabe kontakt og få belyst ideer og problemstillinger

Civilingeniør Produkt og Design Psykologi (PDP)

Civilingeniør Intelligente Multimedier

Datalogi

Informatik

Praktikmuligheder for PDP-studerende til efteråret.

Efteråret 2010: To aftaler. Huge Lawn og Migatronic

Efteråret 2011:

p.18

p.19