How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and...

48
How to make the invisible visible, how to make the impossible reality, how to feel the intangible? http://livinglabbus.fi/

Transcript of How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and...

Page 1: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

How to make the invisible visible,how to make the impossible reality,

how to feel the intangible?

http://livinglabbus.fi/

Page 2: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

CS-E5200 Design Project

Prototyping and Concept Validation

Mika P. Nieminen, D.Sc. (Tech.)[email protected]+358 40 731 2625

Strategic Usability Research Group

Page 3: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

CreativityIdeation

SelectionValidation

Maximum uncertainty

“Good” solution

Design project timeline

Ideation or when more is more

Page 4: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Double diamond

Con

cept

hyp

othe

sis

Concept design Implementation design

Ope

ratio

ns

Feedback

Page 5: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

What tools to use at each stage?

Time

Des

ign

conf

iden

ce

100%

0%

Use

r res

earc

h

Des

ign

and

prot

otyp

ing

Dev

elop

men

tan

d de

sign

pha

se

Exte

nsiv

e us

er te

stin

g

V2 d

evel

pmen

t

MVPLaunch

Start of development

Page 6: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Development milestones

PrototypeMVP

V1.0 Scaling up

Potential implementation technology breaks

Page 7: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Tools development trends

Functionality/performance

Cos

t/dev

tim

e

Prototyping tools

Development tools

Page 8: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Tools development trends

Functionality/performance

Cos

t/dev

tim

e

Page 9: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

To be considered

• What tools to choose for the prototyping and development phases

• Can work done/implementation from the prototyping stage be reused?

Page 10: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Example: Online store

• Holvi, free + 3%/transaction• Shopify, 29$/month + 3-5%/transaction• Woocommerce, 100-1000€/year sw + 5-30€/month

hosting + 2%/transaction• Tailor made: 30’000-100’000 development + 100€/month

hosting + 2%/transaction

Page 11: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

SW testing outcomes

User testing = Implementation quality• Usability• UI design• Speed• Can be done in lab

Concept validation =Solution quality• Right problem?• Good solution?• Interaction with context• Only works in the field

Page 12: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

The two outcomes of prototyping

Planned outcomes• Evaluation results

Unplanned outcomes• Serendipity• Require listening• Open mind

Page 13: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Risk = f(uncertainty)

Time

Unc

erta

inty

Reducing risk = reducing uncertainty

Decision

Page 14: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Why must I validate the design?

• Identified and interpreted the users needs correctly• Concepts fit the users (not the designers)• Both qualitative and quantitative data can be gathered

Page 15: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Validation is ...

• Two way communication between design team and user • Medium for this communication the prototypes

(artifacts).• Detail and quality improved the further the development

process goes • All the different levels are used all the time

Page 16: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Current design =hypothesis

Select most criticalassumptions

Invent ways to testthe assumptions

Define success criteria for tests

Discover underlyingassumptions

Assumption = something that must be true in

order for the design to be valid

Page 17: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Implement test(s)

Execute test(s)

Evaluate test results

Decision:go, no go, redesign

New design

Page 18: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Do’s

• Test in real context• Use humans for complex “behind the scene tasks”

– Concierge services, Wizard of Oz• Less is more, seek minimum useful functionality

Page 19: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Don’t

• Waste time on overhead functions– Login, user profile, etc

• Over-rely on A/B testing– Good for incremental improvement

Page 20: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Prototyping ideas

Page 21: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Storyboard as prototype

Page 22: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Benchmark

Page 23: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Physical

Page 24: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Prototyping process=

concept validation

Page 25: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

More Examples

2/18/2018

Page 26: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Examples: Scenario / Storyboard

Page 27: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Scenario / Storyboard

Page 28: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Collages / Moodboards

Page 29: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

CGI Simulations / animations

Page 30: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

3D illustrations

Page 31: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Example: 3D illustrations

Page 32: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Movie / Play

Page 33: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Paper prototypes,tangible prototypes

Page 34: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Examples

• Kiasma Guide

Paperprototype holderbackground music andinterpretations from mini-CD

Page 35: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Kutsulaite

Paper prototypes,3D prototypes

Page 36: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Paper prototypes

Page 37: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Paper prototype of an web email

Page 38: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Functional prototypes

Page 39: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Heureka Now

Page 40: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

HNow validation

Page 41: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

...and the real Heureka infotellera.k.a. Hopastin

Page 42: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Functional Prototypes

Page 43: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Mega-Scratch Lottery

Page 44: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Windshield and Swipe&Touch validations

Page 45: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Customer Journey Map

Page 46: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Landing pages

Page 47: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

Mobile Apps

Image: www.igen.fr

Page 48: How to make the invisible visible, how to make the ......CS-E5200 Design Project. Prototyping and Concept Validation. Mika P. Nieminen, D.Sc. (Tech.) mika.nieminen@aalto.fi +358 40

LEARNING FINNISH WITH YLE SELKOUUTISET