Naše nová lektorská hvězda Jindřich Zvolánek je Product Designer v SYMBIO Agency a už víc než šest let se věnuje webdesignu, brandingu, grafickému designu a samozřejmě UX/UI, který má v malíčku natolik, že ho klidně naučí i tebe. Checkni skvotovský kurz a přečti si rozhovor, ať víš, do čeho jdeš.
Co je to UI v porovnání s UX?
UI a UX jsou části něčeho, čemu říkáme design. To je nejdůležitější. (smích)
Zjistit, v čem se liší, je vlastně poměrně snadný, stačí se jen podívat na to, na co se daná oblast zaměřuje a jakými konkrétními způsoby ovlivňuje uživatele. Rázem zjistíš, že UI je o tom, co vidíš, od typografie, přes barvy až po to, jak vypadají prvky jako je například navigace.
Transformuješ wireframy do učesaného a poutavého vizuálního prostředí, abys umocnil použivatelnost produktu a vytvořil emoční spojení mezi koncovým uživatelem a produktem. Oproti tomu UX je zaměřeno především na uživatele a jeho cestu napříč produktem.
UI a UX jsou ale v těsném kontaktu. I proto se pozice na pracovním trhu mnohdy vypisují jako UX/UI Designer, často je to ale jen slovní hříčka. Konec konců, ještě před několika lety byl člověk, který vytvářel digitální software nebo produkty prostě a jednoduše „web designer“. S masivním vzrůstem aplikací a produktů se svět designu rozrostl o desítky dalších specializovaných pozic a setkat se můžete s pojmy jako UX Writer, UX Researcher, Interaction Designer a tak podobně.
Závěrem bych jen dodal, že znát rozdíly mezi UX a UI je rozhodně dobře, ale nikdy bychom na tyto dvě oblasti neměli nahlížet jako na vzájemné soupeře, ba naopak.
Jaké jsou největší výzvy při navrhování uživatelského rozhraní pro mobilní aplikace?
Takových výzev je hned několik. Zmínil bych určitě to, že často nenavrhujete aplikaci jen pro jednu platformu, ale navrhujete například současně pro iOS i Android a každá platforma má svá pravidla, principy a stejně tak i omezení.
Další výzvou je i omezený prostor obrazovky, byť se displeje v posledních letech hodně zvětšily, pořád musíme mít na paměti, co za obsah na konkrétní obrazovce ukazujeme a zda jej ukazujeme v dostatečných velikostech, aby s ním uživatel vůbec mohl pracovat. Samozřejmě je toho ale mnohem víc.
Co je pro tebe nejdůležitější při navrhování uživatelského rozhraní pro webové stránky?
Rovnováha mezi zajímavým vizuálním zpracováním a jednoduchostí použití. Často se můžeme setkat s tvrzením, že je UX důležitější než UI a naopak, já s tím nesouhlasím, obojí sehrává svou důležitou roli a je potřeba na to myslet.
Jaký je tvůj názor na minimalistický design a jeho vliv na použitelnost?
Já jsem velkým příznivcem minimalismu, ale pro každého z nás může minimalismus představovat něco jiného. Minimalismus v designu může být velmi efektivní v momentě, kdy je použit správně. Cílem je, aby sdělení bylo jasnější nejen tím, že odstraníme přebytečné a rušivé vlivy, ale také tím, že se zaměříme na to, co je opravdu důležité.
Přestože to zahrnuje odstranění nepotřebných elementů, je třeba současně definovat silný ústřední bod (focal point). Když protneme minimalistický design s funkčností a správně pracujeme s elementy tak, aby se uživatel mohl jasně orientovat, aniž by byl zmaten, ztracen nebo rozptýlen, pak je minimalismus efektivní.
Jaký význam má pro tebe kvalitní ikonografie v uživatelském rozhraní?
Ikony mají z mého pohledu obrovský význam. Byť na ně mnozí mohou nahlížet jako relativně zbytečný prvek někde z databanky, nemusí tomu tak být. Koneckonců podívejme se například na Airbnb a jejich custom icon set.
Ikonografie nám může napomoci vizuálně oddělit různé prvky a funkce, což ve výsledku usnadňuje navigaci a interakci s produktem. Zásadní ale je, aby ikona opravdu měla nějakou přidanou hodnotu, aby byla srozumitelná a zároveň aby z pohledu designu odpovídala značce a celkovému stylu UI.
Jak se rozhoduješ, které prvky v uživatelském rozhraní jsou nejpodstatnější a mají být zdůrazněny?
V první řadě na základě navrženého UX. Postupuji v souladu s tím, co je pro uživatele nejdůležitější a co jim napomůže splnit nejen jejich cíle co nejefektivněji. Důležitá je pak samotná vizuální hierarchie, konzistence a uspořádání elementů tak, aby uživatel snadno našel to, co potřebuje, a aby nad tím nemusel složitě přemýšlet.
Jaký význam má pro tebe použití různých barev v uživatelském rozhraní a jak je používáš?
Použití různých barev v uživatelském rozhraní může být velmi užitečné pro oddělení různých prvků a funkcí. Barvy mohou také pomoci vizuálně zvýraznit důležité prvky a vést uživatele při navigaci. Při používání barev se snažím držet se určité palety, která odpovídá značce a stylu uživatelského rozhraní, a zohlednit také kontrast a čitelnost textu. Dále je důležité brát v úvahu, jaké barvy jsou pro uživatele příjemné a jaké mohou být obtížné na oči.
Jak by podle tebe měla vypadat ideální navigace v uživatelském rozhraní?
Podle mě by ideální navigace v uživatelském rozhraní měla být intuitivní a snadno použitelná. Uživatelé by měli být schopni snadno najít to, co hledají, a měli by mít jasnou představu o tom, kde se v uživatelském rozhraní nacházejí. Důležité je také zohlednit vizuální hierarchii a používat názvy a popisky, které jsou pro uživatele srozumitelné. Kromě toho by navigace měla být konzistentní v celém uživatelském rozhraní a měla by být snadno použitelná na různých zařízeních a platformách.
Co pro tebe znamená konzistence v uživatelském rozhraní a jak jí dosahuješ?
To, že všechno má svůj řád a cíl. V souvislosti s UI to znamená, že každý element má jednotný styl, napomáhá vám se zorientovat a usnadňuje vám navigaci napříč produktem. Zásadní je v tomto ohledu uspořádání a vizuální hierarchie, ale stejně tak správně zvolená paleta barev, typografie, styl jednotlivých elementů a tak podobně.
Jaký vliv má na uživatelské rozhraní vývoj technologií jako například virtuální a rozšířená realita?
Zatím si nemyslím, že by ten vliv byl nějak zásadní. Určitě ho pozorujeme, poněvadž nám tyto technologie nabízejí nové způsoby interakce a zážitku s produktem. Virtuální realita umožňuje uživatelům prozkoumat virtuální prostředí a interagovat s ním jinak, než byl doposud zvyklý.
Rozšířená realita neboli AR pak umožňuje uživatelům interagovat s vizuálními prvky v reálném světě. Nicméně tyto technologie zatím přinášejí více výzev, například v oblasti použitelnosti a přístupnosti pro uživatele. K tomu, aby bylo používání produktů ve VR/AR opravdu příjemným zážitkem, máme zatím (alespoň z mého pohledu) ještě kus cesty.
Jaké jsou největší výhody a nevýhody při používání animací v uživatelském rozhraní?
Záleží o jakých animacích je řeč. Když to přeženeme anebo, což je horší, neprovedeme správně, může to produkt bez nadsázky pohřbít. Zásadní je mít jasno v tom, co má daná animace na daných místech předat. Opravdu ji potřebujeme?
Já jsem osobně velkým příznivcem drobných mikrointerakčních prvků, řeč je o opravdu drobných a nerušivých animacích, díky kterým můžeme zlepšit interakci a zkušenost uživatele a jež nám mohou napomoci vizuálně oddělit různé prvky a funkce. Správně zvolená animace může přispět ke zvýšení zájmu uživatele o produkt a zlepšit jeho celkový dojem, špatně zvolená animace ho může pořádně naštvat, tak opatrně. (smích)
Jak by podle tebe měla vypadat ideální uživatelská zkušenost a jak jí dosahuješ?
Když se řekne slovo „ideální“ v souvislosti s UX, nelze pak opomenout slova jako „snadná“ a „intuitivní“, bez toho se uživatel neobejde. Kromě toho by měla být pozitivní, příjemná a poutavá, myšleno z vizuálního hlediska, aby uživatel za každých okolností získával kladný dojem z aplikace, webu nebo jiného produktu.
V rámci UX něčeho takového dosahujeme pravidelným testováním uživatelského rozhraní a sběrem zpětné vazby od uživatelů, abychom zjistili, co funguje nejlépe pro jejich potřeby. Z pohledu UI je to pak konzistence, jednoduchý a čistý design, který usnadňuje používání a navigaci napříč produktem.
Jaké trendy v uživatelském rozhraní sleduješ a jaký vliv mají na tvůj přístup k návrhu uživatelského rozhraní?
Nejzajímavějším a z mého pohledu příznivým trendem jsou mikrointerakce. Teď nemám na mysli složitější a komplexnější animace, ale opravdu minimální, skoro až nepatrné interakce, se kterými se uživatel napříč produktem setkává. Mikrointerakce digitálním produktům vdechují život. Krásně je implementuje Apple.
Technologický vývoj v posledních letech nám designerům umožňuje tyto mikrointerakce dostat v podstatě do jakéhokoli elementu a díky tomu uživatelskému rozhraní dodat charakter a osobnost. Takových trendů lze ale pozorovat víc, dalším z nich je návrat k minimalismu, cross-platformní zážitky, samozřejmě pak využití AI a tak dále.