"De bedste produkter gør to ting godt: funktioner og detaljer. Funktioner er, hvad trækker folk til dit produkt; detaljer er hvad holde dem der ", siger Dan Saffer. Betydningen af ​​detaljer kan ikke overbelastes. Detaljer gør brugere elsker eller hader en app eller et websted. Mikrointeraktioner er disse detaljer. De kan let overses i den globale designordning, men de holder faktisk hele oplevelsen sammen.

I denne artikel forklarer jeg, hvad der er en mikrointeraktion, hvorfor de er vigtige og giver nogle gode eksempler.

Hvad er en mikrointeraktion

Mikrointeraktioner er subtile momenter centreret omkring at udføre en enkelt opgave. Næsten alle applikationer omkring os er udfyldt med mikrointeraktioner.

Det mest kendte eksempel på en mikrointeraktion har eksisteret længe før computere nogensinde blev opfundet. On / off-kontakten er ofte den første mikrointeraktion, folk møder med et produkt.

Nogle andre eksempler på specifikke mikrointeraktioner omfatter:

  • Vibrationsmeddelelsen sammen med lydmodusikonet vises, når du skifter en iPhone til at slå af.
  • Det pull-to-refresh UI-mønster. Ved at forbinde brugerens ønske om at finde mere indhold med forfriskningens virkning bliver erfaringen mere sømløs.

pull-down-refresh-iphone-app-grænseflade-UX-design-ramotion
Billedkredit: Ramotion

  • Den 'lignende' knap på sociale netværk, der fremhæver ændringer ved hjælp af interaktive animationer. Sådan tilbagemelding informerer brugerne om, at de er på listen over dem, der kunne lide posten.

fueled-07032014-cb_2x
Billedkredit: Dribbble

Hvorfor arbejder de

Kort sagt forbedrer mikrointeraktioner UX ved at gøre brugergrænsefladen mindre maskin og mere menneskelig. Mange gange tænker vi på udseendet og hvordan det relaterer til design. Når vi tænker på mikrointeraktioner, udgør de stort set en balance, hvordan brugerne føler sig om produktet, tjenesten eller mærket. Mikrointeraktioner finjusterer menneskets centreret design ved:

  • Tilbyd øjeblikkelig feedback - Visuel feedback appellerer til brugerens naturlige ønske om anerkendelse. Brugeren ved straks, at deres handling blev accepteret, og de vil være glade for en visuel belønning.
  • Fungerer som facilitatorer for interaktion - Mikrointeraktioner har beføjelse til at opmuntre brugerne til faktisk at interagere. De kan lede brugere i, hvordan man arbejder med appen.
  • Medbring glæde - Mikrointeraktioner er den perfekte chance for en lille ekstra glæde i designet uden at forringe hovedoplevelsen.

Ekstra fordele

Fordi mikrointeraktioner er korte af natur, skal de være konstrueret til gentagen brug. Veldesignede mikrointeraktioner kan skabe:

Habitløkke

Mikrointeraktioner er nøgleelementerne i vaneløkker. Vaner dannes, når folk udfører de samme handlinger gentagne gange. Typisk vanesløkke består af tre elementer:

  1. Cue - Trigger der initierer handling
  2. Rutinemæssigt - Som svar på køen udfører du en handling
  3. Belønning - En fordel du får fra at fuldføre rutinen, grund til at gennemføre handling

Jo stærkere belønningen er, jo mere stærkere bliver vanen.

Facebooks anmeldelse om ny venneforespørgsel er et godt eksempel på vane sløjfe: rødt badge og hvidt ikon ( cue ) indikerer, at der er en ny anmodning, som gør at brugeren klikker på ikonet ( rutine ) for at se oplysninger om personen ( belønning ). Efter et stykke tid klikker brugerne automatisk på ikonet, når de ser det røde badge.

Signatur øjeblikke

Hvis det gøres godt, kan mikrointeraktioner være signaturmomenter, som øger kundeloyaliteten. Signatur øjeblikke er mikrointeraktioner, der er blevet forhøjet for at være en del af mærket. Tænk på Facebook's Like-knappen. Det bliver en naturlig del af Facebook-grænsefladen. Hvis Facebook pludselig fjerner denne funktion, vil brugerne bemærke det og vil tro at appen er brudt.

Identifikation af muligheder

En del af skønheden i mikrointeraktioner er, at de kan indsættes på en række steder omkring enhver mulig handling. Mikrointeraktioner er gode for:

Fremhævning ændrer sig

Mikrointeraktioner kan lede brugerens opmærksomhed . I mange tilfælde bruges animationer til at tiltrække brugernes opmærksomhed på vigtige detaljer (dvs. meddelelser).

notification_animation03
Billedkreditter: Dribbble

Minimere brugerindsats

Autofuldførelse er et godt eksempel på mikrointeraktion. Typing har høj interaktionsomkostning; Det er fejlagtigt og tidskrævende selv med et fuldt tastatur (og endnu mere på en berøringsskærm). Autofuldførelse hjælper brugeren med at give det rigtige svar hurtigere og uden typografiske fejl. Når du skriver hvert brev, vil systemet gøre sit bedste gæt om de ord, du forsøger at finde.

fancy
Billedkreditter: fancy.surge.sh

Tilbagemelding for at vise, hvad der er opnået

Mikrointeraktioner kan forstærke de handlinger, en bruger udfører. Ved at følge princippet " show, do not tell" , kan du bruge animeret feedback til at vise, hvad der er opnået. I Stripes eksempel , når brugeren klikker "Pay", vises en spinner kort før appen viser successtaten. Checkmark animation får brugeren til at føle, at de nemt gjorde betalingen og brugerne værdsætte sådanne vigtige detaljer.

Giv statusoplysninger

Det første brugervenlige heuristiske princip af Jakob Nielsen siger: Systemet bør altid holde brugerne informeret om, hvad der sker. Indtastningsindikator i chat er et godt eksempel på mikrointeraktioner, der giver statusoplysninger. Den vises på din vennes skærm, mens du komponerer en besked i chat.

maskinskrivning
Billedkreditter: Dribbble

Valider brugerdata

En af de vigtigste og ofte oversete aspekter af formdesign er fejlhåndtering . Det er menneskets natur at lave fejl, og din form er sandsynligvis ikke fritaget for menneskelig fejl. Brugere kan ikke lide, når de går igennem processen med at udfylde en formular kun for at finde ud af ved indsendelse, at de har lavet en fejl. Det er her, hvor validering mikrointeraktion spiller det er en del i en brugervenlig form. Real-time inline validering informerer straks brugere om rigtigheden af ​​de leverede data. Denne tilgang giver brugerne mulighed for at rette fejlene, de foretager hurtigere, uden at skulle vente, indtil de trykker på knappen Submit for at se fejlene. Når det er gjort rigtigt, kan det gøre en tvetydig interaktion til en klar.

form_validation

credits: Dribbble

Konklusion

Design er i detaljerne. Selv mindre detaljer fortjener nøje opmærksomhed, fordi alle disse små øjeblikke udgør følelsen, de kommer sammen for at danne et smukt holistisk produkt.

"Forskellen mellem de produkter, vi elsker og de, vi simpelthen tolererer, er ofte de mikrointeraktioner, vi har med dem." - Dan Saffer

Hvis du er interesseret i brugeroplevelse, skal du være interesseret i mikrointeraktioner. Fordi dit produkt kun er så godt som den mindste mikrointeraktion, som folk har med det.