UX e-shopu: proč se vyplatí a jak to řešíme v ByznysWebu

V době, kdy polovinu návštěvnosti vašeho webu tvoří boti a pozornost zákazníků je kratší než kdy dřív, se často zapomíná na to nejdůležitější: e-shop musí být především jednoduchý a rychlý.

Mnoho majitelů e-shopů se snaží do designu „nacpat“ co nejvíce funkcí. Výsledkem ale bývá zahlcení zákazníka, které vede k jedinému – k odchodu ke konkurenci. Jak tedy skloubit moderní design s maximální mírou konverzí?

Čo vlastně znamená UX?

UX neboli User Experience je zjednodušeně odpověď na otázku: jaké je nakupovat ve vašem e-shopu? Ne z vašeho pohledu, ale z pohledu zákazníka, který vás nezná, nemá čas a má otevřených několik záložek s konkurencí.

Dobré UX není o tom, aby e-shop vypadal „hezky“. Je o tom, aby zákazník bez přemýšlení věděl, co koupit, jak to koupit a proč nakoupit právě u vás. Každý zbytečný krok, každá nejasná informace i každé pomalé načítání stránky vás stojí objednávku.

Technický základ je naprosté minimum

Ještě než začnete ladit barvy tlačítek nebo rozmístění jednotlivých bloků, ujistěte se, že váš web funguje bezchybně. Pokud se stránka načítá déle než dvě sekundy, ani to nejlepší UX vás nezachrání. Technické SEO a rychlost webu jsou základem, na kterém stavíme.

Pokud si nejste jistí, jestli je váš „motor“ v pořádku, doporučujeme články o Technickém SEO a praktického průvodce zrychlením e-shopu.

UX řešíme za vás už v systémových šablonách e-shopu

Tohle je důležité říct nahlas: kvalitní UX produktové stránky není výsadou e-shopů s vysokým rozpočtem na vývoj na míru.

V ByznysWebu průběžně pracujeme na tom, aby systémové šablony obsahovaly osvědčené UX prvky už v základu. Sticky nákupní lišta, přehledný výběr variant, zoom produktových fotografií, informace o dostupnosti a termínu doručení nebo naposledy navštívené produkty – to všechno nejsou doplňky, které musíte řešit sami. Jsou standardní součástí systému.

Jinými slovy: když spustíte e-shop na ByznysWebu, bude vaše produktová stránka od prvního dne navržena tak, aby prodávala. Ne aby jen dobře vypadala. Aby skutečně prodávala.

A pokud chcete jít ještě dál: vytvořit vlastní vizuální identitu, originální design nebo řešit specifické potřeby vašeho sortimentu, jsou tu řešení na míru.

Produktová stránka je váš nejlepší obchodník

Jestli existuje jedno místo, kde se skutečně rozhoduje o nákupu, pak je to právě produktová stránka. Ne homepage. Ne výpis kategorií. Právě detail produktu. Tady zákazník porovnává, zvažuje a nakonec klikne na tlačítko „Do košíku“. Nebo odejde.

Právě proto si produktová stránka zaslouží maximální pozornost. Podívejme se, co z ní dělá opravdu funkční prodejní nástroj.

Přehledná struktura

Dobrá produktová stránka má jasnou hierarchii informací. Název produktu, cena, dostupnost a tlačítko „Do košíku“ musí být vidět okamžitě, bez nutnosti scrollování. Technické parametry, recenze a další doplňující obsah mohou následovat až níže – pro zákazníky, kteří je opravdu hledají.

Zákazník by neměl přemýšlet, kde co najde. Vše musí být intuitivní:

Vizuální příběh prostřednictvím fotografií

Zákazník, který nakupuje online, si nemůže produkt vzít do ruky. Fotografie jsou jeho jediným kontaktem s tím, co kupuje. A neměly by to být jen obyčejné produktové snímky. Ideální je ukázat produkt v reálném prostředí, z různých úhlů, v detailu i v běžném používání.

Cubenest.cz je v tomto směru skvělým příkladem. Jejich produktové stránky nejsou jen seznamem parametrů. Jsou to promyšlené prodejní stránky, které zákazníkovi pomáhají představit si, jak bude produkt používat. Kvalitní fotografie ukazují produkty na pracovním stole, v cestovní tašce i při každodenním používání. Zákazník si tak snadno představí, jak mu produkt usnadní život.

Cubenest běží na systémové šabloně ByznysWebu doplněné o úpravy na míru. To, co na e-shopu vidíte, není výsledkem nákladného vývoje od nuly. Je to ukázka toho, čeho lze dosáhnout, když kvalitní základ dostane správnou vizuální podobu.

Podobný přístup zvolil také e-shop Bunt. Ten vsadil na grafický design na míru a produktová fotogalerie dokonale odráží filozofii celé značky: design, důraz na detail i atmosféru. Zákazník si neprohlíží jen technické parametry. Představuje si, jak bude produkt vypadat u něj doma.

Nákupní lišta, která zůstává stále po ruce

Tohle je jeden z detailů, který dokáže výrazně zvýšit komfort při nakupování. Když zákazník scrolluje dlouhou produktovou stránkou, čte popis, prohlíží fotografie nebo recenze, tlačítko „Do košíku“ mu zmizí z dohledu. A ve chvíli, kdy se konečně rozhodne nakoupit, musí se vracet zpět nahoru.

Každý takový zbytečný krok představuje tření v nákupním procesu. A každé zbytečné tření snižuje pravděpodobnost dokončení objednávky.

Elegantním řešením je takzvaná sticky nákupní lišta, která zůstává viditelná v horní části obrazovky i během scrollování. Zákazník má tlačítko „Do košíku“ neustále po ruce bez ohledu na to, jak hluboko se na stránce právě nachází.

V ByznysWebu je tato funkce součástí standardní výbavy. Nemusíte nic instalovat ani řešit pomocí doplňků.

Výběr variant: rozhodování nesmí bolet

Pokud prodáváte oblečení, dárkové předměty nebo jakýkoliv produkt dostupný ve více velikostech, barvách či variantách, představuje jejich výběr jeden z nejdůležitějších okamžiků celého nákupního procesu.

Zákazník musí na první pohled poznat, které varianty jsou skladem, jak se jednotlivé možnosti liší a celý výběr musí fungovat stejně pohodlně na mobilu i na počítači.

Špatně navržený výběr variant zákazníka zpomalí, zmate nebo ho od nákupu úplně odradí. Naopak přehledné řešení s jasným vizuálním odlišením dává zákazníkovi pocit jistoty. Přesně ví, co vybírá, a hned napoprvé vloží do košíku správný produkt.

Neexistuje přitom jedno univerzální řešení pro všechny e-shopy.

Fajntričko například využívá barevné swatche. Zákazník jediným pohledem vidí dostupné barvy a kliknutím okamžitě přepíná fotografie produktu.

BabyGift jde ještě dál. Personalizovaný župan si zákazník nakonfiguruje přímo na produktové stránce – vybere si barvu županu, barvu výšivky, velikost, kapuci i vlastní text. Přesto zůstává celý konfigurátor přehledný, intuitivní a snadno ovladatelný.

Oba přístupy mají jedno společné: zákazník nikdy nemusí hádat, co se právě děje.

Jak pracovat s obsahově bohatou produktovou stránkou

Ne každý e-shop prodává jednoduché produkty. Technický sortiment, stavební materiál nebo náhradní díly vyžadují velké množství technických informací. Otázkou není, jestli je uvádět, ale jak je prezentovat tak, aby neodradily zákazníka, který hledá konkrétní informace.

Pokud provozujete e-shop s technickým sortimentem (například Rainpro), kde je technických údajů opravdu hodně, využijte funkci Vlastní záložky produktu. Pomohou udržet produktovou stránku přehlednou a dobře strukturovanou. Zákazník, který hledá technickou specifikaci, ji najde okamžitě, aniž by musel procházet marketingové texty.

Dalším užitečným prvkem je funkce Navštívené produkty. Funguje jako digitální paměť zákazníka. Pokud porovnává více produktů a přechází mezi jednotlivými stránkami, snadno se vrátí přesně tam, kde skončil. Ušetří čas sobě a vám zvýší šanci, že nákup dokončí právě ve vašem e-shopu.

Co zákazníka přesvědčí k nákupu na poslední chvíli

Ve chvíli, kdy se zákazník rozhoduje, potřebuje především jistotu. Tu mu dávají dvě věci: dostatek informací a důvěra.

Zoom produktových fotografií se může zdát jako drobnost, ale u dražšího zboží nebo produktů se specifickou strukturou či materiálem často rozhoduje. Zákazník si může produkt alespoň vizuálně důkladně prohlédnout, což snižuje nejistotu a současně i počet vrácených objednávek.

Obě funkce jsou v ByznysWebu součástí standardního řešení.

Stejně důležitá je i informace o dostupnosti a termínu doručení. Tyto údaje by měly být viditelné přímo na produktové stránce, nikoliv schované v obchodních podmínkách nebo až v košíku. Informace „Doručíme do pátku“ je pro zákazníka mnohem přesvědčivější než pouhé „Skladem“. Přesně ví, kdy zásilku obdrží, a může se tak snáze rozhodnout pro nákup.

Systémová šablona vs. design na míru

ByznysWeb vám poskytne funkční a promyšlený základ už při spuštění e-shopu. Systémové šablony jsou optimalizované pro konverze, navržené podle principu mobile-first a obsahují všechny výše zmíněné prvky – sticky nákupní lištu, zoom produktových fotografií, vlastní záložky, navštívené produkty i přehledně navrženou produktovou stránku.

Pro většinu e-shopů je to více než dostačující řešení.

Pokud ale chcete jít ještě dál, vytvořit vlastní vizuální identitu, odlišit se od konkurence a nabídnout zákazníkům jedinečný zážitek z nakupování, je tu design na míru.

Příkladem jsou e-shopy jako Bunt.sk nebo ArtCrystal.cz, kde každý prvek stránky odpovídá charakteru značky, cílové skupině i způsobu, jakým zákazníci nakupují.

Rozdíl přitom není jen estetický.

Design na míru vám dává svobodu navrhnout produktové stránky přesně podle potřeb vašeho sortimentu i vašich zákazníků.

Co si z toho odnést? UX e-shopu není jednorázový projekt. Je to dlouhodobý proces.

Pravidelně se vracejte ke svým produktovým stránkám a pokládejte si jednoduchou otázku: „Je tahle informace pro zákazníka ve chvíli, kdy se rozhoduje o nákupu, opravdu důležitá?“ Pokud ne, odstraňte ji. Méně bývá často více. Každý prvek na stránce by měl mít svůj jasný účel – pomáhat zákazníkovi s rozhodnutím a usnadnit mu cestu k dokončení objednávky.

• Tip: Přečtěte si náš článek o recyklaci obsahu, ve kterém ukazujeme, jak pravidelně provádět obsahový audit webu, aby byl stále aktuální, přehledný a přinášel zákazníkům hodnotné informace.

Přemýšlíte o vlastním designu produktové stránky?

Máte pocit, že váš e-shop nevyužívá svůj potenciál naplno? Nebo uvažujete o vlastním designu produktové stránky?

Naši konzultanti vám pomohou navrhnout řešení, které bude odpovídat vašemu sortimentu, značce i očekáváním vašich zákazníků.

• Stella Digit UX konzultace a design na míru
• Výzkumak.cz UX výzkum a testování
• Kodéři ByznysWebu – připravíme a nakódujeme váš vlastní design e-shopu.

P.S.: Máte pocit, že zákazníci v košíku nakupují méně, než by mohli? V příštím článku se podíváme na to, jak zvýšit hodnotu objednávky a jak správně nastavit upsell a cross-sell, aby působily jako užitečné doporučení, a ne jako „otravný prodavač“, který zákazníkům vnucuje něco, co vůbec nepotřebují.