Osiem zagadnień, o których warto pamiętać, projektując witrynę e-commerce

Temat numeru

Podejmowanie decyzji projektowych podczas tworzenia strony e-commerce, która ma zagwarantować jak najlepsze doświadczenia jej przyszłych użytkowników, zależy od wielu czynników. W procesie projektowania, zwłaszcza gdy włączeni są w niego specjaliści UX, przygotowanie pierwszych makiet poprzedzone jest wnikliwą analizą.

Analiza obejmuje m.in.:

POLECAMY

  • zakres prezentowanych ofert – czy strona oferuje kilka wersji jednego, unikalnego produktu, czy artykuły różnych producentów;
  • branżę – czy strona przeznaczona jest dla specjalistów określonej branży, czy to e-commerce z ofertą kierowaną do zróżnicowanego grona użytkowników, np. z artykułami codziennego użytku;
  • rodzaj asortymentu sklepu i związaną z tym częstotliwość zakupów – czy produkty nabywane są w miarę regularnie (np. kosmetyki), czy raczej należy się liczyć z jednorazowym zakupem danego produktu w dłuższym okresie czasu (np. AGD, elektronika itp.).

 

Uwaga

W przypadku stron e-commerce elementem kluczowym jest proces zakupowy. W poniższym zestawieniu został on pominięty, głównie ze względu na złożoność tego zagadnienia oraz możliwe warianty decyzji projektowych. Można oczywiście wskazać pewne standardowe rozwiązania, jednak ciężko rozważać całość procesu zakupu w oderwaniu od specyfiki konkretnego projektu.


Istnieje jednak kilka podstawowych elementów, które znajdziesz na każdej stronie e-commerce, niezależnie od tego, komu i jakiego rodzaju produkty oferuje, czy kierowana jest do klientów indywidualnych, czy B2B. Ten artykuł skupia się na dobrych praktykach, które warto wziąć pod uwagę podczas projektowania:

  • strony głównej,
  • strony z listą produktów,
  • podstrony produktowej,
  • koszyka,
  • modułu zgód na przetwarzanie danych.

Powyższa lista została uzupełniona o tematy, bez uwzględnienia których trudno zaplanować intuicyjne interakcje użytkownika z interfejsem: architekturę informacji, nawigację i wyszukiwanie oraz dostępności treści. 
 


Rys. 1. W sklepie na stronie Huskee.co sprzedawanych jest tylko kilka produktów, dlatego nie było konieczne tworzenie skomplikowanej struktury kategorii


1. Architektura informacji

Przemyślana struktura informacji, na bazie której prezentowana jest oferta, musi być przede wszystkim spójna i konsekwentnie stosowana w obrębie całej witryny. W przypadku obszernych kategorii, zawierających wiele produktów, zwykle są one podzielone na podkategorie, przy czym liczba poziomów takiego podziału nie powinna przekraczać trzech. Z kolei, kiedy oferta obejmuje zaledwie kilka (typów) produktów, często nie jest nawet konieczne grupowanie ich w kategorie.

Pamiętaj:

  • Złożoną ofertę odwzoruj w podkategoriach. Nie twórz ich jednak sztucznie lub na wyrost, jeśli zakres oferty nie jest rozbudowany.
  • Nadaj kategoriom etykiety ułatwiające użytkownikom zorientowanie się, jakie produkty w nich znajdzie.
  • W nazwach kategorii unikaj żargonu zrozumiałego jedynie dla wąskiej grupy ekspertów. Jeżeli oferta składa się ze specjalistycznych produktów, wyjaśnij, czym są np. ilustracje czy zdjęcia poglądowe.

2. Nawigacja i wyszukiwanie produktów

Analizując nagrania interakcji użytkowników ze stroną (np. z Hotjara), często obserwujemy oznaki ich zagubienia spowodowane nieprzemyślaną, niewłaściwie zaprezentowaną nawigacją. Poprawnie zaprojektowane elementy interfejsu powinny w prosty sposób prowadzić do poszukiwanych treści. Standardowo użytkownik ma do dyspozycji: menu główne, wyszukiwarkę oraz wewnętrzne linkowanie między poszczególnymi podstronami sklepu.

Pamiętaj:

  • Zaproponuj nawigację spójną w ramach całej witryny. Zapewnij spójność również między wersjami zaprojektowanymi na różne urządzenia – wersja mobilna powinna udostępniać użytkownikom ten sam zestaw kluczowych funkcji, co desktop.
  • Zaprojektuj możliwość przejścia do kategorii na kilka sposobów, np. poprzez wyniki wyszukiwania, filtry czy linki umieszczane na stronach kategorii powiązanych z daną frazą.
  • Podpowiedz użytkownikowi, co może wpisać w polu wyszukiwania – rozważ wprowadzenie historii wyszukiwanych haseł czy wskazywanie popularnych fraz.

3. Strona główna

Klienci trafiający do sklepu internetowy często przekierowywani są bezpośrednio do szukanej przez nich kategorii lub promowanego produktu. Niekiedy pomijana jest przez to strona główna. Warto jednak zadbać o prezentowane tam informacje, aktualizację treści oraz wprowadzenie elementów budujących zaufanie użytkowników i świadomość marki (np. logotypy producentów, wyróżniki marki, certyfikaty serwisów z opiniami). To tutaj firma zwykle prezentuje kluczową część oferty i popularne kategorie. Tutaj też kieruje się użytkownik, chcąc dowiedzieć się więcej o marce, zorientować w całościowej ofercie sklepu lub po prostu w poszukiwaniu inspiracji.

Pamiętaj:

  • Umieść na stronie głównej przykłady produktów reprezentujących kluczowe kategorie, pozwalające użytkownikowi ocenić zakres oferty.
  • Udostępnij funkcje pozwalające śledzić aktualizacje oferty oraz zachęcające do ponownej wizyty (np. zapis do newslettera, informacje o programie lojalnościowym).
  • Zadbaj o użytkowników powracających oraz szukających inspiracji – zaplanuj miejsce na moduł z produktami podobnymi do ostatnio oglądanych przez klienta.
  • Zapewnij czytelność strony dzięki przemyślanej hierarchii jej elementów – ustal, które informacje są najważniejsze z punktu widzenia użytkownika i odpowiednio je wyróżnij.

4. Lista produktów, filtry i sortowanie

Sposób prezentacji listingu zależy głównie od założeń projektu. Stosowany jest zarówno widok z siatką kafli, jak i listą modułów ułożonych jeden pod drugim. Chcąc zapewnić szybkie ładowania się strony, warto podzielić listę na mniejsze „porcje”. Konieczna jest przy tym możliwość doładowywania kolejnych produktów – przyciskiem lub poprzez automatyczne rozszerzenie listy podczas przewijania strony.

Standardem na liście produktów są natomiast filtry, pośród których znajdziesz często: zakres cen, producentów czy cechy produktu. Każdy projekt wymaga indywidualnej analizy zakresu filtrów, tak żeby optymalnie dobrać je do asortymentu sklepu.

Pamiętaj:

  • Informuj użytkownika, w którym miejscu witryny właśnie się znajduje – umieść nad listą nagłówek z jednoznaczną nazwą kategorii oraz tzw. okruszki.
  • Zapewnij możliwość uporządkowania i ograniczenia listy produktów zgodnie z preferencjami użytkownika – udostępnij opcje sortowania i filtry.
  • Upewnij się, że zakres filtrów odpowiada asortymentowi – nie warto nadmiernie rozdrabniać filtrów, tworząc szczegółowe opcje. Poszczególne kategorie mogą też wymagać różnego zestawu filtrów.
  • Informacje niezbędne do precyzyjnej identyfikacji produktu oraz ważne z punktu widzenia użytkownika umieść w opisach ofert na liście. Popraw rozpoznawalność produktów, prezentując miniatury zdjęć.
  • Rozważ opcję dodawania do koszyka z poziomu listy – pozwoli to na sprawną finalizację zakupów, np. gdy użytkownik dobrze zna ofertę i wszedł na stronę sklepu po konkret.

5. Karta produktu

Karta produktu powinna dostarczać informacji pozwalających klientowi na zweryfikowanie, czy jest zainteresowany daną ofertą. Prezentowany opis powinien więc uwzględniać kompletną specyfikację produktu z danymi istotnymi dla użytkownika. Zwykle opis zawiera cechy produ...

Pozostałe 70% treści dostępne jest tylko dla Prenumeratorów

Co zyskasz, kupując prenumeratę?
  • 6 drukowanych wydań magazynu Online Marketing
  • Dodatkowe artykuły niepublikowane w formie papierowej
  • Dostęp do czasopisma w wersji online
  • Dostęp do wszystkich archiwalnych wydań magazynu oraz dodatków specjalnych
  • ... i wiele więcej!
Sprawdź szczegóły

Przypisy