Mobilní telefon je stále častější způsob, kterým lidé přistupují na internet. Odhaduje se, že na světě je 14,1 miliardy chytrých telefonů a každý rok je staženo 350 miliard mobilních aplikací. Znamená to, že návštěvnost z mobilních telefonů je stále důležitější a správný návrh mobilního uživatelského rozhraní je naprosto zásadní. Trend je jasný: vzhledem k tomu, že téměř polovina všech zařízení připojených k síti je mobilní, desktop už dávno není dominantním přístupovým bodem. Lidé rádi používají mobilní aplikace - vyhovuje jim jejich rychlost a funkčnost a oceňují možnost udělat cokoli kdekoli. Pokud bude vaše aplikace optimalizována pro mobilní zařízení, zaznamenáte výrazný nárůst konverzního poměru.

►S ohledem na to bychom rádi osvětlili, co je to mobilní uživatelské rozhraní, jak se liší od designu pro stolní počítače a jak můžete zajistit, aby vaše mobilní uživatelské rozhraní bylo lepší než u vašich konkurentů.

Co je mobilní uživatelské rozhraní?

Mobilní uživatelské rozhraní neboli mobilní UI je displej nebo obrazovka mobilního zařízení. Je to prostor, kde mohou uživatelé interagovat s tím, co je na obrazovce - od tlačítek menu až po textová pole (a vše mezi tím, podle toho, zda uživatelé mohou klepat, posouvat, táhnout prstem, psát nebo jen prohlížet).

Většina těchto uživatelských interakcí je založena na dotyku a probíhá na dotykových displejích. Základní principy návrhu mobilního uživatelského rozhraní se samozřejmě liší od tradičního uživatelského rozhraní pro stolní počítače. Koneckonců uživatelé jsou z definice v pohybu; ovládání je omezené, a probíhá pomocí širokých prstů. Akce a informace proto musí být velké, tučné, jasné a jednoduché.

Proč je důležitý návrh uživatelského rozhraní mobilní aplikace?

Vzhledem k tomu, že počet mobilních aplikací rok od roku roste, přešly sociální sítě a vyhledávače na strategii „mobile-first“, a dbají na to, aby jejich aplikace pro iOS a Android nabízely dokonale přehledné uživatelské prostředí na přenosných zařízeních.

Koneckonců, pokud mají uživatelé větší výběr a svobodu při hledání mobilních aplikací, které jim vyhovují, může špatná uživatelská zkušenost snadno znehodnotit vaši značku, poškodit vaše příjmy a odradit uživatele.

►Kromě investic do mobilních aplikací zaznamenává mnoho e-shopů nárůst nákupů z mobilních zařízení. Pokud internetový obchod neoptimalizuje prostředí pokladen, použitelnost nebo design své mobilní aplikace, může ztratit podíl na trhu nebo se dokonce stát zastaralým.

Několik tipů pro návrh mobilního uživatelského rozhraní, kterými by se měl řídit každý designér

Abychom vám pomohli orientovat se v oblasti mobilního uživatelského rozhraní, vytvořili jsme seznam nejlepších tipů pro návrh mobilních aplikací.

1. Ujistěte se, že existuje jasná vize mobilní aplikace.

Začněme základem uživatelského rozhraní, na který pravděpodobně přijdete v raných fázích procesu návrhu produktu: vizí.

Vize je to, co se sdílí hned na začátku návrhu mobilní aplikace. Měla by být jasně (a pokud možno vizuálně) sdělena všem klíčovým zúčastněným stranám, aby všichni bez rozdílu znali účel a cíl projektu. To zabrání tomu, aby lidé pracovali na tom, co si myslí, že vize je nebo by měla být, táhli různými směry, přidávali další a další funkce a tvořili chaos. Stručně řečeno, s jasnou vizí se celý proces návrhu a vývoje zefektivní. Všichni chápou, jak bude vypadat úspěch, jaké jsou jejich role na projektu a co se od nich vyžaduje.

►Existuje spousta různých faktorů, které budou ovlivňovat vaši celkovou vizi, včetně obchodních cílů, potřeb uživatelů, konkurenčního prostředí atd.

2. Zlepšujte návrh produktu v iteracích

'Progresivní vylepšování' je způsob, jak svůj návrh neustále zdokonalovat, dokud nebude na takové úrovni, jakou potřebujete. Takže místo toho, abyste utráceli čas, peníze a další drahocenné zdroje ve snaze vytvořit dokonalou verzi najednou, začněte se základním konceptem - může mít podobu drátěného modelu, makety nebo lo-fi prototypu, který může váš tým vylepšovat, dokud nebude odpovídat celkové vizi mobilní aplikace. Neliší se to od způsobu, jakým vývojáři softwaru přistupují k vývoji modulů. Kousek po kousku. Není to tak obtížné, jak by se na první pohled mohlo zdát.

Pomocí návrhových nástrojů můžete rychle začít vytvářet prototypy mobilních aplikací s plně interaktivními komponentami kódu, které vypadají a fungují jako skutečná aplikace pro Android nebo iOS. Nejenže to zajistí rychlost a efektivitu práce, ale hodí se to i při provádění testů použitelnosti.

►Můžete rychle sestavit prototypy, které vypadají a působí jako skutečná mobilní aplikace, otestovat návrh uživatelského prostředí a na základě testů provádět postupné úpravy.

3. Klíčem je jednotnost

Vaše návrhy by měly být jednotné ve všech oblastech, od tlačítek a ikon až po barvy značky.

Pro názorný příklad, jak to myslím, zkuste na mobilu navštívit například stránky Amazon. Každý aspekt jeho designu je jednotný, od palety barev až po rozvržení stránky, ať už kupujete novou, hračku, kolečkové brusle nebo oblečení. Není to jen proto, že to lahodí oku. Jde o to pomoci uživatelům seznámit se s aplikací, aby nakonec ani nemuseli přemýšlet o tom, co dělají. Každá akce bude zcela intuitivní a efektivní.

►Porovnejte to se svým webem. Mají například všechna vaše tlačítka výzvy k akci určitou barvu? Používáte pro konkrétní typ obsahu vždy určitá písma?

4. Ujistěte se, že vaše úvodní obrazovka je bezchybná.

Úvodní obrazovka by měla upoutat pozornost uživatele - a to co nejrychleji. Zatímco se aplikace spouští na pozadí, můžete pomocí úvodní obrazovky uživatele zaujmout. Protože, přiznejme si to, v současné době, kdy vše je dostupné okamžitě, nikdo nechce sedět, čekat a nic nedělat.

Zařaďte na úvodní stránku poutavé obrázky, nepřehlédnutelné titulky, tipy pro uživatele. To vše může uživatele zaujmout a zabránit jim v tom, aby skončili a odinstalovali aplikaci hned na první překážce. Zvažte přidání ukazatele průběhu, zejména pokud načítání vaší aplikace trvá dlouho. Uživatelé rádi vědí, že se něco děje. Ale nepřehánějte to. Úvodní obrazovka nemusí být nijak přeplácaná, aby udělala skvělý první dojem.

5. Prezentujte statistiky co nejpřehledněji

Rozložení je důležitým faktorem návrhu mobilního uživatelského rozhraní - zejména při prezentaci statistik a dat. Pokud jsou tyto údaje hlavní součástí vaší aplikace, věnujte čas určení způsobů, jak je snadno přečíst, interpretovat a extrapolovat. Zeptejte se sami sebe: Je text čitelný? Mohou uživatelé snadno sledovat grafy a tabulky? Je význam ikon jasný?

►Může být také užitečné zvážit, jak mohou uživatelé tyto informace dostat z aplikace do jiných zařízení.

6. Návrh pro rychlé načítání stránek

Uživatelé jsou dnes netrpělivější než kdy dříve. Nikoho nebaví čekat celé dvě sekundy na přehrání videa nebo na načtení webové stránky. Protože se téměř vše online děje okamžitě a v reálném čase, máme nízkou toleranci k pomalejšímu načítání stránek a aplikací.

Obecně platí, že byste měli navrhovat stránky tak, aby se načítaly co nejkratší dobu, což je maximálně tři sekundy. Pokud to bude trvat déle, uživatelé začnou odcházet.

Jak to vypadá?

• Zajistěte jasnou vizuální hierarchii a navigaci.
• Ujistěte se, že obrázky nejsou zbytečně velké a není jich příliš mnoho.
• Používejte strukturování textu, barvy a bílý prostor, abyste zlepšili viditelnost a vyvolali správné emoce.
• Typografie je důležitá - používejte písmo o velikosti 11pt nebo větší a omezte použití písem pouze na maximálně 2 fonty.
• Nezapomeňte, že 94 % uživatelů mobilních zařízení používá režim na výšku, takže musíte sdělit mnoho informací na velmi úzké rovině.

7. Nezapomeňte na mobilní přístupnost

Přístupnost je víc než jen módní slovo. Je to celý designový étos. Skvělým příkladem je společnost Microsoft, kde přístupný design (napříč počítači, hrami a mobilními zařízeními) v podstatě určuje celou firemní kulturu. A to je něco, co stojí za to přijmout i ve vašem vlastním týmu. Koneckonců je to skvělý způsob, jak oslovit širší publikum a ukázat, že si vážíte všech uživatelů.

Co ale přístupný design pro mobilní uživatele skutečně znamená?

Jednou z nejběžnějších funkcí je "režim pro slabozraké". Často se také setkáte s možností zvětšit velikost textů nebo interaktivních prvků. To má dvojí výhodu - pomáhá osobám s pohybovým postižením orientovat se ve vaší aplikaci a zároveň pomáhá osobám se zrakovým postižením. To je užitečné zejména, tehdy, pokud se vaše aplikace zaměřuje na starší populací.

Naopak jiný typ přístupnosti byste měli zvolit, pokud jsou vašimi cílovými uživateli děti. Děti mají velmi odlišné fyzické a kognitivní schopnosti než dospělí. A ačkoli se na první pohled zdá, že to je spíše záležitost pro návrháře UX, váš tým pro návrh uživatelského rozhraní musí zvážit aspekty, jako jsou písma, barvy a další vizuální interaktivní prvky.

►To neznamená, že musíte změnit celý návrh mobilního uživatelského rozhraní. Můžete do něj zahrnout možnosti přístupnosti, jako je například režim pro nevidomé či slabozraké. Jen nezapomeňte uživatele na jeho přítomnost upozornit v nabídce nastavení.

8. Dodržujte zásady návrhu uživatelského rozhraní

Zásady návrhu uživatelského rozhraní udržují návrhy efektivní a uživatelsky přívětivé. Designéři nemusí hádat, experimentovat nebo nechávat vše na náhodě. Dodržováním předvídatelných a pravděpodobně úspěšných zásad návrhu mobilního uživatelského rozhraní můžete vytvářet zážitky, které si uživatelé oblíbí.

►Základní principy návrhu uživatelského rozhraní vám pomohou zlepšit způsob práce a interakci uživatelů s vaší mobilní aplikací, ať už se jedná o aplikaci v zařízení se systémem Android nebo Iphone. Jde o to, usnadnit uživatelům život.

Návrh uživatelského rozhraní mobilní aplikace

Vzhledem k tomu, že se stále více lidí připojuje k internetu prostřednictvím mobilních zařízení a každý rok vzniká stále více aplikací, je správný návrh uživatelského rozhraní mobilní aplikace hned napoprvé rozhodující pro přilákání a udržení uživatelů. Skvělé uživatelské rozhraní by mělo být jednoduché na používání, přehledné na navigaci a naprosto intuitivní a přirozené.

Zdroj: marketingland.com, facebook.com, cpcstrategy.com

Autor: Vlastimil Malík

Foto zdroj: pixabay.com