Jak navrhnout jednorázové mikrointerakce
Mikrointerakce jsou „tajnou omáčkou“, která uživatelům a aplikacím dává lesk. Tyto drobné detaily usnadňují nastavení budíku, stisknutí tlačítka nebo jednoduše porozumění tomu, jak pracovat s digitálním produktem.
Tajemství je, že nejlepší mikrointerakce jsou prvky, na které uživatel pravděpodobně ani nepřemýšlí. Stávají se v okamžiku - často jediným klepnutím na mobilní obrazovku. Navzdory malé povaze interakce, tedy „mikro“, je hodnota pro uživatele nesmírná, protože tyto závazky se více integrují do každodenní činnosti.
Jak navrhujete jednorázové mikrointerakce, které potěší uživatele? Zde je několik nápadů.
Prozkoumejte prvky Envato
Animujte tlačítko
Pamatujete si, jak jste si poprvé všimli Facebooku jako v Messengeru? Poklepali jste na ikonu „palec nahoru“ a ta se v poli rozrostla na osobu, se kterou jste chatovali. Líbilo se vám usmívat se? Dalo vám to trochu pohybu trochu potěšení?
Jednoduchá animace, než ji klepnete na její povzbuzení nebo poté, co se ukáže, že mikrointerakce funguje, je jistým způsobem, jak vytvořit něco, co uživatelé chtějí klepnout. Malé animace poskytují informace o tom, co se děje, takže uživatelé se cítí pohodlně a sebevědomě o svých rolích ve zpětné vazbě.
Ne
Animace by měla být stejně jednoduchá jako samotná mikrointerakce. Udržujte pohyby jednoduché a plynulé a rychlé startování a dokončení. Přidání hodnocení na IMDb se řídí tímto principem; najeďte kurzorem nad hodnocení a rychle uvidíte počet hvězd, které můžete přidat, když se budete pohybovat po každé z nich. Klepnutím klepnutím dokončíte a potvrďte akci.
Poskytněte možnosti
Je to lekce v UX, která se vrací do milostných dopisů do škol a mateřských škol. Máš mě rád? Zkontrolujte ano nebo ne.
Skvělé mikrointerakce mohou být navrženy pomocí stejného konceptu. Poskytněte uživatelům dvě rychlé volby. Klepnutím zahájíte (nebo zastavíte) akci; klepnutím přepínáte. Uživatelé se chtějí rozhodovat a cítit se pod kontrolou nad digitálními zážitky, ale nechtějí být zablokováni několika obrazovkami, aby se tam dostali.
Vytvořit okamžitou akci
Nejlepší způsob, jak zajistit, aby uživatelé interagovali s vaší mikrointerakcí? Výsledek by měl být okamžitý. Požadovaný výsledek by měl:
- Stane se jediným klepnutím
- Proveďte požadovanou akci do 0, 1 sekundy
Bezprostřednost mikrointerakce je pro jejich úspěch nezbytná. Protože povaha těchto prvků je malá, jakékoli zpoždění v akci uživatele obtěžuje. (Jen si pomyslete, jaké by to bylo frustrující, kdyby vypnutí alarmu trvalo tři poklepání nebo kdyby při hovoru během hovoru došlo ke zpoždění hovoru o 2 sekundy.)
Rychlý přepínání mezi podobným (nebo na rozdíl od) nebo následováním na Instagramu je perfektním příkladem. Tak by měla být vaše mikrointerakce rychlá.
Design pro opakování
Jednou z věcí, která odlišuje mikrointerakce od některých jiných interaktivních prvků ve vašem uživatelském rozhraní, je to, že budou použity znovu a znovu. Mikrointerakce obvykle nejsou určeny k jednorázovému použití. (Kolikrát jste v poslední hodině klepnul na tlačítko ve tvaru srdce jako Instagram?)
Design pro tuto opakující se akci, ale akce by se neměla cítit jako opakující se pohyb. I když to může znít jako hodně, aby se dovnitř, jde o intuitivní povahu kohoutku. Je to zřejmé a přirozené? Pokud uživatel nemusí myslet na akci, nikdy ji nebude opakovat.
Způsob, jakým navrhujete mikrointerakce, pomůže běžně přijímané uživatelské vzory, animace a styly ikon. Zde znovu nevynalézejte kolo; usnadňují uživatelům plnění úkolů jediným klepnutím a aniž by museli poškrábat hlavu nad tím, jak to udělat.
Ať je to čitelné a relativní
Tady je krok, který se příliš často zapomíná - pokyny uvnitř mikrointerakce musí být čitelné a relativní.
Čitelné se vztahuje na jakýkoli text nebo pokyny, které se vztahují k mikrointerakci. Slova musí být snadno viditelná a skenovatelná. Z hlediska designu jsou klíčové výběr dobrého písma a zajištění dostatečného prostoru kolem slov a dostatečného kontrastu mezi nápisy a pozadím. Drž se dál od zhuštěných, tenkých nebo novodobých typů písma, které nejsou snadno čitelné na první pohled.
Relatable označuje text, který čteme stejným způsobem, jak lidé mluví. Měli byste se vyhnout neobvyklému jazyku nebo nevhodnému frázování. Pokyny uvnitř polí formuláře, které zmizí, když uživatel začne psát, jsou skvělým příkladem. To platí zejména v případě, že formulace používá tón nebo hlas, který uživatel očekává od značky nebo webu, se kterým komunikují.
Zaměřte se na podrobnosti
Mikrointerakce je jedním z mnoha konstrukčních detailů, které vytvoří vaše rozhraní. S každou z nich musíte věnovat zvláštní pozornost.
Mikrointerakce by se měly cítit jako součást celkového návrhu. Ale o těchto drobných akcích musíte přemýšlet i jinými způsoby. Od výběru barev až po velikost prvků, se kterými musí uživatel interagovat, tyto podrobnosti povzbudí akci nebo způsobí, že uživatelé opustí návrh na něco jiného.
Stejně jako u jakéhokoli jiného konstrukčního prvku vytvořte sadu stylů a návrhových pravidel pro mikrointerakce v aplikaci nebo na webových stránkách, aby akce byly v celém designu konzistentní a uživatelé snadno našli a mohli s nimi pracovat. Čím jemnější je prvek - nebo interakce - tím důležitější detaily se stávají.
Zachovejte to jednoduše
Říkat to milionkrát nestačí - udržujte to jednoduché. Existuje jen příliš mnoho vzorů, které je příliš obtížné používat. Možná si myslíte, že je to v pohodě, ale uživatelé ne. Mají rádi předvídatelnost, důslednost a jednoduchost.
Čím snazší je interakce s něčím, čím je pravděpodobnější, že uživatelé skutečně klepnou na tlačítko. Proto jsou jednorázové akce tak důležité. Jak víte, zda je váš návrh dostatečně jednoduchý? Vyžaduje definovanou strukturu se zpětnou vazbou pro akce, jednoduché pokyny a vizuální prvky a zprávu, která je jasně komunikována a je snadno srozumitelná.
Nepřestávejte se vyvíjet
Navrhování mikrointerakcí je evoluční proces. Protože se jedná o nový koncept, neustále se mění. Existují nové nápady a nové způsoby, jak vytvořit něco, co uživatelé chtějí klepnout.
Zůstaňte na stopě s vývojem mikrointerakcí se vrací k základům, které Dan Saffer poprvé definoval. (Napsal také jednu z nejvíce autoritativních knih na toto téma, „Mikrointerakce: Návrh s podrobnostmi.“) Mikrointerakce zahrnují čtyřkrokový proces začínající spouštěcí akcí, pravidla pro to, jak interakce funguje, zpětná vazba, takže uživatel ví, něco se stalo a smyčky a režimy, které určují, jak budou budoucí interakce fungovat nebo co přijde dál. Mějte na paměti, že budete na cestě k úspěchu mikrointerakce.
Závěr
Existuje mnoho kusů na navrhování něčeho tak malého. Takže si nemyslete, že můžete vytvořit mikrointerakci za pět minut a jít dál. Navrhování mikrointerakce vyžaduje zvláštní pozornost a plánování.
Nezapomeňte, že nejlepší mikrointerakce obvykle pracují s jediným klepnutím a jsou prvky, s nimiž uživatelé ani neuvažují o zapojení, i když budou pravidelně.
