Jak analyzovat použitelnost z pohybu

Jako návrhář UX máte tři zásadní nevýhody, pokud jde o analýzu pohybu pro použitelnost.

  1. Statické - trénovali jste mozek v průběhu let, abyste viděli design jako něco, co se nepohybuje. V tomto článku vám pomůžu trénovat váš mozek, aby viděl design, jak se to stane v čase.
  2. Načasování - opravdu dobré interakce založené na pohybu nastávají rychle. Jsou navrženy tak, aby byly dokonale plynulé. Je těžké najít pět současně působících UX v pohybových principech, které se hrají za půl sekundy.
  3. Slovní zásoba - chybí vám základní slovní zásoba, která vám umožní porozumět tomu, co vidíte. Můžete překonat problém jedna a dva, ale pokud nemáte slovní zásobu, máte naprosto štěstí.

Naštěstí jsem pro vás vyřezal 3 měsíce svého života a vyrobil řezivo Creating Usability with Motion: The UX in Motion Manifesto, které v prvních 4 týdnech jeho vydání shromáždilo téměř 120 000 zhlédnutí.

V tomto článku se chystáme spojit několik dalších kusů dohromady. Nejdříve však krátká odbočka.

Najdu lidi jako poněkud znepokojující zvířata. Baví mě sledovat nekódované pouliční boje na YouTube, abych podpořil mé potvrzení zaujatosti. Po několika letech jsem si začal všímat věcí, které se v pouličním boji dělají obrovským způsobem. Příležitosti k de eskalaci jsou jedna. Sledování vašich šesti (nebo zad), další. Velikost a dovednost ne vždy diktují výsledek. Naštěstí to dělá velký rozdíl (jak strašidelné je to?). Věci podobné.

Postupem času jsem si vytvořil oko na zlomek sekundových událostí na videu. Pomůže mi to v reálném pouličním boji? Pravděpodobně ani trochu. Pomůže mi to však analyzovat peklo z rychle se pohybujícího uživatelského rozhraní. Navíc jsem analyzoval pohyb v uživatelských zkušenostech po lepší část patnácti let.

Pojďme analyzovat tuto chutnou malou nugget sestavenou panem Charlesem Pattersonem.

Kredit: Charles Patterson za InVision

Ve zbývající části tohoto článku vás upozorním na pět způsobů, jak je použitelnost vytvářena pohybem, pomocí následujících principů UX v pohybu: Paralaxa, maskování, ofset a zpoždění, překrytí a uvolnění.

Hraje se zjevně více principů, ale prozatím se na těchto pět zaměříme.

V některých ohledech, analýza pohybu pro použitelnost zahrnuje spoustu šilhání a nehledání. Důvodem je, že lidské oko je zcela uneseno nejrůznějšími věcmi. Barva, tváře, tvary, kontrast, holá kůže a ano, pohyb. Abyste mohli správně „číst pohyb“, musíte začít trénovat své oko, aby nerozptylovalo váš mozek (jsem poetický - vaše oko je pouze snímacím orgánem, nedělá žádné „myšlení“). Obvykle to trvá asi 10 cyklů prostřednictvím opakování animace, ale nakonec se můžete dostat na kloub.

Tento proces považuji za kultivaci „designové slepoty“. Je to něco jako „nosní slepota“, což když nevíte, co to je, měli byste kliknout na odkaz. Pravděpodobně to pro vás hodně vysvětlí. V tomto případě je „designová slepota“ dobrá věc, protože umožňuje vidět vše kromě designu a ponechat pohyb zbývající.

Díky „designové slepotě“, protože krmíte oči a mozek stejnou stimulací prostředí, váš mozek nakonec ztichne a přestanete být uneseni věcmi, na které se nechcete zaměřit, jako je samotný vizuální design.

Nyní můžete začít senzitizovat na pohyb. Zapomeňte na všechny prvky, barvy, písma, tváře, tvary atd. Pouze nechte svou mysl stimulovat samotným pohybem (jste ospalý, máte pocit, že se chcete přihlásit do mé dílny).

Nyní můžete začít cítit, co ten pohyb dělá vaší mysli.

Plné vyloučení odpovědnosti, může to chvíli trvat. Mám na vás asi 15letý náskok a navíc si v mysli představuji uživatelské zážitky založené na pohybu a stokrát to smyčím, protože jsem jen tak šílený.

S mou pevnou, ale jemnou rukou, milý čtenáři, byste měli být schopni to vyzvednout mnohem rychleji než já.

Vaším úkolem je nyní dostat své vědomí z cesty a nechat toto malé štěně, aby s vámi mluvilo. Někdy i uvíznu a nedokážu úplně „slyšet“, co mi ten odkaz říká. Kateryno, uvidí mě, jak chodím nějakým tempem kolem domu a mumlá, „promluv se mnou“, znovu a znovu k nikomu zejména, což je vlastně docela strašidelné. Říká, že na to byla zvyklá, ale nejsem přesvědčen.

Abych vám o tom dal něco jiného (jako by tento článek nebyl dost podivný), mám sklon myslet na použitelnost vytvořenou pohybem, jako by to byla hudba. To znamená, že stejně jako u jakékoli hudby můžete být ponořeni do celé krajiny zvuku, nebo můžete ustoupit a poslouchat jednotlivé nástroje, melodie a rytmy, které spolupracují.

To může být takto.

Druhou nevýhodou (načasování) je poměrně snadné překonat. Vzhledem k tomu, že k pohybu dojde za vteřinu, považuji za užitečné někdy (i když ne vždy) zpomalit. Jednoduše uložím gif na plochu, nahraju ho do něčeho, jako After Effects nebo Quicktime, a důkladně ho posouvám po jednotlivých snímcích. To může mít dvojí účinek, když vidíte, co se děje, a získává část vaší rozumnosti.

Třetí nevýhoda (slovní zásoba), již jsem pro vás vyřešila v tomto článku, a teď to ještě zjednoduším. V tomto odkazu budeme oddělovat pět principů UX v pohybu, abyste je mohli vidět jako jednotlivé nástroje v pohybové krajině.

Moudřejší lidé než já to považují za techniku ​​„les / stromy“: přiblížit strom a poté přiblížit les. Dělejte to, dokud nejste naivní nebo dokud znovu nezískáte sebeúctu a neukončíte svoji kariéru v oblasti designu po celý život ekologického aktivismu.

Jedním z prvních způsobů, jak si všimnu použitelnosti vytvořené pohybem, je paralaxa uvnitř karet. Princip Parallaxu má za následek kognitivní „tlačení zpět“ vybraných prvků, zatímco kognitivně „tahání dopředu“ dalších vybraných prvků. Použití Parallaxe je v tomto příkladu při definování časové hierarchie velmi efektivní.

Druhý způsob, jak pohyb vytváří použitelnost, je skrze princip maskování. Maskování vytváří kontinuitu objektu, což znamená, že užitečnost objektu nepřetržitě teče z jednoho stavu do následujícího a vytváří jednoduchý, čistý příběh. V tomto příkladu se pozadí karty plynule transformuje do obrazu záhlaví.

Třetí způsob, jak si všimnu použitelnosti pohybu, je prostřednictvím principů UX v pohybu ofsetu a zpoždění a překrytí. Jak jsem již zmínil, možnosti podpory použitelnosti se mohou často překrývat a mohou být použity současně a synergicky. To je takový případ. Nástrojem Offset & Delay je definovat vztah objektu v čase. Přístup „stavět na“ říká naší mysli, že nové objekty jsou oddělené a posilují vizuální. Použití Overlay dává uživateli pocit prostorového vztahu uvnitř scény a „uspořádání“ v paradoxu vizuální roviny.

Čtvrtý (nebo je to pátý?) Způsob, jak si všimnu pohybu, který vytváří použitelnost, je naplněním očekávání. Pomocí uvolnění se objekty přecházejí více či méně plynule. Všimněte si „uvolnění“ a toho, jak má jemný účinek „zpomalení“ interakce. Člověk musí být vždy opatrný při používání jednoduchých vstupů. Ulehčení by se mělo vždy cítit čisté, svěží a zběsile. Dobré pravidlo je „rychlé, ale ne příliš rychlé“. Pokud po tisícovce pozorování interakce začne cítit vlasy pomalu, tak bych si oholil čas navíc.

Pokud jste to zvládli tak daleko, gratuluji! Zde zkontroluji komentáře, takže neváhejte posílat dotazy a příklady. Jděte ven a cvičte!

Chcete-li, abych mluvil na vaší konferenci nebo vedl dílnu pro váš tým o vzrušujícím tématu pohybu a použitelnosti, přejděte sem jako rychlá zásuvka. Pokud se chcete zúčastnit kurzu ve vašem městě, jděte sem. A konečně, pokud chcete, abych konzultoval váš projekt, můžete jít sem. Chcete-li získat články o „použitelnosti a pohybu“ zaslané přímo do vaší doručené pošty, klikněte níže.