5 obszarów, o które warto zadbać, projektując kartę produktu

Gdyby na witrynie Twojego sklepu dało się wskazać trzy najważniejsze typy stron, które odpowiadają za konwersję, jest bardzo prawdopodobne, że jedną z nich będzie karta produktu. To na niej klienci przyglądają się produktowi w szczegółach i podejmują decyzję o zakupie. Jak ją zatem zaprojektować?

1. Inwentaryzacja, inwentaryzacja, inwentaryzacja

Planujesz zaprojektować od nowa kartę produktu? Zacznij od statystyk sprzedaży i oznacz najczęściej kupowane kategorie produktów (zwykle na każde 10 kategorii 2-3 z nich generują razem ponad 80% przychodów).

Zaznacz te kategorie jako priorytetowe. Teraz dla każdej z nich sporządź spis i umieść na nim wszystkie stany, jakie potencjalnie mogą przyjmować karty produktów w Twoim sklepie.

Przykładowa lista może obejmować:

  • Wariant podstawowy, z ceną standardową, dostępny w magazynie.
  • Produkt w promocji (obniżona cena np. tylko teraz taniej o VAT).
  • Produkt na wyprzedaży (ostatnie X sztuk, dostępne jeszcze tylko przez Y dni / Z godzin / N minut – np. z odliczaniem czasu do końca wyprzedaży).
  • Produkt sprzedawany w zestawie (te 2-3 produkty kupione łącznie taniej o X niż kupione osobno).
  • Produkt niedostępny (wyprzedany, zastąpiony nowszym modelem).
  • Produkt – zapowiedź (jeszcze nie dostępny, wejdzie do sprzedaży dnia XX).
  • Produkt nieznaleziony (możemy go dla Ciebie sprowadzić – daj znać czy chcesz).

Powyższe stany dają się zwykle obsłużyć kilkoma podstawowymi widokami i uzupełnić stanami modalnymi (np. cena regularna / promocyjna), jednak porządna inwentaryzacja upraszcza organizację pracy projektowej i eliminuje konieczność cofania się w procesie projektowym.

Jak widać, sklep sprzedający 10 kategorii produktowych będzie potrzebował około 10-15 szablonów kart produktowych aby osiągnąć kompletność wszystkich stanów.

2. Benchmarking, czyli o czym zapomnieliśmy my, ale na szczęście pamiętał konkurent

Konkurencja to nie tylko zło. To także możliwość bezpłatnego pobierania lekcji jak sprzedawać. Korzystając z narzędzi takich jak Similarweb, SEMSTORM czy Senuto wybierz 5 najsilniejszych konkurentów (witryny o największej liczbie odwiedzin, wysokiej konwersji, intensywnie korzystające z programów reklamowych).

Następnie sprawdź, jaką architekturę informacji w zakresie grupowania produktów w kategorie wykorzystują konkurencyjne sklepy. Znalazłeś coś ciekawego i oczywistego, czego brakuje w Twoim sklepie? Na przykład kartę produktu, która ma dużo lepiej rozwiązany cross-selling albo up-selling niż Twoich produktów w tej samej kategorii?

Nic dziwnego. Pracując na własnym poletku bardzo często koncentrujemy się tak mocno na rozwoju własnego asortymentu, że zapominamy, ze inni jakąś chwilę temu rozwiązywali podobne dylematy projektowe. Rozpoczynając prace optymalizacyjne warto sporządzić listę witryn konkurencyjnych i przeanalizować jakie typy kart produktów są na nich obecne i z jakich „cząsteczek” kontentu są one zbudowane.

Wydrukuj więc karty produktów od konkurentów, które Ci się najbardziej podobają i zaznacz na nich funkcjonalności lub komunikację marketingową, której brakuje w Twoim sklepie.

Na co zwrócić uwagę analizując karty produktów u konkurencji?

  1. Co dokładnie umieszczono w obszarze nad zgięciem?
  2. Ile i jak wykonanych zdjęć przedstawia produkt?
  3. Jak sformatowany jest zapis ceny regularnej, jak promocyjnej?
  4. Czy opis produktu jest umieszczony wyżej niż warianty, kolory, modele, czy odwrotnie?
  5. Jak wysoko umieszczone są opinie użytkowników, recenzje?
  6. Gdzie usadowiono produkty podobne lub uzupełniające oglądaną ofertę?
  7. Jakim tonem opisane są produkty?
  8. Jak sformatowany jest URL do karty produktowej?
  9. Co się dzieje gdy kartę oglądamy na tablecie lub telefonie – czy następuje proste złożenie kontentu do jednej kolumny, czy użyto bardziej zaawansowanej choreografii, np. oprócz „Dodaj do koszyka” pojawia się duży przycisk „Zadzwoń i kup przez telefon”?
  10. Jak szczegółowe i obszerne są informacje o dostępności produktu, możliwości zwrotu, sposobów zapłaty, zakupów ratalnych, warunki dostawy towaru?
  11. Czy sklep wykorzystuje dynamiczny pricing np. podnosi cenę gdy drugi raz wyszukujesz tego samego produktu po jednym dniu nieobecności i powrocie do sklepu, lub w zależności od typu urządzenia, z którego oglądana jest karta produktu?

3. Co ja paczę, co ja klikam

Analizując istniejące karty produktów najłatwiej wyciągnąć wnioski w oparciu o komplet informacji.

Niezbędnik analityczny to przynamniej dwa narzędzia:

  • Google Analytics,
  • nagrywarka ekranowa – na przykład HotJar, MouseFlow czy FullStory.

Dodatkowo z pomocą przyjdą dane analityczne z:

  • Obsługi czatu / infolinii,
  • narzędzi do prowadzenia czatu (np. Interkom, LiveChat, IntelliWise),
  • systemu oddzwaniania (np. Callpage, Web2Call),
  • systemu ratowania koszyków (np. SaveCart).

Pakietu analitycznego od Google nie trzeba nikomu przedstawiać, jednak jego konfiguracja rzadko kiedy jest kompletna.

Na karcie produktu warto opomiarować za pomocą Analyticsów poniższe cele:

  1. Kliknięcie przycisku „Dodaj do koszyka” (primary action)
  2. Kliknięcie przycisków „Zamów rozmowę”, „Zapytaj o produkt”, „Sprawdź szczegóły terminu dostawy” i podobnych przycisków secondary action
  3. Wywołanie czata (świadome, z widoku zminimalizowanego do widoku konwersacji)
  4. Powiększenie głównego obrazka produktu
  5. Przewinięcie do następnego obrazka produktu
  6. Kliknięcie innego obrazka produktu z listy po lewej lub poniżej głównego obrazka
  7. Przewinięcie o 600 pikseli w dół

Jednocześnie, skorzystaj z nagrywarki ekranowej aby odkryć minimum:

  1. Jak głęboko w dół użytkownicy przewijają witrynę (zobaczysz to na tzw. mapie przewijania – scroll map).;
  2. Jakie obszary użytkowncy próbują kliknąć (bo wyglądają jak coś, co powinno dać się kliknąć), a jednak jest nieklikalne i trzeba to podlinkować.

4. Karty produktu jako strony wejścia

Wysoki współczynnik konwersji dla wizyt, które użytkownicy rozpoczęli na stronie produktu powodują, że czasami chcemy bardzo oszczędnie gospodarować obszarem nad zgięciem.

Kusi nas wtedy, żeby na nowej karcie produktu zaoszczędzić miejsce w topie strony i zrezygnować z nawigacji, redukując menu do postaci popularnego „hamburgera”.

To jeden z często popełnianych błędów. Dlaczego?

Klienci, którzy trafili do Twojego sklepu prosto z wyników wyszukiwania longtailowego, poszukujący konkretnego modelu produktu, trafiają na Twoją witrynę i rozpoczynają po niej wycieczkę właśnie od karty produktu.

Zauważ że dla nich strona karty produktu spełniać będzie ważną funkcję „orientacji w terenie” – służy do tego głównie nawigacja. W e-commerce jest to krytyczne pod kątem rozumienia przez użytkownika szerokości asortymentu, jakim dysponuje sklep. Innymi słowy, rozwinięte menu nawigacyjne natychmiast odpowiada na pytanie użytkownika „co jeszcze mogę tu kupić”.

Jeżeli ten argument Cię nie przekonuje, przeprowadź test A/B i sprawdź, o ile wzrośnie sprzedaż koszyków z dwoma lub większą ilością różnych towarów w Twoim sklepie, jeżeli odsłonisz menu nawigacyjne. Taki eksperyment dla sklepu który odwiedza miesięcznie ok. 50 000 użytkowników powinno dać się przeprowadzić w ciągu dwóch tygodni.

5. Na koniec, trzy ogólne zasady

Przy projektowaniu kart produktu warto przestrzegać generalnych wytycznych dla projektowania przyjaznych stron www. Są to:

Spójny projekt graficzny. Konsekwentny dobór kolorów (oznaczanie akcji, linków, nagłówków, treści, podpowiedzi); spójne formatowanie przycisków (jeden styl dla przycisku wiodącej akcji); wysokiej jakości zdjęcia – to wszystko wpływa na kształtowanie zaufania u użytkownika i wyrobienie szybkiej oceny czy sklep ma ofertę wartą dalszego przeglądania.

Przejrzystość architektury informacji. Wszelkie treści, które nie dodają stronie realnej wartości informacyjnej powinny zostać usunięte lub schowane (np. przeniesione na dodatkową warstwę, wyzwalaną po kliknięciu/najechaniu). Należy zachować wyraźną gradację wizualną treści (nagłówków pierwszego, drugiego poziomu, treści podstawowej i pomocniczej).

Prowadzenie uwagi użytkownika. Jeżeli projektując stronę nie jesteśmy pewni, co i w jakiej kolejności ma dostrzec i zrobić użytkownik, on sam też tego nie odkryje. Nie bez powodu jedna z ośmiu zasad projektowania UX sformułowana przez Bena Shneidermana brzmi „Projektuj interakcję z myślą o celu”.

Więcej na temat projektowania karty produktu i zwiększaniu sprzedaży będzie można się dowiedzieć w czasie konferencji Ecommerce Standard. Autor artykułu poprowadzi warsztaty na ten temat.

www.ecommercestandard.pl