Se videoen fra vores oplæg om Microinteractions på www.1508.dk/Morgenbooster Kom videre på: http://1508.dk/services/digital-strategi http://1508.dk/services/digitale-services

1. MORGENBOOSTER
MICROINTERACTIONS
DJÆVLEN I DETALJEN
LOUISE KLINKER, SENIOR UX DESIGNER
SØREN SIGFUSSON, SENIOR INTERFACE DEVELOPER

2. MORGENBOOSTER

3. MORGENBOOSTER

4. MORGENBOOSTER
MAJOR FAIL ELLER SIGNATURE MOMENT

5. MORGENBOOSTER
“THE DETAILS ARE NOT
THE DETAILS. THEY MAKE
THE DESIGN”
Charles Eames

6. MORGENBOOSTER
EN MICROINTERACTION
ER ET LILLE STYKKE
FUNKTIONALITET, DER
GØR EN TING

7. MORGENBOOSTER
…SOM EN DEL AF EN FEATURE ELLER ET STØRRE PRODUKT

8. MORGENBOOSTER
…ELLER SOM EN APP DESIGNET OMKRING EN ENKELT MICROINTERACTION

9. MORGENBOOSTER
DEFINITION

10. MORGENBOOSTER
STRUKTUR

11. MORGENBOOSTER
STRUKTUR – OG OPSKRIFT PÅ SUCCESFULD MICROINTERACTION

12. MORGENBOOSTER
TRIGGER

13. MORGENBOOSTER
TRIGGER

14. MORGENBOOSTER
TRIGGER
MANUEL TRIGGER
> ER BRUGERINITIERET
SYSTEM TRIGGER
> ET SÆT BETINGELSER
ER OPFYLDT
>
>
>
>
> LOKATION
> INDGÅENDE DATA (3 NYE MAILS)
> ANDRE MICROINTERACTIONS
> ANDRE MENNESKER (REPOST
ETC.)
> FEJL
EN KONTROL
ET IKON
EN FORM
STEMME, BERØRING ELLER GESTUS

15. MORGENBOOSTER
GØR DATA SYNLIG

16. MORGENBOOSTER
RULES

17. MORGENBOOSTER
RULES
REGLER ER HJERTET AF
EN MICROINTERACTION
REGLER ER USYNLIGE
DE SES GENNEM
FEEDBACK
DE MÅ IKKE FØLES SOM
REGLER, MEN SOM ET
FLOW
GENERERES UD FRA ET
MÅL: FX AT LOGGE EN
BRUGER IND

18. MORGENBOOSTER
MÅL: LÆG VARE I KURV
1.
BRUGEREN KLIKKER ”ADD”
PÅ EN PRODUKTSIDE
2.
PRODUKTET LÆGGES I
KURVEN
TILFØJ EVT. FLERE NUANCER
1.
TJEK OM PRODUKTET
ALLEREDE ER I KURVEN, HVIS
JA, SÅ VIS ”ADD ANOTHER”,
HVIS EJ, SÅ VIS ”ADD”
2.
BRUGER KLIKKER KNAPPEN
3.
PRODUKTET LÆGGES I
KURVEN

20. MORGENBOOSTER
FJERN KOMPLEKSITET
MED BEGRÆNSEDE
VALGMULIGHEDER OG
SMARTE DEFAULTS

21. MORGENBOOSTER
ENKELHED I RULES

22. MORGENBOOSTER
RULES

23. MORGENBOOSTER
RULES
DONT START FROM
ZERO

24. MORGENBOOSTER
RULES
VI VED ALTID NOGET OM
BRUGEREN OG
KONTEKSTEN
> HVAD HAR BRUGEREN TIDLIGERE
GJORT?
> KOMMER DE FRA MOBIL, WEB
ELLER TABLET?
> TID PÅ DAGEN?
> HVOR LÆNGE SIDEN SIDSTE BRUG?
> BATTERILEVETID?
> LOKATION/RETNING?

25. MORGENBOOSTER
RULES
UNDGÅ
MENNESKELIGE FEJL

26. MORGENBOOSTER
RULES

27. MORGENBOOSTER
RULES

28. MORGENBOOSTER
FEEDBACK

29. MORGENBOOSTER
FEEDBACK
TYPER
>
>
>
>
>
>
VISUEL
ANIMATION
BESKEDER
AUDIO
HAPTISK – BEVÆGELSE
LYS

30. MORGENBOOSTER
FEEDBACK
FOR MENNESKER!
>
>
>
>
>
>
NOGET ER SKET
DU GJORDE NOGET
EN PROCES ER STARTET
EN PROCES ER AFSLUTTET
EN PROCES ER I GANG
DU KAN IKKE GØRE DET HER

31. MORGENBOOSTER
FEEDBACK
BEHØVER IKKE AT VISE,
HVORDAN REGLERNE
VIRKER, MEN SKAL VÆRE
NOK TIL, AT BRUGEREN
KAN DANNE SIG EN
MENTAL MODEL AF
MICROINTERACTIONEN.

32. MORGENBOOSTER
FEEDBACK

33. MORGENBOOSTER
MICROINTERACTIONS
=
GIMMICKY DETALJER

34. MORGENBOOSTER
LOOPS AND MODES

35. MORGENBOOSTER
MODES
METAREGLERNE
> SETTING MODE – SPECIFICER,
HVORDAN DIN MICROINTERACTION
SKAL VÆRE
> SPRING LOADED MODE
> ON/OFF MODES – OFTE EN
TRIGGER – MEN F.EKS OGSÅ DOBBELT
TAB I IOS FOR AT COPY/PASTE

36. MORGENBOOSTER
LOOPS AND MODES
LOOP - EN CYKLUS, DER
GENTAGER SIG
> HENT DATA HVERT 30. SEKUND
> SEND EN REMINDER OM 5 DAGE
> HVAD SKER DER NÅR DU VENDER
TILBAGE ANDEN GANG? 100. GANG?

37. MORGENBOOSTER
STRUKTUR – OG OPSKRIFT PÅ SUCCESFULD MICROINTERACTION

38. MORGENBOOSTER
EXERGI
SOLCELLE APP

39. MORGENBOOSTER
FOR AT KUNNE REGNE DET UD, SKAL DU BRUGE TRE DATASÆT
LÆNGDE OG
BREDDE
HÆLDNING OG
RETNING
BILLEDE AF
SOLCELLERNES
”UDSIGT”

40. MORGENBOOSTER
MÅL: TAGE BILLEDE VED
DEN RETTE RETNING OG
HÆLDNING
DET VED VI…
> FUNKTIONALITET KØRER I
BROWSEREN
> KAMERAET LIGGER ”OVENPÅ”

41. MORGENBOOSTER
DET PRØVEDE VI
> FLERE FOTOS - LÆS METADATA
> BEVÆG KAMERAET OG FIND DET
RETTE BILLEDE UD FRA DETTE
> FORTÆL MIG, NÅR JEG SKAL TAGE
BILLEDET

42. MORGENBOOSTER
KOM I GANG MED AT
TÆNKE
MICROINTERACTIONS

43. MORGENBOOSTER
KOM I GANG
1. DESIGN EN KOMPLET
MICROINTERACTION

44. MORGENBOOSTER

45. MORGENBOOSTER
KOM I GANG
2. GØR EN ALLEREDE
EKSISTERENDE
MICROINTERACTION
ENGAGERENDE

46. MORGENBOOSTER
SPØRG
> HVILKET PROBLEM SKAL DET LØSE?
> STARTER JEG FRA SCRATCH? HVAD VED JEG ALLEREDE OM BRUGEREN?
> HVAD ER DEN CENTRALE DATA OG KAN DEN SYNLIGGØRES FOR
BRUGEREN?
> VIL EN SPECIALDESIGNET KONTROL VÆRE PÅ SIN PLADS?
> UNDGÅR JEG MENNESKELIGE FEJL?
> ER TEKST OG IKON MENNESKEVENLIGE? LYDER TEKSTEN SOM NOGET
MAN VILLE SIGE HØJT?
> GIVER DET MENING AT TILFØJE EN ANIMATION FOR AT GØRE DET
MINDRE STATISK?
> GIVER DET MENING AT TILFØJE ANDRE FEEDBACKKANALER? LYD ELLER
HAPTISK?
> HVAD SKER DER, NÅR BRUGEREN KOMMER TILBAGE TIL
INTERAKTIONEN FOR ANDEN GANG? ELLER FOR 100. GANG?

47. MORGENBOOSTER
KOM I GANG
3. GØR EN
MICROINTERACTION
IDENTITETSBÆRENDE
- TIL ET SIGNATURE
MOMENT

48. MORGENBOOSTER
IDENTIFICER
MICROINTERACTIONS OG
POTENTIELLE SIGNATURE
MOMENTS
> HVOR NEM SKAL INTERAKTIONEN
VÆRE AT HUSKE? JO LETTERE AT
HUSKE, JO RIGERE FEEDBACK OG
KONTROLLER (MÅSKE
SPECIALDESIGNEDE)
> SPØRG DIG SELV: ER DET HER ET
SIGNATURE MOMENT?
> 90% AF TIDEN ER SVARET NEJ!

49. MORGENBOOSTER
ØVELSE: PEAKS AND VALLEYS

50. MORGENBOOSTER

51. MORGENBOOSTER
KOM I GANG
4. FORETAG EN
KONKURRENTVURDERING OG
IDENTIFICER
POTENTIALER

52. MORGENBOOSTER
HVOR MEGEN LIGHED ER
DER MELLEM
PRODUKTERNE?
> ER INTERAKTIONERNE DE SAMME?
> IDENTIFICER, HVOR EN
MICROINTERACTION KUNNE GØRE EN
FORSKEL I BRUGEROPLEVELSEN
> HVILKE MICROINTERACTIONS KAN
FORBEDRES IFT. TIL KONKURRENTEN?
> HVILKE IRRITATIONSMOMENTER ER
DER HOS KONKURRENTEN?

53. MORGENBOOSTER
KOM I GANG
5. PROTOTYPE PÅ
PLATFORMEN

54. MORGENBOOSTER
5. PROTOTYPE MICROINTERACTION PÅ PLATFORMEN
BARE GØR DET – TRIAL AND ERROR
>
>
>
>
>
>
>
AFPRØV TESER - VI ER NØDT TIL AT TESTE
NØDT TIL AT FORNEMME DET
INGEN ABSOLUT VIDENSKAB
KAN FØRST RIGTIGT VURDERES, NÅR MAN SIDDER MED DET
START MED AT SNIGE EN VELDESIGNET MICROINTERACTION IND
DEN VIL SMITTE AF PÅ ANDRE MICROINTERACTIONS
MVP – MINIMUM VIABLE PRODUCT PERMISSION

55. MORGENBOOSTER
EN LILLE ØVELSE TIL AT STARTE PÅ ALLEREDE I DAG
HVILKEN MICROINTERACTION KUNNE TRIGGES, NÅR DU VENDER DIT DEVICE?

56. MORGENBOOSTER
GLÆDELIG JUL

57. MORGENBOOSTER
1508 JULEKUGLE

58. MORGENBOOSTER
DET ER IKKE GRATIS, MEN DET KAN GØRE EN KÆMPE FORSKEL
TÆNK SMÅT
DET KAN
ÆNDRE VERDEN

59. MORGENBOOSTER
RESSOURCER

60. MORGENBOOSTER
RESSOURCER

61. TAK FOR I DAG
NÆSTE MORGENBOOSTER
DIGITAL STRATEGI TOOLKIT
D. 22. JANUAR 2014

62. MORGENBOOSTER
DEFINITION
EN MICROINTERACTION
ER ET LILLE STYKKE
FUNKTIONALITET, DER
GØR ÉN TING OG HAR ÉN
USE CASE.
MODSAT FEATURES ER
MICROINTERACTIONS
ENKLE, KORTE OG
UBESVÆREDE.

63. MORGENBOOSTER
FILOSOFI
1.
CASE BY CASE
>IDENTIFICER MULIGE
MICROINTERACTIONS OG FOKUSER
PÅ DEM INDIVIDUELT
2.
REDUCÉR ET KOMPLEKST
>REDUCER KOMPLICERET
PRODUKT TIL
FEATURE TIL EN KERNEENKELSTÅENDE PRODUKTER MICROINTERACTION
BYGGET OMKRING EN
MICROINTERATION
3.
SE KOMPLEKSE PRODUKTER >BEHANDEL EN FEATURE SOM ET
SOM EN HARMONI AF
SÆT AF SAMMENKÆDEDE
MICROINTERACTIONS, DER MICROINTERACTIONS
SPILLER SAMMEN