Download - Persuasive design op het web en verder. Voorbeelden en workshop.

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