morgenbooster / microinteractions

MICROINTERACTIONS DJÆVLEN I DETALJEN LOUISE KLINKER, SENIOR UX DESIGNER

SØREN SIGFUSSON, SENIOR INTERFACE DEVELOPER

MORGENBOOSTER

MORGENBOOSTER

MORGENBOOSTER

MAJOR FAIL ELLER SIGNATURE MOMENT

MORGENBOOSTER

“THE DETAILS ARE NOT THE DETAILS. THEY MAKE THE DESIGN”

Charles Eames

MORGENBOOSTER

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

MORGENBOOSTER

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

MORGENBOOSTER

…ELLER SOM EN APP DESIGNET OMKRING EN ENKELT MICROINTERACTION

MORGENBOOSTER

DEFINITION

MORGENBOOSTER

STRUKTUR

MORGENBOOSTER

STRUKTUR – OG OPSKRIFT PÅ SUCCESFULD MICROINTERACTION

MORGENBOOSTER

TRIGGER

MORGENBOOSTER

TRIGGER

MORGENBOOSTER

TRIGGER

MANUEL TRIGGER

> ER BRUGERINITIERET

> EN KONTROL

> ET IKON

> EN FORM

> STEMME, BERØRING ELLER GESTUS

SYSTEM TRIGGER

> ET SÆT BETINGELSER ER OPFYLDT

> LOKATION

> INDGÅENDE DATA (3 NYE MAILS)

> ANDRE MICROINTERACTIONS

> ANDRE MENNESKER (REPOST ETC.)

> FEJL

MORGENBOOSTER

GØR DATA SYNLIG

MORGENBOOSTER

RULES

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

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

MORGENBOOSTER

FJERN KOMPLEKSITET MED BEGRÆNSEDE VALGMULIGHEDER OG SMARTE DEFAULTS

MORGENBOOSTER

ENKELHED I RULES

MORGENBOOSTER

Indholdsslide:

Almindelig

indholdsside med

stort element

RULES

MORGENBOOSTER

DONT START FROM ZERO

RULES

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?

MORGENBOOSTER

UNDGÅ MENNESKELIGE FEJL

RULES

MORGENBOOSTER

RULES

MORGENBOOSTER

RULES

MORGENBOOSTER

FEEDBACK

MORGENBOOSTER

FEEDBACK

TYPER

> VISUEL

> ANIMATION

> BESKEDER

> AUDIO

> HAPTISK – BEVÆGELSE

> LYS

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

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.

MORGENBOOSTER

FEEDBACK

MORGENBOOSTER

MICROINTERACTIONS = GIMMICKY DETALJER

MORGENBOOSTER

LOOPS AND MODES

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

MORGENBOOSTER

LOOPS AND MODES

MORGENBOOSTER

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?

STRUKTUR – OG OPSKRIFT PÅ SUCCESFULD MICROINTERACTION

MORGENBOOSTER

EXERGI SOLCELLE APP

MORGENBOOSTER

FOR AT KUNNE REGNE DET UD, SKAL DU BRUGE TRE DATASÆT

MORGENBOOSTER

LÆNGDE OG

BREDDE

HÆLDNING OG

RETNING

BILLEDE AF

SOLCELLERNES

”UDSIGT”

MÅL: TAGE BILLEDE VED DEN RETTE RETNING OG HÆLDNING

DET VED VI…

> FUNKTIONALITET KØRER I BROWSEREN

> KAMERAET LIGGER ”OVENPÅ”

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

MORGENBOOSTER

KOM I GANG MED AT TÆNKE MICROINTERACTIONS

MORGENBOOSTER

1. DESIGN EN KOMPLET MICROINTERACTION

KOM I GANG

MORGENBOOSTER

MORGENBOOSTER

2. GØR EN ALLEREDE EKSISTERENDE MICROINTERACTION ENGAGERENDE

KOM I GANG

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?

MORGENBOOSTER

3. GØR EN MICROINTERACTION IDENTITETSBÆRENDE - TIL ET SIGNATURE MOMENT

KOM I GANG

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!

MORGENBOOSTER

ØVELSE: PEAKS AND VALLEYS

MORGENBOOSTER

MORGENBOOSTER

4. FORETAG EN KONKURRENT- VURDERING OG IDENTIFICER POTENTIALER

KOM I GANG

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?

MORGENBOOSTER

5. PROTOTYPE PÅ PLATFORMEN

KOM I GANG

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

MORGENBOOSTER

Indholdsslide:

Almindelig

indholdsside med

stort element

EN LILLE ØVELSE TIL AT STARTE PÅ ALLEREDE I DAG

HVILKEN MICROINTERACTION KUNNE TRIGGES, NÅR DU VENDER DIT DEVICE?

MORGENBOOSTER

GLÆDELIG JUL

MORGENBOOSTER

1508 JULEKUGLE

MORGENBOOSTER

TÆNK SMÅT DET KAN ÆNDRE VERDEN

DET ER IKKE GRATIS, MEN DET KAN GØRE EN KÆMPE FORSKEL

MORGENBOOSTER

RESSOURCER

MORGENBOOSTER

RESSOURCER

MORGENBOOSTER

Blank slideTAK FOR I DAG

NÆSTE MORGENBOOSTER

DIGITAL STRATEGI TOOLKIT

D. 22. JANUAR 2014

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.

MORGENBOOSTER

FILOSOFI

1. CASE BY CASE

2. REDUCÉR ET KOMPLEKST

PRODUKT TIL

ENKELSTÅENDE PRODUKTER

BYGGET OMKRING EN

MICROINTERATION

3. SE KOMPLEKSE PRODUKTER

SOM EN HARMONI AF

MICROINTERACTIONS, DER

SPILLER SAMMEN

>IDENTIFICER MULIGE

MICROINTERACTIONS OG FOKUSER

PÅ DEM INDIVIDUELT

>REDUCER KOMPLICERET

FEATURE TIL EN KERNE-

MICROINTERACTION

>BEHANDEL EN FEATURE SOM ET

SÆT AF SAMMENKÆDEDE

MICROINTERACTIONS

MORGENBOOSTER