Kako dizajnirati mikro-interakcije jednim dodirom
Mikrointerakcije su "tajni umak" zbog kojeg aplikacije i web stranice blistaju za korisnike. Ovi sitni detalji olakšavaju postavljanje alarma, pritisnite gumb ili jednostavno bolje razumijete kako raditi s digitalnim proizvodom.
Tajna je u tome da su najbolje mikro-interakcije elementi o kojima korisnik vjerojatno ni ne razmišlja. To se događa u trenu - često samo jednim dodirom na zaslonu mobilnih uređaja. Unatoč maloj prirodi interakcije, odatle i „mikro“, za korisnike je to ogromna vrijednost jer se ti angažmani sve više integriraju u svakodnevnu aktivnost.
Kako dizajnirate mikro-interakcije jednim dodirom koje će oduševiti korisnike? Evo nekoliko ideja.
Istražite elemente Envatoa
Animirajte gumb
Sjećate li se prvi put da ste primijetili Facebook poput Messengera? Dotaknuli ste ikonu "palac gore" i ona je u kutiji narastala osobi s kojom ste razgovarali. Je li vas nasmijalo? Je li vam to malo pokreta poklonilo?
Jednostavna animacija, prije nego što je dodirne da bi je potaknuo ili nakon dodirivanja da se pokaže mikrointeracija, siguran je način stvaranja nečega što korisnici žele dodirnuti. Male animacije pružaju informacije o tome što se događa kako bi se korisnici osjećali ugodno i sigurni u svoju ulogu u povratnoj petlji.
nemoj
Animacija bi trebala biti jednostavna kao i sama mikrointerakcija. Neka pokreti budu jednostavni i tečni i, brzo započnite i završite. Dodavanje ocjene na IMDb slijedi ovo načelo; zadržite pokazivač iznad ocjena i brzo pogledajte broj zvjezdica koje ćete dodati dok prelazite iznad svake. Dodirnite za klik da biste dovršili i potvrdili radnju.
Navedite opcije
To je lekcija u UX-u koja se vraća u ljubavna pisma škole i vrtića. Da li ti se sviđam? Provjerite da ili ne.
Velike mikro-interakcije mogu se konstruirati korištenjem istog koncepta. Dajte korisnicima dva brza izbora. Kucnite za pokretanje (ili zaustavljanje) akcije; dodirnite za prebacivanje. Korisnici žele donositi odluke i osjećati kontrolu nad digitalnim iskustvima, ali ne žele biti obasjani višestrukim ekranima kako bi došli.
Stvorite trenutno djelovanje
Najbolji način da osigurate da korisnici komuniciraju s vašom mikro-interakcijom? Rezultat bi trebao biti neposredan. Željeni rezultat treba:
- Dogodi se jednim dodirom
- Obavite željenu radnju u roku od 0, 1 sekunde
Neposrednost mikro-interakcija od ključne je važnosti za njihov uspjeh. Budući da je priroda ovih elemenata mala, svako kašnjenje u djelovanju nervirat će korisnike. (Pomislite samo koliko bi bilo frustrirajuće ako bi za uključivanje alarma bilo potrebno tri dodira da biste isključili alarm ili ako je tijekom sastanka bilo 2 sekunde kašnjenja da utišate zvona.)
Brzo prebacivanje između sličnog (ili za razliku od) ili praćenja na Instagramu je savršen primjer. Toliko brzo treba da bude vaša mikrointerakcija.
Dizajn za ponavljanje
Jedna od stvari koja mikrointerakciju razlikuje od nekih drugih interaktivnih elemenata u vašem korisničkom sučelju jest ta što će se one koristiti iznova i iznova. Mikrointerakcije obično nisu osmišljene za jednokratnu upotrebu. (Koliko ste puta u posljednjih sat vremena pritisnuli gumb na Instagramu u obliku srca?)
Dizajn za ovu ponavljajuću radnju, ali radnja se ne bi trebala osjećati kao ponavljajući pokret. Iako bi to moglo zvučati puno zauzeti, to se svodi na intuitivnu prirodu slavine. Je li očito i prirodno? Ako korisnik ne mora razmišljati o radnji, nikad ga neće ponoviti da se dovršava.
Korištenje općeprihvaćenih korisničkih obrazaca, animacija i stilova ikona pomoći će vam u usmjeravanju načina na koji oblikujete mikro interakcije. Ovdje ne izumite kotač; korisnicima olakšavaju izvršavanje zadataka jednim dodirom i bez potrebe da grebete po glavi kako to učiniti.
Učinite ga čitljivim i ugodnim za odmor
Evo koraka koji se prečesto zaboravlja - upute unutar mikro-interakcija moraju biti čitljive i prenosive.
Čitav se odnosi na bilo koji tekst ili upute koje se odnose na mikrointerakciju. Riječi moraju biti lako vidljive i skenirane. Iz perspektive dizajna, odabir dobrog slova i osiguravanje dovoljno mjesta oko riječi i obilje kontrasta između slova i pozadine su ključni. Držite se dalje od kondenziranih, tankih ili novitetnih slova koje nije lako pročitati na prvi pogled.
Relatable se odnosi na tekst koji čita na isti način na koji ljudi razgovaraju. Treba izbjegavati neuobičajeni jezik ili neugodno fraziranje. Upute unutar polja obrazaca koje nestaju kada korisnik počne tipkati sjajan je primjer. To je osobito istinito kada se u izrazu upotrebljava ton ili glas koji korisnik očekuje od marke ili web stranice s kojom komunicira.
Usredotočite se na detalje
Mikrointerakcija je jedan od mnogih detalja u dizajnu koji će činiti vaše sučelje. Sa svakom od njih trebate posebno paziti.
Mikrointerakcije bi se trebale osjećati kao dio cjelokupnog dizajna. Ali o tim sitnim radnjama morate razmišljati i na druge načine. Od izbora boja do veličine elemenata s kojima korisnik treba komunicirati, ti će detalji potaknuti djelovanje ili nagnati korisnike da odustanu od dizajna zbog nečeg drugog.
Kao i kod bilo kojeg drugog dizajnerskog elementa, stvorite skup stila i pravila dizajna za mikro-interakcije unutar aplikacije ili web stranice tako da radnje budu dosljedne u cijelom dizajnu i korisnicima je lako naći i surađivati. Što sitniji element - ili interakcija - to postaju važniji detalji.
Neka bude jednostavno
Izgovoriti to milijun puta nije dovoljno - neka bude jednostavno. Postoji jednostavno previše dizajna koji su previše teški za upotrebu. Možda mislite da je to u redu, ali korisnici neće. Vole predvidljivost, dosljednost i jednostavnost.
Jednostavnije je komunicirati s nečim što je vjerojatnije da će korisnici zapravo dodirnuti gumb. Zato su radnje jednim dodirom tako važne. Kako možete znati je li vaš dizajn dovoljno jednostavan? Potrebna je definirana struktura s petljom za povratne informacije za radnje, jednostavne upute i vizualne prikaze te poruka koja se komunicira jasno i lako je razumljiva.
Ne prestaj se razvijati
Projektiranje mikrointerakcija evolucijski je proces. Budući da je ovo takav novi koncept, stalno se mijenja. Postoje nove ideje i novi načini za stvaranje nečega što korisnici žele dodirnuti.
Ostanak na tragu evolucije mikro-interakcija vraća se na osnove koje je Dan Saffer prvi definirao. (Napisao je i jednu od najautoritativnijih knjiga o temi, „Mikrointerakcije: Dizajn s detaljima.“) Mikrointerakcije uključuju proces u četiri koraka koji započinje akcijom pokretanja, pravila kako interakcija funkcionira, povratnu petlju tako da korisnik zna nešto se dogodilo i petlje i načini koji diktiraju kako će funkcionirati buduće interakcije ili što slijedi. Imajte to na umu i vi ćete biti na putu uspjeha mikrointerakcije.
Zaključak
Postoji puno komada koji mogu dizajnirati tako malo. Dakle, nemojte misliti da u pet minuta možete stvoriti mikro-interakciju i krenuti dalje. Dizajn mikro interakcije posebno uzima u obzir i planira.
Zapamtite, najbolje mikro-interakcije uglavnom rade jednim dodirom i elementi su s kojima korisnici ni ne razmišljaju da se bave, iako se redovno događaju.
