Základy UX pre e-shopy

Na to aby sme si povedali ako pomocou UX dosiahnuť lepšie výsledky alebo vytvoriť optimálne rozloženie stránky e-shopu je dôležité, aby sme si vysvetlili čo to UX je. 

UX je skratka pre User Experience, teda celkovú skúsenosť používateľa s akoukoľvek aplikáciou, a veľmi často sa s týmto výrazom stretneme v kombinácii so slovom design ako UX design alebo User Experience Design. Práve pre kombináciu skratky UX a slova „dizajn“ si ľudia často myslia, že UX dizajn je to isté ako webdizajn (UI) alebo návrh dizajnu rôznych stránok, respektíve že ide o grafiku a vizuálny návrh.

Cieľom UX dizajnu je však niečo úplne iné, a to vytvorenie vzťahu medzi používateľom a značkou. To znamená, že v centre pozornosti je používateľ. Je to proces, ktorý nás sprevádza návrhom produktu alebo služby od jeho začiatku až po jeho spustenie alebo nasadenie do produkcie.

Rozdiel medzi UX a UI dizajnom, a zároveň aj vysvetlenie dôvodu prečo si okrem vizuálu stránky treba dať záležať aj na rozložení, si vysvetlíme na jednoduchom príklade fliaš kečupu. 

Na obrázku vľavo vidíme fľaše kečupu, ktoré podliehajú nejakému dizajnu. Dá sa povedať, že na prvý pohľad je dizajn oboch fliaš dobrý a plní svoj účel. Na obrázku vpravo vidíte, že napriek dobrému dizajnu oboch fliaš je zážitok z ich použitia rôzny, a práve ten bude mať ďalší vplyv na nákupné rozhodovanie zákazníka. Preto treba klásť na UX rovnaký dôraz ako na celkový vizuál. 

Jednou z chýb pri tvorení webov, e-shopov alebo aplikácií je, že nepoznáme svojho zákazníka a často sa zameriavame primárne na kvantitatívne údaje, ako sú analytika a technická časť riešenia a špecifikácia funkcií, ktoré chceme aby e-shop obsahoval, pretože to bude riešiť naše konkrétne problémy.

However, there is not enough space for the customers, so we don’t know their key concerns and needs and how to meet them, which is often reflected in the profitability and effectiveness of the e-shop and running campaigns.

Nevenujeme však dostatočný priestor zákazníkovi, teda nevieme čo sú jeho kľúčové obavy a potreby, a ako ich naplniť, čo sa často odzrkadľuje v ziskovosti a efektivite e-shopu a spustených kampaní. Dôležitosť kladenia dôrazu na „spoznanie“ zákazníka si vysvetlíme na nasledujúcom príklade. Ako príklad môžeme vziať dvoch ľudí, pochádzajúcich z rovnakej krajiny, v rovnakom veku, s rodinou, obaja chodia na dovolenky na rovnaké miesta, ale rozdiel medzi nimi je napr ich profesia, životný štýl, alebo náboženstvo, ktoré ovplyvňujú ich nákupné správanie.

Rozloženie obsahu v e-shope

Predstavili sme si čo UX je, s čím súvisí a prečo si na ňom treba dať záležať. Teraz si tento výraz rozoberieme podrobnejšie na príklade konkrétneho webu e-shopu. 

Úvodná stránka

Jedna z najdôležitejších stránok v e-shope je bezpochyby úvodná stránka. Tú totiž zákazník pri návšteve e-shopu vidí ako prvú. Táto stránka takisto zohráva dôležitú úlohu pri rozhodovaní návštevníkov, ktorých môžeme rozdeliť na 3 základné typy:

1. zákazník, ktorý prišiel do e-shopu a vie presne čo chce,
2. zákazník ktorý má predstavu čo by chcel, ale nevie to konkrétne,
3. zákazník, ktorý hľadá inšpiráciu, teda nemá konkrétnu predstavu, čo by nakúpil.

Každý typ zákazníka pristupuje k nakupovaniu iným spôsobom, a preto by rozloženie úvodnej stránky malo zodpovedať ich nákupnému správaniu. Základom je vytvorenie atraktívneho obsahu na úvodnej stránke, najmä v prípade, že svojich zákazníkov dobre poznáte.

Existujú však všeobecné pravidlá, ako vybudovať vhodný obsah pre zákazníkov e-shopu napr. Umiestnenia banner pre promo akcie a sezónne produkty, ktorým však netreba vyčleňovať zbytočne veľa priestoru, pretože nie vždy prinesú toľko preklikov, koľko očakávate. Výnimkou bývajú sezónne zľavy prípadne skutočne atraktívne zľavy či ponuky. Pod bannerom je vhodné umiestniť základné informácie o nákupe, ktoré používateľa zaujímajú, teda možnosti platieb, čas dodania produktov, doprava, reklamácie atď.

Na používateľov veľmi dobre funguje zobrazenie najpopulárnejších kategórií v kombinácii s produktami napr. obľúbené v kategórii, najobľúbenejšie produkty, top produkty v ponuke, prípadne najobľúbenejšie značky.

Odporúčanie produktov a komunikácia zliav funguje najmä na typ zákazníka, ktorý nie je ešte rozhodnutý, čo chce kúpiť, alebo hľadá inšpiráciu. Pri nových zákazníkoch si často musíte získať ich dôveru. V tom vám pomôžu napríklad recenzie zákazníkov, ktorý už u vás nakúpili, prípadne overenie od rôznych recenzných portálov.

Spodná časť úvodnej stránky sa využíva na komunikáciu obsahu, ktorým sa snažia e-shopy podporiť predaj. Vo väčšine prípadov je to vo forme blogu alebo zobrazených príspevkov zo sociálnych sietí. Ak používateľa zaujmete obsahovou časťou, je možné že bude viac motivovaný odoberať novinky alebo sledovať vaše sociálne siete, preto je toto vhodné miesto na umiestnenie takéhoto typu obsahu. 

Hlavička

Úvodná stránka, ako každá iná stránka, musí začínať hlavičkou, v ktorej sa štandardne nachádza logo, ktoré slúži ako preklik na úvodnú stránku, prehľadná navigácia napríklad vo forme mega menu, viditeľné a rozbalené vyhľadávacie pole a klasické náležitosti e-shopu ako košík so sumárom ceny, možnosť prihlásenia/vytvorenia účtu, preklik do zoznamu želaní, atď.

Hlavička je kľúčová hlavne pre typ zákazníka, ktorý vie čo chce a vo väčšine prípadov použije vyhľadávanie, čo znamená, že pravdepodobnosť nákupu je vysoká. Navigáciu používajú najmä zákazníci, ktorí nevedia úplne presne, čo chcú.

Päta

Každá stránka zvykne končiť pätou, ktorá sa často neprávom podceňuje. Päta je miesto, kde používateľ často hľadá informácie o spôsoboch dopravy, možnostiach platby, kontaktné informácie, reklamácie, preklik na sociálne siete a pod. Ak sa používateľ preskroluje až na koniec stránky, je pravdepodobné, že niečo hľadal alebo ho obsah e-shopu oslovil, preto je vhodné do päty umiestniť okrem legislatívnych položiek aj odkazy na hlavné kategórie e-shopu, aby zákazník mohol pohodlne pokračovať v prehliadaní webu.

Navigácia

Navigácia a štruktúra e-shopov má obrovský vplyv na konverzie, predaje a miery okamžitých odchodov. Je to logické, ak totiž používatelia nevedia zistiť, kde a ako nájsť to, čo chcú alebo kde sa nachádzajú, jednoducho odídu preč a už sa nevrátia. Bez prehľadnej a funkčnej navigácie totiž nezistia, ako prechádzať produktovým katalógom, ako nájsť blog, či zistiť, kde sídli vaša kancelária alebo predajňa.

Ak si má používateľ predstaviť hlavnú navigáciu na webe alebo v internetovom obchode, väčšinou si predstaví horizontálnu ponuku umiestnenú v hlavičke. Často využívaný priestor pre hornú – hlavnú navigácie je bočný panel. Keď používateľ prejde do kategórie najvyššej úrovne, zobrazia sa mu v bočnom paneli podkategórie. Navigačné prvky v bočnom paneli sú skvelým riešením pre internetové obchody alebo webstránky, ktoré obsahujú množstvo štruktúrovaných informácií. Okrem podkategórií poskytuje skvelý priestor pre filter produktov.

Štandardným a efektívnym riešením je už spomenuté mega menu, teda veľká navigačná lišta, ktorá sa zobrazuje po prejdení myšou na položku v hlavnom menu. Je skvelou voľbou na umiestnenie veľkého počtu položiek v štruktúre produktových kategórií alebo na zobrazenie väčšieho množstva podstránok nižšej úrovne. Takéto prehľadné rozloženie tiež ponúka viac priestoru napríklad na zobrazenie produktov alebo reklamy a zároveň viac miesta pre položky, a tým zlepšuje používateľský zážitok zákazníkov.

Vyhľadávanie a výsledky

Okrem navigačného menu je vyhľadávanie jedným z najdôležitejších navigačných prvkov pretože používatelia pravdepodobne uprednostňujú vyhľadávanie pred navigačným menu, ak vedia, že sa produkt alebo kategória, ktorú hľadajú v internetovom obchode nachádza.

Na základe našej štúdie vieme, že približne 30 % používateľov opustí web alebo internetový obchod, ak nenájdu, čo hľadajú. To, či používateľ uprednostní vyhľadávanie pred navigačným menu, závisí od rôznych faktorov. Hlavnú úlohu však hrá už spomínaný typ používateľa, ktorý príde na stránku a takisto segment, na ktorý je e-shop zameraný.

Výsledky vyhľadávania tiež zohrávajú samostatnú úlohu v nákupnom správaní používateľov. Táto stránka je veľmi podobná klasickému výpisu produktov v e-shope. Typickým problémom vyhľadávania je však to, že nie je dostatočne inteligentné na to, aby používateľovi poskytlo výsledky, ktoré odzrkadľujú jeho záujmy a nákupné správanie. Používatelia sa preto často dostanú na stránku bez výsledkov, čo v tretine prípadov znamená ich okamžitý odchod z e-shopu.

Druhým bežným problémom je, že nie je možné filtrovať produkty nájdené na stránke s výsledkami alebo že dostupné filtre sú obmedzené. To znamená, že vyhľadávanie nemôže fungovať s fazetovými filtrami a používateľ musí vyhľadávať vo výsledkoch namiesto toho, aby mohol filtrovať produkty podľa svojich preferencií.

Záznam o produkte

Zoznamy produktov sú nevyhnutnou súčasťou e-shopu, ktorý používateľov nasmeruje na konverziu na detail produktu. Základné rozloženie výpisov produktov, presnejšie zobrazovaných kategórií v e-shope pozostáva z:

Rozšírená hlavička

Rozšírená hlavička s názvom kategórie spolu s popisom, v ktorom sa používateľ nachádza. Používateľom môžete pomôcť aj pridaním tipov na výber správneho produktu pre váš štítok.

Strienka

Breadcrumb, alebo inak drobenková navigácia, sa používa v kombinácii s vyhľadávaním. Pre používateľov je jednoduchšie „cestovať“ do kategórie, ktorá ich zaujíma, a nepoznajú napríklad jej presný názov. Následne sa môžu pomocou strúhanky preklikať cez detail hľadaného produktu do želanej kategórie.

Možnosti zoradenia

Pod názvom a popisom kategórie sa často používa na zobrazenie podkategórií alebo filtrov produktov s možnosťami zoradenia. V predvolenom nastavení sa však zvyčajne zobrazujú na bočnom paneli.

Bočný panel

Bočný panel často slúži na zobrazenie podkategórií, produktových filtrov v kategórii, či spomínaných fazetových filtrov vo výsledkoch. Predpokladajme, že filter bočného panela nie je dostatočne optimalizovaný alebo štruktúra kategórií nie je primerane spracovaná. V takom prípade je obsah bočného panela výrazne dlhší ako obsah stránky, čo negatívne ovplyvňuje správanie používateľov.

Obsah

Ústrednou časťou je obsah stránky, ktorý pozostáva z produktov, pričom každý produkt by mal mať zobrazený minimálne:

1. Ukážka obrázka
2. Názov produktu
3. Cena alebo zobrazená pôvodná cena
4. Dostupnosť produktu alebo odhadované doručenie a počet produktov na sklade
5. Tlačidlo „pridať do košíka“ závisí hlavne od segmentu. Ak ide o oblečenie, ktoré závisí od veľkosti, na tom až tak nezáleží, ale ak sú to napríklad knihy, potom by použitie gombíka dávalo zmysel
6. Marketingové prvky – popis noviniek, zľava, výpredaj, výhodné balenie, posledné kusy – sú rôzne formy, ako zatraktívniť produkty pre užívateľa
7. V zozname môžete pre produkty zobraziť čokoľvek tak, že sa zamyslíte nad kritickým faktorom alebo faktormi, podľa ktorých sa používateľ rozhoduje, ako je počet farieb alebo iných variácií atď.

Častou otázkou je, ako by malo vyzerať ideálne stránkovanie v e-shope a či použiť tlačidlo “zobraziť viac” alebo šípky. Obe možnosti fungujú dobre, no spája ich dokonalé riešenie, kde si používateľ vyberie riešenie, ktoré mu najviac vyhovuje.

Pri zaraďovaní produktov sa vyhnite nekonečnému rolovaniu, ktoré nachádza uplatnenie v úplne iných prípadoch prezerania obsahu, napr. na sociálnych sieťach, v galériách a pod., nie však pri nakupovaní.

Podrobnosti produktu

Detail produktu je jednou z primárnych „konverzných“ stránok e-shopu a práve tu prebieha najväčšie rozhodovanie. Detail pre užívateľa môžeme rozdeliť na dve podstatné časti – nákupnú časť a informačnú časť.

Nákupná časť

Nákupná časť predstavuje základné parametre a informácie, ktoré priamo ovplyvňujú rozhodnutie užívateľa. Ideálne zloženie tejto časti detailu produktu pozostáva z:

Fotografie/galéria produktov

Zobrazujte vždy čo najviac obrázkov produktu – video alebo video recenzia produktu, všetko v najlepšej možnej kvalite. Aj z produktových fotografií/videí získa používateľ množstvo informácií, ktoré nemusia byť v popise. V tejto sekcii sa často používajú štítky alebo informácie o zľave/akcii, novinkách či rôznych oceneniach či certifikátoch.

Značka produktu

Značku produktu kliknutím na jeho detail a zobrazí všetky produkty a kategórie len vybraných značiek.

Názov produktu

Ideálne je, ak sa okrem názvu produktu skladá aj zo značky alebo s označením variácie, napr. červená, metalíza, XL a pod.

Kód produktu

Veľký význam najmä v B2B e-shopoch, ale pomáha aj zákazníkom, ktorí opakovane nakupujú rovnaké produkty v B2C e-shopoch,

Kategória

Kategória, v ktorej sa produkt nachádza, zohráva dôležitú úlohu pri navigácii užívateľa, najmä ak sa na produkt dostane reklama alebo ho objaví pri vyhľadávaní na internete.

Parametre produktu

Parametre produktu – veľkosť, varianty, farby atď. – podstatná úloha pri rozhodovaní, ideálne umiestnené v blízkosti informácií o dostupnosti a cene pri tlačidle „do košíka“. Keď používateľ zmení niektorý z parametrov, mal by vidieť zmeny v cene, dostupnosti alebo iných hodnotách, ktoré ho zaujímajú.

Dostupnosť

Dostupnosť vystaveného produktu v e-shope a predajniach.

Doručenie

Rýchlosť dodania alebo odhadovaný dátum dodania – čím presnejší odhad môžete uviesť, tým spokojnejší bude používateľ po nákupe.

Tlačidlo Pridať do košíka

Najdôležitejšie tlačidlo na stránke by malo byť vždy jasne definované a nezameniteľné. Kdekoľvek sa na stránke nachádza, vždy musí byť jasné, že ide o tlačidlo na pridanie do košíka. Vzor tlačidla závisí od obchodného segmentu, spôsobu komunikácie a samotného dizajnu e-shopu. Ak napríklad predávate online luxusné elektrické motocykle, môžete jednoducho použiť čierne tlačidlo s textom kúpiť. Ak však predávate a doručujete jedlo, zrejme bude vhodnejšie zelené tlačidlo s textom v košíku. Tlačidlo zvyčajne zobrazuje pole so sumou, ktorú používateľ môže alebo chce pridať do košíka.

Cena produktu

Najrozhodujúcejšia časť nákupu. V e-shopoch často pracujeme s akciami a zľavami, preto je dôležité ich komunikovať. Ak produkt zľavíte, zobrazte štítok zľavy a pôvodnú cenu. Taktiež nie je najlepším riešením zľaviť všetky produkty súčasne, pretože to môže narušiť exkluzivitu produktu.

Ďalšie funkcie

Doplnkové funkcie ako zoznam želaní, zdieľanie alebo veľkostná tabuľka sú bežné prvky, na ktoré je používateľ zvyknutý alebo ktoré detailne očakáva. Za názvom produktu sa zvyčajne umiestňuje krátky popis produktu, prepojený s informačnou časťou stránky.

Výhody e-shopu

Darček k nákupu a informácia o cene doručenia, ktorá sa zvyčajne prepočítava na základe počtu produktov v košíku, prípadne vernostný systém či jednoduchá komunikácia pri vrátení tovaru.

Informačná časť

Informačnú časť produktu tvorí najmä hlavný popis produktu a jeho vlastností. Jeho súčasťou by mala byť aj galéria, videorecenzie či prezentácie, tabuľka všetkých parametrov produktu, popis výrobcu a rôzne doplnkové materiály na stiahnutie.

V tejto sekcii je často priestor na recenzie alebo otázky návštevníkov, napríklad diskusia formou Q&A. Samotné recenzie sú pre používateľov cenným zdrojom informácií a zároveň podporujú dôveryhodnosť e-shopu. Čím lepšie je spracovaný detail produktu a čím lepšie sú produkty popísané, tým je väčšia pravdepodobnosť, že používatelia v e-shope nakúpia.

Detail produktu je skvelé miesto, kde môžeme užívateľom pomocou odporúčaní rýchlo pomôcť objaviť ďalšie produkty alebo kategórie v ponuke e-shopu. Odporúčania je vhodné umiestniť priamo pod centrálnu nákupnú časť na detail produktu, aby získali dostatok priestoru a zbytočne neodvádzali pozornosť od hlavného produktu.

Pri prezeraní odporúčaní je nevyhnutné dávať pozor, aby si ich používateľ nepomýlil napríklad so spomínanými variáciami. Tie by mali byť umiestnené vyššie v blízkosti nákupného tlačidla a parametrov produktu.

Nákupný košík

Nákupný košík je vstupnou bránou do nákupného procesu. Košík má v porovnaní s ostatnými časťami stránky zjednodušené rozhranie, ktoré používateľovi pomáha sústrediť sa na dokončenie nákupu a vyhnúť sa opusteniu nákupného košíka. Často využívanou funkciou košíka je načasovanie produktov, ktoré upozorňuje užívateľov, že produkty tam budú len určité obdobie, a tým ich motivuje k rýchlejšiemu rozhodovaniu a nákupom.

Ideálne zloženie nákupného košíka pozostáva z nasledujúcich častí a parametrov:

• Zjednodušená hlavička bez navigácie – umožňuje vám rýchlo sa vrátiť na predchádzajúcu stránku alebo domovskú stránku a zobraziť ďalšie kroky v procese nákupu, ktoré na používateľa čakajú
• Informácie o bezplatnej doprave alebo darčeku fungujúce na rovnakom princípe – ideálne umiestnené pod hlavičkou nad súhrnom produktov
• Súhrn produktov v košíku – štandardne by mal zobrazovať produkty s konečnou cenou a možnosťou zmeniť ich čísla alebo ich z košíka odstrániť. Produkty musia vykazovať zvolené parametre a možnosť kliknutia na ich detail v e-shope
• Konečná cena produktov – zobrazí sa hneď po zhrnutí produktov a mieste ku kódu pre zľavový kupón
• Odporúčanie produktu – košík je ideálne miesto na podporu nákupu odporúčaním. Miesto na umiestňovanie odporúčaní je tesne nad alebo pod tlačidlami „vrátiť sa späť“ a „dokončiť nákup“. Pozícia závisí od obsahu produktov v odporúčaní. Ak je v bloku s produktom priveľa parametrov a zaberá príliš veľa výšky, umiestnime ich úplne dole, ale ak sú kompaktné a nie príliš vysoké, pohodlne ich umiestnime nad spomínané tlačidlá, potom dostanú viac pozornosť používateľa. Nikdy však neukladajte odporúčané produkty do súhrnu košíka nad vloženými produktmi. To zmiasť používateľov, ktorí očakávajú, že uvidia úplne iné produkty, čo ich môže povzbudiť, aby stránku opustili.

V ideálnom prípade predpokladajme, že už v tejto časti môžete používateľom oznámiť, aké možnosti platby a dopravy im môžete ponúknuť pri nákupe bez toho, aby ste museli prejsť na ďalšie kroky, aby ste zistili informácie. V takom prípade si zlepšíte štatistiky a znížite mieru odchodov.

Proces nákupu

Najčastejšie používaný nákupný proces je viackrokový. Na rozdiel od alternatívnych riešení, ako je napríklad jednokrokový/jednostránkový nákupný proces, prináša viac výhod a možností.

Jednokrokový proces je efektívny najmä vtedy, keď sa používa na začiatku podnikania v e-shope alebo v jednoduchších prípadoch, keď e-shopy neponúkajú viac možností platby a dopravy v procese nákupu a používatelia nie sú zvyknutí príliš veľa nákupov z hľadiska veľkého počtu položiek.

Nevýhodou je však meranie nákupného procesu, keďže celý proces je len jeden krok. Nákup každého používateľa znamená opustenie celého procesu nákupu; na základe toho; len ťažko vieme odhadnúť, kde bol problém.

Výhodou viackrokového nákupného procesu je najmä prehľadnosť a výrazne lepšie merania prechodu nákupným procesom vďaka rozdeleniu do niekoľkých krokov:

Nákupný košík alebo súhrn košíka

Súhrn produktov, ktoré sa zákazník rozhodol pridať do košíka.

Výber platby a dopravy

Táto časť nákupného procesu je jednoduchá, ale za predpokladu, že všetky možnosti pre používateľa sú dostatočne popísané a dodané so všetkými dôležitými informáciami, nielen s názvom výberu a poplatkom, ale aj s ďalšími informáciami, ako je výber doručenia kuriérom, ktorý služby doručovacej spoločnosti, ktoré využívate, doručenie tovaru len v pracovné dni alebo aj cez víkendy, dátum, kedy môže tovar očakávať a pod.

Predpokladajme, že si zákazník zvolí osobný odber. Vtedy by mali mať na výber vybrať si predajňu a automaticky vidieť otváraciu dobu, konkrétnu adresu predajne, ideálne aj telefón a samozrejme dátum, kedy si budú môcť tovar vyzdvihnúť. Používatelia často navštevujú možnosti dopravy a platby, aby zistili, aká bude konečná cena ich nákupu s doručením a kedy ho budú mať, aj keď sa ešte nerozhodli nákup dokončiť.

Prihláste sa do svojho účtu a zadajte svoje fakturačné a dodacie informácie

Toto je pre používateľa často najviac frustrujúca časť nákupu, pretože často ide o vypĺňanie formulárov. Aj keď sa používateľ neprihlási, môžeme jeho vyplnenie zjednodušiť použitím mena, telefónneho čísla a e-mailovej adresy. Potvrďte každé pole pri vypĺňaní, aby používateľ vedel, že zadal správne informácie. Požiadajte používateľa o údaje jeden po druhom; ak má záujem o registráciu, zobrazí polia na zadanie hesla až po zvolení tejto možnosti. V nasledujúcich krokoch budete potrebovať fakturačnú a dodaciu adresu.

Používateľom môžete uľahčiť vypĺňanie adries automatickým dopĺňaním, aby ste mohli vyplniť fakturačnú alebo dodaciu adresu. Ak používateľ zadá ulicu a číslo, nemusíte sa obávať vypĺňania ďalších nepotrebných polí. Vyplnenie údajov sa spravidla končí udelením súhlasu. Pokúste sa túto časť čo najviac zjednodušiť a formulovať čo najjednoduchšie. V sekcii osobných údajov je často možnosť pridať poznámku k nákupu od zákazníka, no ak si nie ste istí, že vám tieto poznámky nebudú chýbať, radšej s nimi nepracujte vôbec, znížite tak pravdepodobnosť zlá používateľská skúsenosť.

Zhrnutie celého nákupu + kontrola zadaných údajov

Používateľ sa môže rozhodnúť niečo zmeniť, preto je vhodné umožniť mu prejsť na ktorýkoľvek krok zo samotného výpisu bez toho, aby musel klikať na tlačidlá „späť a pokračovať“. V tomto kroku musí vidieť všetky podstatné údaje pre svoje rozhodnutie a odoslať objednávku. Nezabudnite ich preto informovať o konečnej cene nákupu a v ideálnom prípade o čo najpresnejšom odhade času doručenia objednávky.

Po odoslaní objednávky je ideálne, ak sa užívateľ dostane priamo k platobnej bráne a až po zaplatení takzvanej stránky “Ďakujem”; vyhnete sa tomu, že používateľ zatvorí stránku skôr, ako bude presmerovaná na platbu, čo v konečnom dôsledku sťažuje nákupný proces nielen jemu, ale aj vám. Stránka „Ďakujem“ je v zásade tiež súčasťou nákupného procesu a poskytuje najmä informácie o úspešnom nákupe. Jeho veľkou výhodou je, že informácie od zákazníka získate vďaka jednoduchému formuláru.

Na tejto stránke môžete okrem iného motivovať anonymného alebo prihláseného užívateľa, aby sa stal verným zákazníkom a uskutočňoval ďalšie nákupy špeciálnymi ponukami alebo zľavovými kódmi alebo ho nasmerovať na iný obsah v e-shope, ako sú odporúčania produktov alebo, napríklad články na blogu, alebo si môžete nastaviť aj emailové kampane na rozosielanie ponúk.

Nakupovanie na mobile

Nakupovanie na mobilných zariadeniach predstavuje neustále rastúci trend a mobil zohráva stále väčšiu úlohu v nákupnom správaní používateľov. Je bežným zvykom pred samotným nákupom realizovať prieskum, na základe ktorého sa neskôr používatelia rozhodnú či a kde daný produkt zakúpia, a práve na mobilných zariadeniach tento prieskum väčšinou prebiehal. Zaujímavosťou je napríklad, že počas Black Friday a Cyber ​​Monday v roku 2020 sa približne 69 % predaja v USA uskutočnilo na mobilných zariadeniach.

Na rastúci trend mobilných nákupov má vplyv veľa faktorov ako napr. technologický pokrok, pokrytie a dostupnosť vysokorýchlostného internetu, cenová dostupnosť mobilných zariadení, mobilné platobné služby ako Apple Pay a Google Pay, ale aj podpora e-shopov vývojom vlastných ecommerce aplikácií a snaha o dosiahnutie čo najlepšieho nákupného zážitku pre používateľa. Jedným zo spôsobov ako dosiahnuť skvelý používateľský zážitok je pochopiť, ako používateľ ovláda mobilné zariadenie.

Odporúčané rozloženie e-shopu podľa tepelnej mapy

Vďaka testom a analýzam správania používateľov vieme určiť pomocou zobrazenia tepelných máp akým spôsobom používatelia interagujú s obrazovkou displeja a vďaka tomu vieme presne definovať ako navrhnúť rozhranie aplikácie alebo webovej stránky tak, aby s ňou používateľ dokázal pohodlne pracovať. Jednotlivé farby nám interpretujú, ako ľahko sa rôzne časti obrazovky používajú.

Tieto informácie sú pre nás významným vstupom pri návrhu používateľského rozhrania a rozloženia kľúčových prvkov, pretože rozloženie týchto prvkov na správnych miestach obrazovky výrazne zlepšuje používateľský zážitok, nakoľko priestor na displeji mobilných zariadení je oproti obrazovkám klasických počítačov značne obmedzený.

Kľúčové časti v e-shope na mobilnom zobrazení:

Hlavička

Ideálne by mala spĺňať konkrétne parametre, aby poslúžila ako efektívny navigačný prvok, ďalej by mala byť kompaktná, nie moc vysoká, pretože používateľa pripraví o miesto v obsahu a bude sa mu ťažko prechádzať E-shopom, a mala by obsahovať logo E-shopu s preklikom na úvodnú stránku. Často sa používa tzv. plávajúca hlavička, teda hlavička, ktorá sa zobrazuje stále, aj pri skrolovaní.

Logo

Zjednodušená verzia loga, ktorá ľahko zapadne do mobilného zobrazenia a nezaberie veľa miesta.

Hamburger menu

Kľúčová časť hlavičky, pod ktorým sa zvykne skrývať navigácia a nákupný košík, ktorý zobrazuje minimálny počet vložených položiek.

Vyhľadávací panel

Celý vyhľadávací panel, ideálne neskrývať vyhľadávanie za ikonu lupy, a tým nepripravovať používateľov o komfort pri prehliadaní e-shopu.

Vyhľadávanie na mobile

Optimalizované a funkčné vyhľadávanie na mobilných zariadeniach hrá kľúčovú úlohu pri prieskume návštevníka v e-shope. Optimalizácia spočíva v správnom rozložení prvkov a nastavení ich interakcií, ktoré používateľovi čo najviac zjednodušia jeho ovládanie ako napríklad:

• Kompaktné zobrazenie našepkávača so search barom na celej obrazovke zariadenia – výrazne zvyšuje prehľadnosť a ľahkosť použitia vyhľadávania.
• Našepkávač zobrazuje výsledky už od prvého zadaného znaku a po otvorení odporúča kategórie, najhľadanejšie frázy a obľúbené produkty, prípadne články a iný obsah.
• Pri prezeraní výsledkov v našepkávači sa virtuálna klávesnica automaticky skryje, aby mal používateľ dostatok miesta na prezeranie.
• Výsledky sú usporiadané do kariet podľa kľúčových parametrov, medzi ktorými môže používateľ preklikávať alebo ich jednoducho posúvať do strán.

Funkčnosť vyhľadávania spočíva v jeho správaní pri interakcii s používateľom. Efektívne vyhľadávanie by malo používateľa vždy priviesť k relevantnému výsledku a malo by zohľadňovať jeho bežné správanie nezávisle od toho ako napíše vyhľadávanú frázu, či napíše názov s preklepmi, použije slangový výraz alebo archaizmus a pod.

Záver

Používatelia vždy vyhľadávajú zážitok ušitý na mieru, preto dnešným e-shopom dobre vyzerajúci web nestačí. Na webe všetko musí prebiehať ako po masle a ako predajca musíte dokázať predvídaťkaždý ďalší krok zákazníka. Veríme, že tento blog vám pomôže využiť UX dizajn vo svoj prospech a získať viac spokojných zákazníkov.

Často kladené otázky

Aký je rozdiel medzi používateľským rozhraním a používateľským rozhraním, keď sú zvyčajne uvedené spolu?

Na najzákladnejšej úrovni sa používateľské rozhranie (UI) skladá zo všetkých prvkov, ktoré umožňujú niekomu interagovať s produktom alebo službou. Na druhej strane používateľská skúsenosť (UX) je to, čo si jednotlivec, ktorý interaguje s týmto produktom alebo službou, odnáša z celej skúsenosti. Je nevyhnutné odlíšiť celkovú používateľskú skúsenosť od používateľského rozhrania (UI), hoci používateľské rozhranie je kritickou súčasťou dizajnu. Ako príklad si predstavte webovú stránku s recenziami filmov. Zatiaľ čo používateľské rozhranie na nájdenie filmu je dokonalé, UX bude zlé pre používateľa, ktorý chce informácie o menšom nezávislom vydaní, ak základná databáza obsahuje iba filmy z veľkých štúdií.

Ako potvrdiť dôveryhodnosť E-shopu?

• platný certifikát SSL
• vyhlásenie o ochrane osobných údajov
• aktuálne ceny / nezľavujte všetky produkty naraz
• existujúca adresa a telefónne číslo
• dávajte si pozor na pravopisné a gramatické chyby
• možnosť písať recenzie e-shopu
• odkazy na sociálne siete
• A/B testovanie

Porastie záujem o online nakupovanie aj po pandémii?

Vďaka lockdownom sa logicky zvýšil záujem o online nakupovanie. Tržby elektronického obchodu vzrástli v roku 2021 v zahraničí až o niekoľko miliárd dolárov a na Slovensku o vyše 2 miliardy EUR. Či to zostane na 100%, sa nedá predpovedať. Napriek tomu sa počas dvoch rokov pandémie online priestor vyvinul a prispôsobil situácii tak, aby bol celý online nákupný proces čo najrýchlejší a najpohodlnejší.

Ako prilákať návštevníkov e-shopu?

• pekný dizajn
• reklamy
• „Spoznajte“ svojho zákazníka
• recenzie a kliknutia na sociálnych sieťach
• zamerajte sa aj na detaily – rozloženie stránky zohráva významnú úlohu
• nenaliehajte na zákazníkov registráciou alebo bulletinom
• pomoc používateľom
• zľavy a ponuky – výhody pre registrovaných používateľov