10 tipů, jak navrhnout použitelné nákupní vozíky
S ohledem na to je stále důležitější věnovat pozornost použitelnosti webových stránek elektronického obchodování .
Když zákazníci chtějí koupit produkt, chtějí, aby proces byl rychlý a snadný, bez problémů.
Zde je 10 tipů, které vám pomohou vytvořit užitečné pokladny pro elektronický obchod a nákupní vozíky .
1. Celá stránka a mini vozíky
Nákupní vozíky se často dodávají ve dvou podobách, plně funkční vozík, který je obsažen na vlastní stránce a "mini" nákupní vozík, který se obvykle nachází v postranním panelu nebo nad záhybem stránky. Nejlepší praxou je zahrnout obě .
Mini nákupní vozíky zobrazují informace v malém prostoru, který neodstraňuje zbytek rozvržení. Zde je skvělý příklad použitelného mini nákupního vozíku.
Když je vybrán produkt, je položka okamžitě zobrazena v mini vozíku. Jakmile budete pokračovat v nakupování, budou podrobnosti minimalizovány a zobrazí se pouze počet položek a celková cena. Také je zde odkaz na mini košík, který zobrazuje celý košík stránky.
Pomocí úplného košíku můžete poskytnout více informací a více možností než mini vozík. Například informace o produktu, odstranění / úprava položek, ceny daní a možnosti přepravy mohou být zahrnuty do celku. Níže uvedený příklad plného stránky košíku zobrazuje také mini košík v pravém horním rohu stránky.
2. Pokladna: krok za krokem nebo na jednu stránku
Použití metody krok za krokem usnadňuje zákazníkovi, aby sledoval proces platby. Podívejte se na stránku kontroly Apple.com níže. Pokladní procedura se provádí ve čtyřech krocích: přihlášení, fakturaci a odeslání, platba a nakonec ověření / úprava.
Jedná se o dobře strukturovaný proces a měli byste určitě uvažovat o použití něčeho podobného při navrhování pokladů krok za krokem.
Kromě postupu krok za krokem je další možností zahrnutí nákupního vozíku, osobních údajů a informací o přepravě / fakturaci na jednu stránku.
To může fungovat hezky, pokud je provedeno s dobrým rozložením. Následující stránky používají dobrý proces kontroly jednotlivých stránek. V horní části je tabulka, která obsahuje košík, s níže uvedenými formuláři pro nákup.
3. Spojte se z minikáru do plného vozíku s ikonou
Při vytváření nákupního vozíku existují jemné funkce, které mají vliv na zkušenosti zákazníka. Kliknutím na mini vozík byste měli odkazovat na plný košík a ikonka by se měla objevit vedle minikáru tak, aby upoutala pozornost zákazníka na mini vozík a tento odkaz.
Následující webové stránky jsou dokonalým příkladem toho. Tato tlačítka jsou v cizím jazyce, ale ikona nákupního košíku může snadno rozpoznat někdo.
4. Zjistěte, zda jsou tlačítka pro odeslání / přidání do košíku zřejmé
Při vytváření elektronického obchodu a nákupního vozíku je důležité zahrnout snadno přístupné odkazy, které zákazníkovi pomohou v procesu výplaty. Nejlepší je použít velké zřejmé knoflíky . Ujistěte se, že tlačítka obsahují jasně čitelný a srozumitelný text, jako je například 'Přidat do košíku' nebo 'Pokračovat v nákupu'.
Níže uvedená tlačítka jsou dobře navržená a dobře umístěná přímo pod informacemi každého produktu. Pokud zákazník nemůže najít tlačítko pro nákup, nemůže si koupit váš produkt!
5. Používejte rozložení založené na čitelných tabulkách
Při navrhování úplného nákupního vozíku je vždy nejlepší použít tabulkovou strukturu. Rozložení by mělo efektivně zobrazovat informace bez přerušení. Používejte standardní písma a vyvarujte se použití složitých pozadí .
Vždy používejte silné ohraničení pro oddělení buněk, ale nestranujte styly hranic. Informace v tabulce nákupního vozíku by měly být snadno vidět bez rozptýlení od jiných prvků nebo složitého stylingu.
Jedná se o velmi čistý vozík. Tabulka je snadno čitelná a obsahuje všechny potřebné prvky. Ještě důležitější je, poznamenat si obrázek. Obrázek produktu poskytuje zákazníkovi dobrý přehled o tom, co kupuje , což zákazníkům pomůže potvrdit, že skutečně nakupují produkt, který zamýšlejí.
6. Pokračujte v nákupu
Další funkcí je odkaz "Pokračovat v nakupování" . Po kliknutí by odkaz měl přivést zákazníka zpět do obchodu a katalogu. To je obecně umístěno pod tabulkou úplného nákupního vozíku, kde jej zákazník může snadno najít.
Níže uvedený příklad zobrazuje odkazy "Pokračovat v nákupu" a "Přejít na kontrolu". Všimněte si, jak snadné je najít tyto.
7. Vyhněte se příliš mnoha polím
Pro průměrného spotřebitele není nic víc nepříjemného, než vyplnění zbytečného množství vstupních polí ve formě. Chcete, aby pokladní proces byl co nejjednodušší, protože pokud zákazník to nenajde, bude s největší pravděpodobností z webu znovu nekupovat.
Udržujte počet vstupních polí minimální , vložte podobné vstupní pole do skupin a zadejte hlavičky pro každou sekci. Přiměřené množství bílého prostoru také pomůže vytvořit formu cítit více organizované.
Následující formulář je minimální a obsahuje malé množství vstupních polí.
8. Zajistěte spoustu pomocných prvků
Existuje mnoho míst, která pomáhají prvky zahrnout do nákupního vozíku a procesu pokladny.
V nákupním košíku uveďte rychlé tipy, jak nejlépe využít funkce vozíku a vysvětlit proces platby. Označení v košíku a ve formuláři k pokladně lze vysvětlit pomocí popisků .
Na stránce plateb můžete zahrnout ukázkový text o tom, co by mělo být obsaženo v každém vstupním poli, stejně jako příklady konkrétních fakturačních údajů, například obrázek, který ukazuje, kde je umístěno číslo CVD na zadní straně kreditní karty.
Ve formuláři uvedeném níže mají vstupní pole vysvětlující ukázkový text a střední sloupec obsahuje další užitečné informace.
9. Uveďte vizuální podporu
Vizuální podpora může být cokoli od diagramů po jednoduché ikony. Obrázek, který zobrazuje umístění čísla účtu na kreditní kartě, pomáhá zákazníkům prostřednictvím procesu zadávání fakturačních údajů. Ikony, které podporují text, jsou užitečné pro snadnější skenování formuláře.
Následující obrázek ukazuje velmi pohodlné klepnutí a tažení vozíku . Obrázek ikony košíku říká zákazníkům, že mohou přetáhnout položky do košíku. Nákupní košík má také značku nad ním, která říká "Drag Stuff Here."
10. Vždy zahrňte stránku ověření
Nejdůležitějším prvkem jakéhokoli procesu platby je jistě stránka ověření a úpravy jako poslední krok. Zákazníci obvykle chtějí potvrdit, že kupují správné položky. Každý dobrý proces dobíjení má tuto funkci jako poslední šanci, aby si zákazník prohlédl svou objednávku dříve, než se k ní zaváže prostřednictvím platebního procesu.
Na stránce ověření byste měli zahrnout veškeré informace o produktu do tabulky, podobně jako úplná kontrola stránky. Zákazník by měl být schopen zrušit svou objednávku nebo použít odkaz "Pokračovat v nákupu" a přidat další položky. Tlačítko dokončete proces velmi zřejmý a odstraňte i nejmenší zmatek.
Ukázky použitelných vozíků a pokladny
IconDock - Tato stránka má velmi použitelný a pohodlný vozík. Jediné, co musíte udělat, je kliknout a přetáhnout položku na panel. Automaticky vypočítává celkovou hodnotu a je velmi rychlým řešením pro nakupování.
MediaTemple - Zde je velmi pěkný cenový stůl, který obsahuje samozřejmé pokladní tlačítka s dobrým umístěním.
Středisko pro předškolní vzdělávání - tento web má vynikající plný vozík, mini vozík a postup zakázek krok za krokem ilustrovaný časovou osu.
Roxy - Jedná se o jednoduchý vozík a má také užitečný mini vozík, který ukazuje zákazníkovi běžící součet.
Mia & Maggie - Jedná se o pěkně stylizovaný vozík, který je snadno čitelný a obsahuje velké tlačítko pro pokladnu.
Mia & Maggie - Zde je další příklad od Mia & Maggie, což je jedna z výplatních stránek. Tato pokladna používá krok za krokem na jedné stránce, což je velmi chytré a použitelné rozložení.
Amazon - Amazon je další oblíbený web pro e-commerce, který používá krok za krokem.
Evel - Jedná se o velmi použitelný a rychlý poklad, aniž by bylo příliš mnoho vstupních polí na formuláři. Také si všimněte, že nákupní košík je umístěn nad formulářem, což může být pro některé zákazníky velmi výhodné.
Design by People - Další příklad perfektní výplaty jedné stránky. Tato část obsahuje shrnutí objednávky, které může být velmi užitečné. V celém formuláři existuje mnoho prvků nápovědy.
Bridge55 - Pěkný nákupní vozík s obrazem produktu.
Kosmická soda - dobrá e-commerce webová stránka používající jak mini vozík, tak i plný vozík.
Incase - dobře organizovaná pokladna s minimálním počtem polí.
Shoon - skvělý mini košík, který zobrazuje vyskakovací okno s dalšími informacemi, když kliknete na tlačítko "Přidat do košíku".
Wunderbloc - Lightbox nákupní košík.
Nudí z Southsea - dobrý mini vozík a organizovaný plný vozík.
Podnormální hodnoty - Použití mini a plného vozíku a postup zakázek krok za krokem.
AlphaStore - struktura tabulky a mini vozík s rozpoznatelnou ikonkou košíku.
Me & Mommy-to-be - krásně stylizovaný vozík, který není přes vrchol s dekorací.
Napsal výhradně pro WDD Matt Cronin z Spoonfed Design .
Které tipy jsou nejdůležitější při navrhování nákupního košíku online? Sdělte nám své připomínky.