UX design: Kľúč k úspechu v roku 2024

User Experience (UX) sa zameriava na interakcie používateľa so značkou, produktom alebo službou a zahŕňa viacero disciplín, vrátane interakčného dizajnu a použiteľnosti.

UX špecialista musí nájsť rovnováhu medzi používateľskými potrebami a biznisovými cieľmi, pričom cieľom je, aby web bol “user-friendly” a vytvoril vzťah medzi používateľmi a značkou.

“Dômyselným UX dokážeme odstrániť “polená pod nohami zákazníkov”, ktoré by inak mohli brzdiť plynulý nákupný proces. Vďaka tomu navrhujeme kroky pre vytvorenie bezproblémovej a jednoduchej zákazníckej cesty, ktorej cieľom je dokončenie nákupu.”

UX ako konkurenčná výhoda

Kvalitný UX design nie je iba o estetike, ale aj o tom, ako zákazníci vnímajú a interagujú s vaším produktom alebo službou. Táto dôvera, ktorú zákazník získa pri nakupovaní, je cenným aktívom, ktoré pomáha upevniť vaše postavenie oproti konkurencii. Zlepšením UX nielenže zvyšujeme konverzie, ale aj získavame verných zákazníkov.

“Významným aspektom UX dizajnu je jeho schopnosť budovať značku. Kvalitná používateľská skúsenosť pri nákupe nie je len príjemným prídavkom, ale zároveň efektívnym nástrojom na upevnenie konkurenčnej pozície.”

Dátovo podložený UX dizajn znižuje mieru okamžitých odchodov (bounce rate). Keď sa zákazníci dokážu pohybovať na vašom webe jednoducho a intuitívne, pravdepodobnosť, že odídu ku konkurencii, je nižšia. Aj keď ide o jeden z mnohých rozhodovacích faktorov pri nákupe, kvalitný UX dizajn pomáha udržať zákazníkov na e-shope čo najdlhšie.

Úzka spolupráca s viacerými odvetviami

UX design je multidisciplinárny obor, ktorý spolupracuje s rôznymi disciplínami a odbormi s cieľom vytvoriť produkty a služby, ktoré sú efektívne a príjemné pre používateľov.

UX a UI

User Experience (UX) a User Interface (UI) sú dva dôležité aspekty pri návrhu digitálnych produktov alebo služieb. UX – ako sme už spomínali – sa skôr zameriava na používateľský zážitok, zatiaľ čo UI sa zaoberá interakciami medzi používateľom a digitálnym produktom, zahŕňajúc vzhľad, interaktivitu a intuitívnosť prvkov vrátane ikon, tlačidiel, typografie, farieb, obrázkov a responzívneho dizajnu.

UX a UI spolu úzko spolupracujú pre vytvorenie kvalitných digitálnych produktov.

UX dizajnéri zisťujú potreby používateľov s cieľom vytvoriť optimálny používateľský zážitok. Potom prichádzajú na rad UI dizajnéri, ktorí sa starajú o vizuálne prvky, ako sú farby, typografia a grafické prvky. Práca UI dizajnérov je kľúčová pri sprostredkovaní a podporovaní UX dizajnu.

UX a SEO 

V rámci SEO a UX prichádza k spolupráci na viacerých úrovniach. Napríklad, Core Web Vitals je sada metrík, ktoré Google zohľadňuje pri hodnotení webových stránok.

Zahŕňa pritom rýchlosť načítania stránky, interaktivitu či vizuálnu stabilitu. Tieto prvky sú jedným z najvýznamnejších faktorov ovplyvňujúcich používateľskú skúsenosť, manipuláciu s obrázkami, a dokonca aj usporiadanie prvkov na stránke.

Ako to vyzerá na konkrétnom príklade?

SEO sa vo všeobecnosti zaoberá pokrytím konkrétnej stránky relevantnými kľúčovými slovami. Pokiaľ vytvárame novú, SEO-friendly kategorizáciu na eshope, vždy sa snažíme o to, aby sme v názvoch kategórií používali hľadané kľúčové slová a frázy.

Niekedy sa však stáva, že by menu s ideálnou kategorizáciou vyzeralo nasledovne:

Úroveň 1: Hračky pre deti

Úroveň 2: Hračky pre deti od 1 roka

Úroveň 2: Hračky pre deti od 2 rokov

Úroveň 2: Hračky pre deti od 3 rokov

Úroveň 2: Hračky pre deti od 4 rokov…

Takáto forma kategorizácia je však z používateľského hľadiska nevhodná. Ideálna štruktúra by mala mať formu:

Úroveň 1: Hračky pre deti

Úroveň 2: Od 1 roka

Úroveň 2: Od 2 rokov

Úroveň 2: Od 3 rokov

Úroveň 2: Od 4 rokov…

V takýchto prípadoch dochádza ku kompromisom medzi SEO aspektmi a UX dizajnom, keďže návštevník webu by mal byť vždy prvoradý. Koniec koncov, e-shop tvoríme preňho, nie pre vyhľadávače.

UX a IT

Úzka spolupráca medzi IT a UX je nevyhnutná pre dosiahnutie kvalitných digitálnych produktov, ktoré spĺňajú potreby používateľov a zároveň sú technicky funkčné.

Spoločne sa podieľajú na vývoji a optimalizácii samotného e-shopu. UX sa zaoberá návrhom používateľskej skúsenosti, vrátane dizajnu, štruktúry stránok a navigácie.

IT implementuje tieto návrhy a zabezpečuje, aby stránka bola bezpečná a spoľahlivá. Spolupráca prináša technické riešenia, vďaka ktorým je nákup na e-shope pohodlný, načítanie a zobrazenie dát bezproblémové a nedochádza k mätúcim momentom v dôležitých situáciách, napríklad pri platobných bránach alebo odosielaní objednávky.

UX analýza – Krok za krokom

Analýza e-shopu podľa Janky

Naša UX konzultantka, Janka Polláková má niekoľkoročné skúsenosti s UX analýzami najrozličnejších webových stránok. Venuje sa analýzam nielen predajných e-shopov, ale aj prezentačných stránok.

Prezradila nám, ako postupuje pri analýze e-shopu, ktorou sa môžete inšpirovať aj vy:

1. “Pri e-shopoch v rámci analytického procesu začínam analýzou domovskej stránky, ktorá je jednou z najnavštevovanejších stránok v rámci eshopu. Nemusí byť nevyhnutne primárnou landing page, na ktorú sa odkazujú kampane (a ani by nemala byť). Avšak používatelia sa na ňu často vracajú počas svojej zákazníckej cesty, pretože ju berú ako najbezpečnejšiu a pre nich najjednoznačnejšiu stránku, na ktorú sa z akejkoľvek podstránky eshopu (najčastejšie cez prelinkovanie na obrázku loga) dostanú vždy. Je to niečo ako starting point a takisto safest point na e-shope. Preto musíme dbať aj na kvalitu homepage. Dôležité je jednoznačne odkomunikovať čomu sa e-shop alebo služba venuje, aké sú jej konkurenčné výhody, aké má kategórie, prípadne pridať aj ukážku produktov a množstvo ďalších detailov.
2. Následne pokračujem analýzou celkovej navigácie, hlavného menu a vyhľadávacieho panela.
3. Ďalej sa zvyčajne presúvam na kategórie, kde preskúmam širokú škálu aspektov vrátane filtrov, zobrazenia produktových kariet, stránkovania a možností triedenia produktov.
4. Pri prechádzaní produktov sa spolieham na analýzu návštevnosti, pričom dbám na prezeranie viacerých produktových stránok, s ohľadom na rôzne varianty a podkategórie.Osobitnú pozornosť venujem údajom z Google Analytics, ktoré mi pomôžu identifikovať tie najnavštevovanejšie produkty.
5. Ako ďalšie podrobne skúmam jednotlivé kroky nákupného košíka, kde vykonávam aj testovaciu objednávku.
6. V sekcii blogu kontrolujem najmä čitateľnosť, formu a prehľadnosť blogových článkov. Prípadne odporúčam, o čo by sa dalo články obohatiť.
7. Ak e-shop pracuje aj s vlastnou sekciou pre registrovaných používateľov, prípadne vernostným systémom, kriticky zhodnotím, či má program dostatočnú efektivitu a či jeho využitie prináša výhody pre používateľa a značku. Dôležitou súčasťou registrácie do vernostných programov a napríklad aj prihlásenia na odber newslettra sú aj e-mailové notifikácie, kde kontrolujem či prichádzajú spoľahlivo. Zároveň preskúmam dostupnosť možností rýchleho prihlásenia cez sociálne siete.
8. Súčasne s analýzou webu kontrolujem aj súvisiace dáta v trackovacích nástrojoch, ktoré mi často pomáhajú rozpoznať možný problém (tzv. pain point). V jednotlivých sekciách webu si samozrejme všímam aj prístupnosť pre rôzne skupiny používateľov, použitie prvkov, mieru kontrastu, kampaňové pop upy a ďalšie prvky, s ktorými sa potenciálny zákazník na webe stretne a možu ho ovplyvniť pri jeho nákupnej ceste.

"Pravidelne sledujem domáce a zahraničné štúdie a výskumy od relevantných inštitúcií. Následne ich prikladám k výstupu analýzy.”

Janka na záver dodáva, že každá UX analýza je sama o sebe špecifická. UX špecialista by si mal nájsť svoj vlastný postup pre analýzu webu. Dôležité je v konečnom dôsledku čo najkomplexnejšie porozumieť potrebám a očakávaniam používateľov.

Ako merať a vyhodnocovať UX?

Clarity

Clarity od Microsoftu pomáha sledovať používateľský zážitok na weboch a v aplikáciách pomocou kliknutí, heatmap a analýzy relácií. Clarity je bezplatný nástroj, ktorý zachytáva, ako ľudia používajú vašu stránku.

Stránka deklaruje, že: “nastavenie je jednoduché a dáta začnete získavať v priebehu niekoľkých minút”. Clarity taktiež ľahko integruje s ďalšími nástrojmi na rozšírenú analýzu.

Hotjar

Hotjar má podobné využitie ako Clarity, no vyniká rozsiahlejším funkciami. Tento nástroj nájdete aj v bezplatnej verzii, ale za jeho plné využitie si musíte priplatiť.

Hotjar ponúka možnosť prístupu k nahrávkam priamo od používateľov, ktoré umožňujú sledovať, ako interagujú s webovými stránkami a aplikáciami. Hotjar je ľahko použiteľný a rýchly na implementáciu, čo ho robí obľúbeným nástrojom na optimalizáciu digitálnych produktov.

“Pri nástrojoch tretích strán, ktoré používate na weboch, však buďte opatrní. Hotjar či Clarity patria k nástrojom, ktoré z dlhodobého hľadiska znižujú rýchlosť načítania webu. Vždy odporúčam, aby klient zapol merania len v období, keď z neho potrebujeme výsledky. Pokiaľ web nemonitorujeme, nástroj môžeme odstaviť.”

Optimizely

Optimizely je univerzálny nástroj, ktorý hrá významnú úlohu v oblasti dizajnu a optimalizácie UX. Je predovšetkým známy svojimi schopnosťami v oblasti A/B testovania a experimentovania.

Okrem toho podporuje multivariátne testy a personalizáciu. S podporou Optimizely môžete zdokonaliť svoj digitálny produkt a zabezpečiť výnimočnú používateľskú skúsenosť.

“Samotný UX design vyžaduje trpezlivosť. Jeho úspech je totiž merateľný v dlhodobom horizonte.”

Škála použiteľnosti systému (SUS)

Súbor komplexných otázok slúži na meranie používateľskej spokojnosti a použiteľnosti produktu alebo systému. SUS je založená na prieskume, kde používatelia vyhodnocujú rôzne aspekty systému a poskytujú hodnotenie. Pozostáva z 10-položkového dotazníka s piatimi možnosťami odpovede pre respondentov; od Silne súhlasím po Silne nesúhlasím. Tento nástroj poskytuje dôležité informácie pre návrh a vylepšenie používateľskej skúsenosti.

Google Analytics

Google Analytics sa používa na sledovanie metrík spojených so správaním sa používateľov na webových stránkach. Pomocou neho môžete sledovať, okrem iného, aj mieru okamžitých odchodov (bounce rate), exit rate či priemerný čas strávený na stránke a rôzne iné interakcie.

Najčastejšie UX chyby

Pri analýze používateľskej skúsenosti sa často vyskytujú bežné chyby, ktoré môžu mať významný vplyv na to, ako používatelia vnímajú e-shopy. Janka nám prezradila chyby, s ktorými sa najčastejšie stretáva na e-shopoch.

Odkomunikujte zákazníkovi svoju konkurenčnú výhodu jasne

Pri prvom stretnutí zákazníka s webom je úvodná stránka kritickým prvkom. Informačné weby to majú o čosi ťažšie ako e-shopy. V rámci predaja produktov je zákazníkovi jasné, čo na stránke nájde, ak pri prvom prezeraní narazí na konkrétne produkty, ktoré si na stránke môžete kúpiť.

Návštevník z nej musí zistiť, akú službu či produkt ponúkate; prípadne definovať identitu vašej značky.

“Už z prvého pohľadu musí byť jasné, či je váš web čisto informačný, ponúka nejakú službu alebo ide o e-shop. Neočakávajte, že vám zákazník zanechá konverziu alebo lead, ak nevie, kde sa nachádza.”

Nebojte sa svoje konkurenčné výhody komunikovať naprieč celým webom. Výhodou na homepage je aj zobrazenie zákazníckych recenzií alebo najpredávanejších produktov. V konečnom dôsledku to posilní dojem, ktorý zanecháte na návštevníkoch.

OpiTip: Podľa nedávneho prieskumu až 67 % značiek nereaguje na negatívne recenzie. Recenzie slúžia ako presviedčací faktor a zákazníci si ich všímajú – najmä tie negatívne. Reagujte na recenzie zákazníkov. Neodpovedanie na negatívne recenzie zanecháva dvojnásobne zlý dojem.

Zrozumiteľné menu

Ideálne menu pre e-shop by malo byť jednoduché a zrozumiteľné, s jasnými kategóriami a popismi. Hierarchické usporiadanie umožňuje ľahké prechádzanie subkategóriami a filtrovanie produktov. 

“V prípade e-shopu s rozsiahlou škálou produktov a potrebou "mega menu" je vhodné zvažovať vizuálne prvky, ktoré umožnia návštevníkom rýchlejšie a efektívnejšie nájsť požadované informácie. Takéto prvky môžu zahŕňať ikony alebo napríklad farebné zvýraznenie populárnych kategórií. Vizuálne prvky umožňujú rýchlu orientáciu a prispievajú k efektívnemu nákupnému procesu. Príkladom môže byť kategorizácia nášho partnera Factcool.”

Správna vizualizácia produktov

Správne vizualizované produkty alebo služby na webe sú kľúčové pre to, aby sme zákazníkov nevoviedli do omylu. Kvalitné fotografie, prípadne ukážka danej služby, zvyšujú dôveryhodnosť a pomáhajú zákazníkom lepšie identifikovať, čo ponúkate.

”Na hlavnom produktovom obrázku, by mal byť primárne zobrazený konkrétny produkt, tak aby žiadne iné rušivé elementy nezmiatli potenciálneho zákazníka. Napríklad pri látkach zobrazte skôr kus látky, ale nie kus oblečenia ušitý z danej latky. Vo fashion e-shope zobrazte najmä detail produktu, nie kompletný outfit, ktorý sa skladá z viacerých kusov oblečenia.”

Zvoľte správnu kombináciu farieb

Farby a celkovo, ako zostaviť vizuálny a funkčný web, má na starosti UI. Keďže táto problematika úzko súvisí s UX a ide o jav, ktorý e-shopy bežne nemajú správne ošetrený, Janka ho nepodceňuje.

“Precízne definujte paletu farieb a zabezpečte ich adekvátne kontrasty, obzvlášť v prípade dôležitých tlačidiel. Farebné schémy by mali byť dostatočne výrazné a jasne rozlíšiteľné s cieľom zvýšiť použiteľnosť a zreteľne odlišovať dôležité akčné prvky.”

Správne použitie farieb je dôležité pre dosiahnutie efektívneho komunikovania informácií na webe a zabezpečenie optimálneho používateľského zážitku. Na svete žije približne 2 miliardy ľudí so zrakovým postihnutím. Nevhodne zvolená kombinácia farieb pre text, prípadne pozadie textu môže skomplikovať čitateľnosť textu. Riaďte sa najmä potrebami cieľovej skupiny. Pri návrhu farieb sa môžete inšpirovať psychológiou farieb.

Zamerajte sa na odporúčané veľkosti prvkov na webe

Správne použitie prvkov na webe je ďalším kľúčovým aspektom UX dizajnu. Web, ktorý sa pohodlne používa, zlepšuje spokojnosť používateľov, znižuje bounce rate a zvyšuje konverzie. Dobrá používateľnosť webu však nemusí byť len o príjemnom spracovaní úvodnej stránky alebo produktov. Majte na pamäti aj detaily:

 “Nezabúdajte, že aj detaily sú rozhodujúce. Často sa stretávam pri analýze webu s takzvaným Fat Finger Syndrome. Ide o situáciu, keď používatelia kvôli relatívne malým veľkostiam on-screen prvkov (tlačidlá, odkazy) omylom kliknú na nesprávnu oblasť alebo tlačidlo na obrazovke. To môže viesť k nezamýšľaným akciám, ako je výber nesprávnej možnosti či presmerovanie používateľa na nechcené miesto. Napríklad, Apple odporúča minimálnu veľkosť on-screen prvkov 44 x 44 px. Android na druhej strane odporúča veľkosť 48 x 48 dp (device-independent pixels). Uistite sa, že máte všetky interaktívne plochy na webe dostatočne veľké.”

Aké sú aktuálne trendy v UX?

AI v spolupráci s UX

Umelá inteligencia je v dnešnej dobe bežnou súčasťou našich životov a taktiež aj práce UX dizajnérov.

V jednoduchšom ponímaní je AI pre UX dizajnéra pomôckou pri textových úpravách, ako je napríklad pomenovanie tlačidiel alebo konštruovanie nadpisov.

AR na výslní

Už aj e-shopy začali využívať výhody rozšírenej reality na predaj svojich produktov. Iba pomocou webkamery si zákazník môže z pohodlia domova vyskúšať okuliare či farbu rúžu na perách.

V komplexnejšom ponímaní je AR využiteľné aj vo vizualizáciách v reálnom čase. Napríklad, Ikea ponúka jednoduché prezeranie katalógu produktov (IKEA Kreativ) a následne ich kombinuje v realistických priestoroch. Produkty je možné presúvať, otáčať a upravovať podľa potreby.

Používatelia chcú personalizované produkty

Každý máme iné potreby a vyžadujeme si v niektorých prípadoch produkty na mieru. Ponúknite zákazníkom konkrétne spôsoby, ako dokážete vyhovieť ich potrebám.

Ideálnym príkladom je Netflix. Vďaka automatizácii vytvorí každý účet jedinečný. Algoritmus totiž navrhuje filmy a seriály na základe vašej histórie pozerania.

“Personalizácia si vyžaduje množstvo dát, na základe ktorých sa algortimus rozhoduje. Dáta môžu obsahovať informácie o navštívených produktoch, o dĺžke prezerania produktu alebo o navštívených kategóriách. V rámci dát je možnosť ich získať aj priamo od zákazníka – často už v profile zákazníka (po registrácii) je možné požiadať o ďalšie dobrovoľné údaje. 

V rámci príkladov personalizácie, pri fashion e-shope môžete použiť veľkosť oblečenia alebo obuvi. Online lekárne zase pracujú napríklad s dátami o potravinách, kde zobrazujú možné alergény. Pri e-shope s domácimi miláčikmi vieme pracovať s dátami o konkrétnom druhu zvieraťa. Pri získaní spomínaných dát pri jednotlivých e-shopoch viete pomocou rôznych pluginov zobrazovať personalizovanú ponuku produktov.”

Priorizujte mobilnú prístupnosť

Dáta hovoria, že až 95,8 % používateľov používa na prezeranie internetu primárne mobilné zariadenia. Problematika zamerania sa na mobily je stále nielen aktuálna, ale aj nevyhnutná.

Nezabúdajte preto ani na prístupnosť – Web Accessibility; na zákazníkov, ktorí sú zmyslovo znevýhodnení a využívajú na nakupovanie svoje mobilné zariadenia. Ide o skupinu ľudí, na ktorých sa najmä pri riešení prístupnosti zabúda.

OpiTip: Napriek trendu používania mobilných zariadení, nezabúdajte na celkovú funkčnosť naprieč rôznymi zariadeniami. Prispôsobte webové rozhranie tak, aby bola cross-device skúsenosť čo najlepšia.

UX auditom predídete množstvu problémov

UX design sa neustále vyvíja a zohráva kľúčovú úlohu pri úspešnom e-shope. Používateľsky príjemným dizajnom nielenže zvyšujete spokojnosť zákazníka na webe, ale budujete aj jeho lojalitu a úspech produktu či značky.

Ak máte viac konkrétnych otázok a výziev s vaším e-shopom, neváhajte kontaktovať našu konzultantku – Janku Pollákovú.