persuasive design op het web en verder. voorbeelden en workshop

65
PERSUASIVE DESIGN - Anton Vanhoucke - Een workshop in online verleiden @antonvh

Upload: anton-vanhoucke

Post on 25-Jan-2015

108 views

Category:

Design


0 download

DESCRIPTION

Waar Usability het alleen gemakkelijk maakt voor de bezoeker van je website, helpt Persuasive Design om de gebruiker te motiveren en zo meer en langere interactie uit te lokken. Met inspirerende voorbeelden ontdek je hoe Persuasive Design tegenwoordig slim toegepast wordt. Je leert de wetenschappelijke principes achter Persuasive Design en past die toe.

TRANSCRIPT

Page 1: Persuasive design op het web en verder. Voorbeelden en workshop

PERSUASIVE DESIGN - Anton Vanhoucke -

Een workshop in online verleiden

@antonvh

Page 2: Persuasive design op het web en verder. Voorbeelden en workshop

DOEL VAN DE WORKSHOP · Praktisch inzicht in het gebruik van persuasive

design

Waar begin ik?

Saliency? Hoe werkt persuasive design ?

Waarom persuasive deisgn?

Page 3: Persuasive design op het web en verder. Voorbeelden en workshop

MAAK HET INTERACTIEF! · Vragen ophangen · Leuk, maar wat betekent dit voor…

... Mijn team

... Mijn gemeente

... Mijn projecten

... Mijn taken

... mezelf

Page 4: Persuasive design op het web en verder. Voorbeelden en workshop

DEZE OCHTEND · 09:30 · 09:50 · 10:00 · 10:30 · 10:40 · 10:50 · 11:45 · 12:15 · 12:30

Kennis maken Inleiding Mechanismes & voorbeelden Ontwerptools Koffie Zelf aan de slag Presentaties Conclusie Lunch

Page 5: Persuasive design op het web en verder. Voorbeelden en workshop

KENNIS MAKEN Wat doe je? Waarom persuasive design? Ervaring?

Page 6: Persuasive design op het web en verder. Voorbeelden en workshop

FABRIQUE · Merken · Design · Interactie

· Sinds 1992

Page 7: Persuasive design op het web en verder. Voorbeelden en workshop

WELKOM IN DELFT

Page 8: Persuasive design op het web en verder. Voorbeelden en workshop

WELKOM IN AMSTERDAM

Page 9: Persuasive design op het web en verder. Voorbeelden en workshop

WELKOM IN ROTTERDAM

Page 10: Persuasive design op het web en verder. Voorbeelden en workshop

WE WERKEN VOOR B2C MERKEN

Page 11: Persuasive design op het web en verder. Voorbeelden en workshop

WE WERKEN SAMEN

Page 12: Persuasive design op het web en verder. Voorbeelden en workshop

BEKEND VAN RIJKSMUSEUM,

Page 13: Persuasive design op het web en verder. Voorbeelden en workshop

ALLERHANDE APP,

Page 14: Persuasive design op het web en verder. Voorbeelden en workshop

EN 9292

Page 15: Persuasive design op het web en verder. Voorbeelden en workshop

INLEIDING Voor een effectieve workshop

Page 16: Persuasive design op het web en verder. Voorbeelden en workshop

THEORIE Met inzichten van:

Page 17: Persuasive design op het web en verder. Voorbeelden en workshop
Page 18: Persuasive design op het web en verder. Voorbeelden en workshop
Page 19: Persuasive design op het web en verder. Voorbeelden en workshop
Page 20: Persuasive design op het web en verder. Voorbeelden en workshop

VOORBEELDEN Nieuw!

2 Bonus Technieken

Page 21: Persuasive design op het web en verder. Voorbeelden en workshop

SIGNALS

Page 22: Persuasive design op het web en verder. Voorbeelden en workshop

SPARKING

Page 23: Persuasive design op het web en verder. Voorbeelden en workshop

FACILITATING

Page 24: Persuasive design op het web en verder. Voorbeelden en workshop

LOSS AVERSION

Page 25: Persuasive design op het web en verder. Voorbeelden en workshop

LOSS AVERSION

Page 26: Persuasive design op het web en verder. Voorbeelden en workshop

LIMITED DURATION

Page 27: Persuasive design op het web en verder. Voorbeelden en workshop

SOCIAL PROOF

Page 28: Persuasive design op het web en verder. Voorbeelden en workshop

AUTHORITY

Page 29: Persuasive design op het web en verder. Voorbeelden en workshop

AUTHORITY

Page 30: Persuasive design op het web en verder. Voorbeelden en workshop

HUMAN STARE

Page 31: Persuasive design op het web en verder. Voorbeelden en workshop

VISUAL IMAGERY

Page 32: Persuasive design op het web en verder. Voorbeelden en workshop

VISUAL IMAGERY - SPOKEN

Page 33: Persuasive design op het web en verder. Voorbeelden en workshop

METAPHOR

4G

3G

4G internet is 22x as fast

Page 34: Persuasive design op het web en verder. Voorbeelden en workshop

SALIENCY

Page 35: Persuasive design op het web en verder. Voorbeelden en workshop

SALIENCY

Page 36: Persuasive design op het web en verder. Voorbeelden en workshop

ORDER

Page 37: Persuasive design op het web en verder. Voorbeelden en workshop

ORDER

Page 38: Persuasive design op het web en verder. Voorbeelden en workshop

SALIENCY & DEFAULTS

Page 39: Persuasive design op het web en verder. Voorbeelden en workshop

SELF-EFFICACY

Page 40: Persuasive design op het web en verder. Voorbeelden en workshop

RECIPROCITY

Page 41: Persuasive design op het web en verder. Voorbeelden en workshop

CURIOSITY

Page 42: Persuasive design op het web en verder. Voorbeelden en workshop

STATUS

Page 43: Persuasive design op het web en verder. Voorbeelden en workshop

FLUENCY

Page 44: Persuasive design op het web en verder. Voorbeelden en workshop

FLUENCY

Page 45: Persuasive design op het web en verder. Voorbeelden en workshop

FLUENCY

Hele kleine lettertjes

Page 46: Persuasive design op het web en verder. Voorbeelden en workshop

STORY

Page 47: Persuasive design op het web en verder. Voorbeelden en workshop

UNEXPECTED

Page 48: Persuasive design op het web en verder. Voorbeelden en workshop

SET COMPLETION Bonus 1

Page 49: Persuasive design op het web en verder. Voorbeelden en workshop

FRONT LOADING Bonus 2

Page 50: Persuasive design op het web en verder. Voorbeelden en workshop

CONSISTENCY & COMMITMENT Bonus 3

Page 51: Persuasive design op het web en verder. Voorbeelden en workshop

TOOLS Gebruikt door vele tevreden professionals

Page 52: Persuasive design op het web en verder. Voorbeelden en workshop

DESIGN WITH INTENT

Page 53: Persuasive design op het web en verder. Voorbeelden en workshop

WHEEL OF PERSUASION

Page 54: Persuasive design op het web en verder. Voorbeelden en workshop

ABILITY · inSights

Page 55: Persuasive design op het web en verder. Voorbeelden en workshop

GEBRUIKEN IN BRAINSTORMS

Page 56: Persuasive design op het web en verder. Voorbeelden en workshop

ABILITY · inSights

Page 57: Persuasive design op het web en verder. Voorbeelden en workshop

GEBRUIKEN BIJ ONTWERPEN

Page 58: Persuasive design op het web en verder. Voorbeelden en workshop

CHECK · http://requisitevariety.co.uk/design-with-intent-

toolkit/ · http://www.wheelofpersuasion.com/ · http://getmentalnotes.com/ · http://www.fabrique.nl/insights/

Page 59: Persuasive design op het web en verder. Voorbeelden en workshop

TOEPASSEN Wij gaan persuasive ontwerpen

Page 60: Persuasive design op het web en verder. Voorbeelden en workshop

AANPAK 1.  Vorm teams van 2-3 personen 2.  Kies een belangrijke pagina van je site 3.  Bedenk wat het gewenste gedrag is van je

bezoeker 4.  Kies willekeurig 1 principe uit inSights of Mental

notes 5.  Vraag je af: “Hoe kunnen met dit principe

bezoekers verleiden om gedrag x te vertonen” 6.  Schets of schrijf dit op een post-it 7.  Als je niks kan bedenken neem je de volgende

Page 61: Persuasive design op het web en verder. Voorbeelden en workshop

NA DEZE TRAINING Waar begin je?

Page 62: Persuasive design op het web en verder. Voorbeelden en workshop

JE EIGEN VERZAMELING

Page 63: Persuasive design op het web en verder. Voorbeelden en workshop

MEER LEZEN · Stanley Milgram · Edward Deci · Robert Cialdini · Chip & Dan Heath · Tom Stafford and

Matt Webb · Daniel Kahneman · Stephen Anderson

Page 64: Persuasive design op het web en verder. Voorbeelden en workshop

ANTWOORDEN? Tot slot

Page 65: Persuasive design op het web en verder. Voorbeelden en workshop

@antonvh