5 designových triků, díky kterým bude váš mobilní UX lesk
Podívali jste se v poslední době na analýzu svých webových stránek? Šance jsou významnou částí - možná i více než polovinou - vašich uživatelů přicházejí na váš web přes mobilní zařízení.
Ať už zaměřujete mobilní úsilí na web nebo aplikaci, musíte zajistit, aby design vytvořil hvězdné uživatelské prostředí pro každého z těchto mobilních uživatelů. Nemusíte začínat od nuly, abyste to také udělali. Přemýšlení o mobilním uživateli a o tom, jak interagují s designem, pomůže formovat vzhled a fungování vašich rozhraní.
Zde je pět designových triků, které můžete použít k tomu, aby se váš mobilní UX stal oblíbeným pro uživatele.
Prozkoumejte prvky Envato
1. Zjednodušte navigaci
Tyto nabídky mega navigace pro starou školu vám nedávají žádnou laskavost - zejména pokud jde o mobil. Mobilní uživatelé mohou mít nejkratší rozpětí pozornosti kterékoli skupiny uživatelů. Chtějí otevřít web nebo aplikaci a hned najít, co potřebují.
Navrhněte navigační menu s několika možnostmi - podívejte se na svou analytiku a podívejte se, co většina uživatelů hledá nebo naviguje jako první.
Méně možností zabere méně místa na obrazovce, což vám umožní začlenit do designu více prostoru, což je ideální pro dotyk a čitelnost.
Ačkoli se zde nebudeme hádat o výhodách ikony hamburgeru, vyskakovací navigace je vzor, na který jsou uživatelé zvyklí. Jen se ujistěte, že pokud plánujete vyskakování nebo vysouvání navigační nabídky, je pro uživatele jasný vizuální identifikátor.
Aplikace Ebates používá dvě úrovně navigace: jedna je seznamem jejich nejlepších obchodů a druhá je váš seznam oblíbených obchodů s záložkami (v ikoně hamburger / srdce). Ani jedna z možností se necítí těžko. Skoro to vypadá a funguje jako obsah. Celý design je navigace bez pocitu ohromující.
2. Myslete v gestech (a haptice)
Mobilní uživatelé pracují se svými zařízeními úplně jinak než uživatelé stolních počítačů. Toto by mělo odpovídat vaše uživatelské rozhraní.
Návrh by měl využít gesta k provedení určitých akcí. Rozhraní, které používá běžné a intuitivní ovládací prvky, potěší uživatele.
Tato gesta zahrnují:
- Klepněte a dvakrát klepněte
- lis
- Držet
- Drag and drop
- Posouvat (jedním prstem a dvěma prsty)
- Přiblížení a oddálení
- Výpad
- Švihnutí
Pokud jde o mobilní gesta, jsou to nová kliknutí.
A když přemýšlíte o dotykových interakcích, nezapomeňte na haptiky. Ta jemná „rána“ z vaší nošení nebo ta vibrace z vašeho telefonu v kapse jsou haptická oznámení, mechanické simulace dotyku pomocí vibrací nebo pohybu.
Trik k haptiku spočívá v tom, že interakce jsou jemné a docela nenápadné. I když uživatel možná ví, že existuje upozornění, ostatní lidé to často ne. Dotykové rozhraní je stále běžnější a zdá se, že uživatelé dostávají pozitivní odpověď.
Například hra Two Dots používá ránu pokaždé, když určitým způsobem vyčistíte tečky. Bezhlučná volba umožňuje diskrétní hraní her a uživatelům poskytuje příjemný zážitek.
3. Ať je to konverzační
Lidé se cítí, jako by mluvili s jinými lidmi a jednali s nimi. Naštěstí pro designéry může dotek umělé inteligence a chatbots pomoci vytvořit tyto interakce, takže nemusíte být v pohotovostním režimu pro živé chatování 24 hodin denně.
Existují tři způsoby, jak vytvořit konverzační uživatelské rozhraní:
- Napište kopii v celém svém rozhraní, které má osobnější nádech. Od dlouhých textových bloků po malé kousky mikroskopie by měl mít text osobnost, například v aplikaci WTFWeather výše. Mělo by se to číst způsobem, jakým lidé mluví. Dávejte pozor, abyste ve svých zprávách zněli příliš formálně nebo roboticky.
- K vytváření okamžitých interakcí s uživateli použijte funkce zasílání zpráv nebo chatboty. To může být skvělý nástroj pro zákaznické služby a také může pomoci vytvořit loajalitu zákazníků, pokud je někdo vždy k dispozici, aby jim pomohl vyřešit problémy.
- Integrujte hlasové uživatelské rozhraní do návrhu. Siri a Alexa jsou domácí jména díky hlasovým rozhraním. Další bonus k integraci hlasových příkazů? Usnadní přístup k vašemu webu nebo aplikaci.
4. Animujte to
Vypadá to, že na téměř každém navštíveném webu jsou animované prvky. A to je záměrné. Animace může oživit design.
Animované prvky jsou velmi poutavé, protože upoutávají pozornost uživatelů a mohou uživatelům ukázat, jak lépe interagovat s návrhem. (Při tvorbě návrhu se vrací k klasické myšlence „show, not tell“).
Například Mapy Google jsou nabité malými animacemi. Při příštím použití věnujte pozornost.
Nick Babich, pro UX Planet, má skvělý primer pro použití pro animaci v designu mobilního UI. Nastínil tři klíčové způsoby, jak dobře používat pohyb.
- Stav systému: Pomocí animace zobrazte stav načítání, pro aktualizaci obsahu a oznámení.
- Pro navigaci a přechody: Pomocí animace pomůžete uživatelům pohybovat se mezi různými typy obsahu, vytvořit vizuální hierarchii mezi elementy a zobrazit změnu stavu.
- Vizuální zpětná vazba: Pomocí animace můžete zobrazit potvrzení akce nebo pomoci vizualizovat výsledek akce.
5. Dobře na palubě a správně používejte formuláře
Zejména u aplikace je onboarding zásadní pro loajalitu uživatelů.
Pomyslete na poslední hru, kterou jste stáhli. Skočil jsi přímo dovnitř? Nebo jste potřebovali rychlý návod k zajištění úspěchu?
Interaktivní zážitek z aplikace pro uživatele pomůže uživatelům naučit se co nejlépe využívat funkce obsažené v uživatelském prostředí. Zábavná možnost jim také pomůže přejít k věrným uživatelům. Udržujte krátký tutoriál na palubě a nezapomeňte do něj vložit často kladené dotazy nebo sekci nápovědy, aby se k němu uživatelé mohli vrátit, pokud budou mít problémy.
U mobilních webových stránek je onboarding méně důležitým tématem, ale problémem může být registrace nebo registrace. Formuláře na mobilních zařízeních musí být jednoduché a snadné. Uživatelé nemají rádi objemné komplikované formy.
Zjednodušte formuláře pro mobilní telefony a zvyšte počet konverzí. (Další informace můžete vždy požádat později.)
Podívejte se na jednoduchý výchozí bod pro GoodRx výše. Vyžaduje pouze lék, o kterém se chcete dozvědět více. Forma je fokus a je to velmi jednoduché.
Požádejte jen o jednu informaci - e-mailovou adresu. To je vše, co potřebujete k navázání vztahu s uživatelem. Pokud váš web nebo aplikace vyžaduje přihlášení, držte se e-mailové adresy a hesla.
Navrhněte formulář tak, aby se pole snadno vyplňovala (z hlediska velikosti), a zvažte vypuštění všech funkcí automatického dokončování, abyste snížili šance na chybně zadané e-mailové adresy. Ještě jeden trik? Použijte sociální přihlašovací formulář, když můžete proces ještě více zjednodušit. Uživatelé jsou na tento proces zvyklí a je pro ně snadné… a méně pravděpodobné, že pro vás budou mít chyby.
Závěr
Mobilní uživatelské prostředí je jednou z nejdůležitějších věcí, na kterou byste měli při vytváření svých webových stránek nebo aplikací myslet. Mobilní uživatelé se musí neustále měnit.
Vytvořte rozhraní, které se snadno používá a využívá moderní technologie a funkce k vytvoření něčeho, s čím se uživatelé budou chtít znovu a znovu zapojit.