Tvorba webu

Psaní copy v roce 2024: mobily mají přednost!
12
Uživatelský zážitek (UX) a uživatelské rozhraní (UI) jsou nepostradatelnou součástí stavby webu a vzájemně se doplňují. Čtěte dál a už si je nikdy nespletete.

Úvodem

Pokud vás zajímá, v čem se liší UX design od UI designu, nejste rozhodně sami. Jsou si totiž docela podobné a lidé je mezi sebou často zaměňují, i když ve skutečnosti popisují velmi odlišné věci. UX je zkratka pro user experience neboli „uživatelský zážitek“. Cílem UX designu je vytvořit produkt, který bude pro uživatele snadno pochopitelný a jeho používání bude intuitivní. UI je zkratka pro user interface, „uživatelské rozhraní.“ UI design se zaměřuje hlavně na vizuální a interaktivní prvky, a snaží se pro uživatele vytvořit esteticky příjemné prostředí. Uživatelský zážitek se může vztahovat na jakýkoli druh produktu nebo služby, uživatelské rozhraní je specifické pro digitální svět. Aby to bylo všechno úplně jasné, podíváme se na UX i UI design ještě podrobněji.

Co řeší UX design

Pro UX je uživatel na prvním místě. Soustředí se hlavně na to, aby se lidé dokázali na webové stránce zorientovat, věděli, na co mají kliknout, a jednoduše našli, co potřebují. Úkolem UX designérů je pochopit potřeby i pocity uživatelů během používání webu a navrhnout odpovídající řešení. To se samozřejmě neobejde bez několika kol uživatelských výzkumů, prototypování, testování a vylepšování návrhů na základě zpětné vazby od uživatelů. Výsledkem je potom web, který je nejen funkční, ale také uživatelsky příjemný a snadno použitelný. Takový web se ale neobejde bez atraktivního vzhledu, který udrží pozornost.

Co řeší UI design

UI je vlastně taková specializovaná podmnožina UX, protože poutavý vzhled hraje významnou roli v tom, jak na lidi váš web působí. Různé barvy a tvary vyvolávají v lidech různé pocity. Momentálně trendující barevné kombinace z webu Coolors. Momentálně trendující barevné kombinace z webu Coolors. UI designéři mají odborné znalosti grafického designu a typografie, ale zaměřují se hlavně na přístupnost a responzivní design. Řeší tedy nejen to, jak webové stránky vypadají, ale i jak se chovají. Mají pod palcem všechno od barevných schémat a výběru písma po styly tlačítek, funkce posouvání, animace a další důležité detaily, které doplňují uživatelský zážitek. UI se soustředí hlavně na pozitivní zážitek uživatele a jeho cílem je vytvořit web, který se všem lidem snadno používá a je zároveň estetický. To by ale nešlo bez předchozích výzkumů UX.
Jak fungují různé kombinace barev si můžete sami vyzkoušet pomocí interaktivních nástrojů, jako třeba Figma Color Wheel, Canva nebo Coolors.

Jak se UX a UI doplňují

Obě disciplíny vyžadují, aby se designéři vcítili do koncového uživatele a zamysleli se nad tím, jak bude web používat. Při vývoji webu je UX design obvykle na prvním místě a UI ho následuje. UX designér se zamýšlí na celou cestou uživatele k vyřešení konkrétního problému – jak se člověk na stránce pohybuje, jaké úkoly musí splnit, a jestli mu to bude hned jasné. Potom vznikne wireframe se základním rozvržením webu. UX designérka kreslí wireframe webové stránky Když je kostra webu hotová, přichází na řadu UI designér, který mu vdechne život. Zohlední všechny vizuální aspekty, se kterými se uživatel můžem během své cesty setkat, včetně klikání na tlačítka, posouvání stránky dolů nebo procházení galerie obrázků. Zatímco UX designér popíše cestu, designér UI ladí všechny detaily, které tuto cestu umožňují. Tady je potřeba zdůraznit, že design uživatelského rozhraní není jen o vzhledu. UI návrháři mají obrovský vliv na fungování webu a také na jeho přístupnost všem a inkluzivitu. UI například řeší, jak zvýšit kontrast a zlepšit čitelnost textu pomocí různých barevných kombinací, které zároveň budou vyhovovat i barvoslepým lidem.

Jak poznáte, že to funguje

Udělejte si vlastní uživatelský průzkum. Poproste své známé, aby si váš web otevřeli a řekli vám, jak se jim s ním pracovalo, co jim chvíli trvalo pochopit a podobně. Můžete jim dát i konkrétní úkol: třeba dát zboží do košíku nebo najít určitou informaci. Zeptejte se jich na to, jak na ně působilo celkové barevné schéma i barvy a umístění tlačítek, jestli jim vyhovovala vybraná písma a styl nadpisů, jaká byla čitelnost textu, kvalita fotografií atd. Ukázka heatmapy stránky v UX nástroji HotJar Průzkum můžete udělat v reálném čase pomocí nástrojů jako HotJar nebo Crazy Egg. Můžete si vyzkoušet i A/B testování, díky tomu třeba zjistíte, že uživatelům více vyhovuje tlačítko vlevo než vpravo. Případně si připravte několik variant vizuálu hlavní stránky webu a nechte lidi hlasovat, co se jim zdá nejlepší. Když už je web oficiálně venku, sledujte Google Analytics. Zjistíte tak, odkud uživatelé na vaši stránku nejčastěji přichází, kolik času na webu stráví nebo jak vysoká je okamžitá míra opuštění. Pomůže vám to odhalit a opravit případné nedostatky, aby web lépe fungoval.

Shrnutí

Zjednodušeně je UX designér vlastně takový architekt, který web navrhne s ohledem na potřeby uživatele. UI designér je špičkový dekoratér zodpovědný za konečný vzhled, dojem a také funkčnost stránek. Aby váš web správně fungoval a lidé s ním rádi interagovali, potřebujete mít tohle všechno vyřešené. Jedině tak se budou na web nebo e‑shop vracet a nakupovat. Už je tedy celkem jasné, proč se kvalitně postavený web bez UX a UI neobejde. Oba týmy mají stejný cíl a musí spolu úzce spolupracovat, aby byli nakonec všichni spokojení.

Toto je testovací verze webu

PODÍVAT ŽIVĚ