Audyt sklepu internetowego

W Twoim sklepie straszy? Użytkownicy z jakiegoś powodu wychodzą, zamiast trafiać prosto do kasy? To znak, że czas na wsparcie z zewnątrz. Obiektywne spojrzenie na sprzedaż w e-Commerce, z naciskiem na doświadczenie użytkownika. 

Audyt sklepu internetowego to badanie, które wymaga kompetencji zarówno z dziedziny analityki marketingowej, jak i projektowania UX. I tak też podchodzimy do niego w Satisfly – w duecie marketingowiec plus designer. O tym, dlaczego to takie ważne, opowiem dalej. Teraz czas na…

Narzędzia audytorów

Głowy (dwie), a w nich doświadczenie.

No dobrze, to nie wszystko. Absolutną podstawą do prowadzenia audytu sklepu internetowego jest Google Analytics. Dzięki niemu zbieramy dane ilościowe – i identyfikujemy miejsca, w którym klienci trzaskają drzwiami.

Dalej są narzędzia do analityki jakościowej. Wśród nich przez dłuższy czas prym wiódł Hotjar, oferujący heatmapy i wgląd w nagrania poczynań użytkowników, jednak są już lepsze rozwiązania. Dużo lepiej sprawdza się tu CUX, narzędzie do analityki behawioralnej pochodzące z Polski.

Kolejna jest nasza lista dobrych praktyk – stosowanych i sprawdzonych we współczesnym e-Commerce. I w tym artykule pokażemy dużo przykładów z tej listy, dla każdego z podstawowych widoków w sklepie internetowym. 

Audyt sklepu internetowego – ścieżka zakupowa

Ale zanim jednak przejdziemy do dobrych praktyk w odniesieniu do poszczególnych widoków, zerknij na plan działania.

Ścieżkę użytkownika rozrysowujemy na bazie sinusoidy zadowolenia użytkownika. Najniższe poziomy to zarazem najpilniejsze problemy do rozwiązania. To miejsca, w którym gubimy klienta.

W dalszej kolejności znajdujemy i rozwiązujemy mniej pilne problemy, które jednak wpływają na satysfakcję na ścieżce zakupowej. Tak jak w poniższym przykładzie – może to być nieintuicyjny sposób wpisywania kodu rabatowego.

Audyt sklepu internetowego – podstawy

Podstawy wydają się oczywiste, ale paradoksalnie to właśnie one są najczęściej zaniedbywane. Problemy wynikają z… udziwniania. Chęć wyróżnienia się z tłumu innych sklepów potrafi sprawić, że designer zapomina o standardach. A przecież istnieją uniwersalne zasady, które obowiązują niezależnie od branży czy sektora e-Commerce.

Jak widzisz, niby oczywistość, ale łatwo tu zepsuć doświadczenie użytkownika. Klikalne elementy staną się mało widoczne, jeśli nie uwzględnisz kontrastu kolorów. Złośliwe pop-upy mogą być pokłosiem złego wdrożenia marketing automation. A pozycja wyszukiwarki czy ikony koszyka po prostu nigdy nie powinna być zmieniana, nawet jeśli nie pasuje to do awangardowej koncepcji designu sklepu.

Audyt sklepu internetowego – koszyk

Przejdźmy do koszyka. Oto przykładowe praktyki, których warto się trzymać:

• koszyk przechowuje dane o wrzuconych produktach nawet gdy użytkownik z niego wyjdzie – lub zaloguje się na swoje konto;
• pokazuje najważniejsze informacje o produkcie – nazwa, obrazek, wybrany wariant, liczba sztuk, cena;
• sumaryczna cena jest pokazana bezpośrednio obok głównego CTA (ważne: tu również trzeba uwzględnić wymogi Dyrektywy Omnibus);
• informuje o dacie i sposobach dostawy;
• informuje o sposobach płatności (ikonki);
• główne CTA zawiera copy, które precyzyjnie określa następny krok.

Co ciekawe, najczęściej zauważam problem z ostatnim punktem. Nie bez przyczyny z dziedziny UX wypączkował jakiś czas temu copywriting UX, czyli specjalizacja skupiona na dobrej komunikacji pisanej. Najważniejsze jest to, by guzik z CTA, który kieruje do kolejnego kroku z koszyka, dawał użytkownikowi po pierwsze klarowną informację, a po drugie – poczucie bezpieczeństwa. 

Rozważmy przykład ścieżki transakcyjnej, której pierwszym krokiem po wizycie w koszyku jest formularz z adresem dostawy. 

Dużą pomocą dla klienta może być pasek prezentujący postęp składania zamówienia. Jeśli go uwzględnisz, sprawa dobrego copy na guzikach CTA staje się mniej znacząca.

Audyt sklepu internetowego – checkout

Jakbym dostawał złotówkę za każdy audyt sklepu internetowego, w którym udowadniałem, że to jest najbardziej newralgiczne miejsce dla poziomu konwersji… to byłbym bardzo bogatym gościem. 

Tutaj warto zerknąć najpierw do Google Analytics, by określić, który konkretnie etap zakupowy jest miejscem “wycieku” klientów. Odpowiadamy więc na pytanie “gdzie?”. 

Teraz przejdźmy do “dlaczego?” – popatrzmy na wybrane dobre praktyki:

• użytkownik może wybrać opcję zakupów jako gość zamiast tworzenia konta/logowania się;
• główne CTA jest najbardziej wyeksponowanym elementem na stronie;
• każdy krok informuje, co stanie się po kliknięciu głównego CTA;
• checkout nie zawiera wychodzących linków, kilkalnych elementów poza kluczowymi, nie ma też stopki (widok uproszczony).

Szczególną uwagę zwróćmy na formularz, starą zmorę e-konsumentów:

• użytkownik nie musi wypełniać wszystkiego od nowa, jeśli wystąpi błąd;
• układ jest prosty, najlepiej jednokolumnowy;
• użytkownik może używać Tab, by przeskakiwać między polami;
• ma absolutne minimum pól do wypełnienia (!!);
• adres mailowy jest jako pierwszy do wypełnienia (ułatwia kontakt przy porzuceniu koszyka).

I moje ulubione:

• formularz zawiera bazę adresów, co eliminuje pomyłki i literówki;
• nie zmusza użytkownika do wpisywania dwa razy tych samych danych.

Piękno listy praktyk, którą się posługujemy w Satisfly, polega na jej uniwersalności. Praktycznie zawsze wnioski z jej przepracowania pokrywają się z frustracjami wykrytymi dzięki narzędziom jakościowym (czyli np. nagraniom sesji). 

I myślę, że i Ty, drogi czytelniku, rozpoznajesz w nich własne doświadczenia z zakupów online.

Audyt sklepu internetowego – karta produktu

Użytkownik sklepu musi dostać komplet istotnych informacji o produkcie. To zdanie jak mantrę powtarzamy w rozmowach z klientami Satisfly, rekomendując przy okazji wdrożenie Akeneo PIM. 

Ale informacje to nie wszystko – jest jeszcze kwestia właściwej ich prezentacji. 

Oto garść przykładów z naszej listy:

• strona zawiera podążającą za scrollem (“lepką”) belkę z najważniejszymi informacjami o produkcie + CTA;
• nazwa produktu, zdjęcie i rejon głównego CTA są nad foldem;
• strona zawiera informacje o dostępności, opcjach i czasie dostawy w rejonie głównego CTA;
• warianty produktu są łatwo klikalne na mobile;
• strona NIE zawiera selektorów typu drop-down;
• wszystkie zmiany, jakie wprowadza użytkownik na stronie, nie powodują przeładowania strony
• strona reaguje i pokazuje informację o wrzuceniu produktu/produktów do koszyka;
• na karcie produktu są recenzje i oceny od użytkowników;
• strona zawiera wyraźną informację o cenie (i promocji) w rejonie głównego CTA.

Z doświadczenia wiem, że nie wszystkie elementy z listy da się wdrożyć w każdym sklepie. Tam, gdzie mamy do czynienia z silnikiem abonamentowym (Saas), zazwyczaj ograniczenia są zbyt duże. Z kolei silnik na wolnym kodzie, taki jak Magento open source, jest dużo bardziej elastyczny i tam nie stanowi to problemu.

Za audytem musi iść działanie!

Po pierwsze – raport. Z dokładnym opisem miejsc do poprawy. Po drugie – wiedzę. Zapoznanie się dobrymi praktykami na pewno zaprocentuje na przyszłość.

I po trzecie – konkretny plan działania wraz z realizacją. Nie jesteśmy tylko teoretykami. W audycie sklepu uczestniczy UX designerka właśnie po to, by później wdrożyć postulowane zmiany wraz z frontend developerem. Już nieraz spotkaliśmy się z frustracją managerów i właścicieli sklepów, którzy dostawali obszerny dokument… ale nie wiedzieli, co dalej z nim zrobić. Bez sensu.

W Twoim e-Commerce coś odstrasza klientów, a Ty szukasz praktyków UX, którzy nie tylko wskażą palcem, ale i wdrożą poprawki? Zapraszamy do Satisfly!

Jeżeli chcesz dowiedzieć się jak dokładnie wygląda nasz proces UX przeczytaj artykuł: Projektowanie UX sklepu internetowego. Proces krok po kroku.