Badania eyetrackingowe masek sklepów Home.pl, IAI-Shop.com i Sote.pl 12 sierpnia 2011 Tomasz Tomalik 1
Spis treści Wstęp... 4 Cel badania... 5 Metoda... 5 Narzędzia... 5 Przebieg badania... 5 Uczestnicy i uczestniczki badania... 5 Zadania... 6 Wprowadzenie do analizy... 7 Rodzaj badania... 7 Elementy raportu... 7 Home.pl... 8 1 Podsumowanie... 8 2 Sposób dotarcia do produktu... 9 3 Co widzisz? czyli jak ważne jest poprawne nazewnictwo... 10 4 Lista produktów... 11 5 Lista produktów... 12 6 Karta produktu... 13 7 Strona koszyka... 14 8 Logowanie/Rejestracja/Gość... 15 9 Formularz zamówienia... 16 10 Potwierdzenie...17 IAI-Shop.com... 18 1 Podsumowanie... 18 2 Sposób dotarcia do produktu... 19 3 Lista produktów... 20 2
4 Karta produktu... 21 5 Koszyk... 22 6 Logowanie/Rejestracja/Gość... 23 7 Formularz zamówienia... 24 8 Potwierdzenie danych... 25 9 Zapisanie danych... 26 10 Potwierdzenie... 27 SOTE... 28 1 Podsumowanie... 28 2 Sposób dotarcia do produktu... 29 3 Lista produktów... 30 4 Karta produktu... 31 5 Koszyk/Formularz zamówienia... 32 6 Podsumowanie zamówienia... 33 7 Potwierdzenie... 34 Newsletter... 35 Podsumowanie... 36 3
Wstęp Na początku czerwca 2011 roku przetestowaliśmy użyteczność trzech nowych masek sklepów internetowych oferowanych przez Home.pl, IAI-Shop.com i Sote.pl. Narzędziem wspierającym obserwacje był eyetracker, który rejestrował gdzie użytkownicy spoglądali podczas poruszania się po stronach. Do badań zaprosiliśmy osiem osób, które miały za zadanie dokonać zakupów w każdym ze sklepów i zapisać się do newslettera. Niniejszy raport stanowi podsumowanie przeprowadzonych badań i przedstawia najważniejsze obserwacje oraz problemy, które napotkali użytkownicy i użytkowniczki w trakcie testów. 4
Cel badania Celem badania było wykrycie problemów i błędów związanych z użytecznością poszczególnych masek sklepów. Zastosowanie eyetrackingu pozwoliło zaobserwować, na jakie elementy użytkownicy i użytkowniczki skupiają uwagę, oraz które części serwisu są przez nich pomijane. Metoda Narzędzia Do badania wykorzystaliśmy eyetracker Tobii T120 użyczony od firmy Eyetracking.pl. Zastosowane urządzenie pozwoliło zmierzyć punkty padania wzroku na ekran monitora. Najnowsza technologia eyetrackera bezinwazyjnie zbierała dane i nie ograniczała ruchów osób badanych. Częścią eyetrackera był monitor o przekątnej 17 cali i rozdzielczości 1280x1024. Przebieg badania W każdym indywidualnym badaniu brał udział jeden ochotnik lub ochotniczka oraz osoba prowadząca. Zadaniem osoby prowadzącej było wprowadzenie uczestników i uczestniczki w badanie oraz monitorowanie pomiaru. Średni czas badania wynosił około 20 minut. Sprzęt do badań użyczyła nam firma Eyetracking.pl Uczestnicy i uczestniczki badania W badaniach wzięło udział osiem osób intensywnie korzystających z Internetu. Wśród uczestników i uczestniczek znalazły się trzy kobiety i pięciu mężczyzn. Z ośmiu badanych wszystkie dokonywały regularnych zakupów przez Internet. 5
Zadania Głównym zadaniem na wszystkich trzech podstronach było kupienie konkretnego produktu. Zadanie kończyło się na stronie z potwierdzeniem złożenia zamówienia. W przypadku sklepu Home.pl użytkownicy i użytkowniczki musieli kupić produkt przedstawiony na zdjęciu z prawej. W dwóch pozostałych sklepach osoby badane dokonywały zakupu telewizora LCD i roweru. Treść zadania we wszystkich warunkach brzmiała podobnie: Zakup. Złóż zamówienie jako gość (bez rejestracji). Użytkownicy i użytkowniczki dokonywali zakupu bez konieczności rejestracji. Przy wypełnianiu formularzy byli proszeni o podanie fikcyjnych danych. Drugim zadaniem było zapisanie się do newslettera. We wszystkich trzech warunkach treść zadania brzmiała tak samo: Zapisz się na newsletter. Zadanie kończyło się na znalezieniu pola newslettera i wskazaniu go kursorem myszy. Sytuacja badawcza miała charakter zadaniowy gdzie sprawdzano efektywność konkretnej ścieżki zakupowej. Taki charakter testu odbiegał od sytuacji naturalnej w której klienci mieliby możliwość zapoznania się z testowanym serwisem. Zakup ten produkt. Złóż zamówienie jako gość (bez rejestracji) 6
Wprowadzenie do analizy Rodzaj badania Badanie miało charakter jakościowy - dane otrzymane po analizie ośmiu osób dostarczają informacji, jakie trudności i błędy mogą okazać się problemem dla większej ilości osób korzystających z serwisu, jednak nie pozwalają stwierdzić jak duży procent wszystkich użytkowników napotka te same problemy. Elementy raportu Raport zawiera mapy cieplne miejsc, które przyciągały wzrok największej ilości ochotników i ochotniczek badania. Przedstawiane rysunki pokazują punkty fiksacji, czyli świadomie zauważane obszary, z pierwszych dziesięciu sekund przebywania na stronie. Na mapach cieplnych znajdują się również symbole kliknięcia myszką, w obszarach, które wybierały osoby badane. Poza wspomnianymi wynikami eyetrackingu raport został wzbogacony o obserwacje osoby prowadzącej. 7
Home.pl 1 Podsumowanie Rozmieszczenie elementu wyszukiwarki okazało się bardzo intuicyjne osoby badane nie musiały poświęcać czasu na jej znalezienie. Prosty i przejrzysty układ strony sprawiał, że osoby badane nie miały problemu z poruszaniem się po sklepie i znalezieniem interesujących ich funkcji (np. newsletter). Proces składania zamówienia był intuicyjny i nie sprawiał osobom badanym problemu. Wyszukiwarka nieobsługująca alternatywnych nazw produktów utrudniała wykonanie zadania. Niezrozumiała kategoryzacja utrudniała znalezienie produktu. Jedynymi przyciskami akcji na liście produktów były przyciski dodaj do koszyka brakowało akcji przejścia do karty produktu (do karty produktu można było przejść po kliknięciu w zdjęcie) Komunikaty na stronie były niezauważalne nie odróżniały się wizualnie od reszty strony, dlatego nie skupiały uwagi osób badanych. Brak informacji o jednostce miary sprawił, że osoby badane nie wiedziały czy zamawiają produkt spożywczy na sztuki czy na kilogramy. 8
2 Sposób dotarcia do produktu Sześć osób szukając konkretnego towaru na stronie nawigowała za pomocą menu produktowego w lewej kolumnie strony (rysunek). Kolejne dwie osoby wykorzystały w tym celu wyszukiwarkę. W przypadku części osób ich wzrok momentalnie skupiał się na menu, potwierdza to niewielka ilość fiksacji na innych elementach w pierwszych 10 sekundach przebywania na stronie. Osoby korzystające z wyszukiwarki również spoglądały na menu, lecz go nie wybierały. 9
3 Co widzisz? czyli jak ważne jest poprawne nazewnictwo Dla wszystkich osób badanych zdjęcie z produktem przedstawiało marchewkę jednak wyszukanie tej nazwy w sklepie nie przynosiło żadnego wyniku. Dla dwóch użytkowników korzystających z wyszukiwarki oznaczało to brak tego produktu w sklepie. W rzeczywistości produkt nosił nazwę marchew a wyszukiwarka po prostu nie wspierała alternatywnego nazewnictwa. Powyższy przykład pokazuje jak ważne jest prawidłowe odwzorowanie słownika pojęciowego posiadanego w systemie poznawczym użytkowników i użytkowniczek. Choć niektóre nazwy wydają się bardziej profesjonalne i ładne użytkownicy mogą z nich w rzeczywistości nie korzystać. 10
4 Lista produktów Nie tylko nazwa produktu, ale również odpowiednia kategoryzacja była istotna do efektywnego wykonania zadania. Część użytkowników i użytkowniczek miało trudność z wyborem prawidłowej podkategorii warzyw. Większość użytkowników decydowała się na przeglądnięcie całej listy produktów, która w tym przypadku była na szczęście krótka. Dobrym rozwiązaniem w przypadku maski sklepu Home.pl było umieszczenie wyszukiwarki zaraz pod kategoriami produktów. Dzięki temu zapewniono użytkownikom i użytkowniczkom płynne i bezwysiłkowe przejście do tej funkcjonalności. Osoby badane, które nie wiedziały którą kategorię wybrać przechodziły wzrokiem do pola wyszukiwarki i zaczynały z niej korzystać. Ta obserwacja wskazuje, że klienci i klientki sklepu mogą mieć problem ze znalezieniem konkretnego produktu ze względu na brak odpowiedniego przyporządkowania produktu do kategorii. W przypadku produktów znanych i łatwych do skategoryzowania zawężanie do podkategorii może być bardzo intuicyjne (np. Sprzęt elektroniczny: Komputery, Drukarki, Monitory itp.). Inaczej jest z produktami z niejasną kategoryzacją w przykładzie na rysunku nie każdy jest w stanie odgadnąć gdzie znajdzie się bakłażan, papryka, burak czy brokuł. W takich sytuacjach warto podpierać się zdjęciami ze wzorcowymi produktami danej kategorii. 11
5 Lista produktów Pomiar fiksacji wzroku wskazał, iż użytkownicy i użytkowniczki bardzo szybko i płynnie przechodzili z jednego zdjęcia produktu na drugi w poszukiwaniu konkretnego towaru. Widać wyraźnie, że zadaniowe nastawienie ograniczało zakres eksploracji strony do konkretnych obszarów. Osoby badane po znalezieniu zdjęcia produktu zerkały na nazwę, opis i klikały przycisk do koszyka. W sklepie nie było przycisku z odnośnikiem do karty produktu. Przejście do niej było możliwe po kliknięciu w nazwę lub zdjęcie produktu. 12
6 Karta produktu Ze względu na różne warianty produktu przed dodaniem do koszyka użytkownicy i użytkowniczki musieli podać parametry wielkość oraz ilość. Jak widać na rysunku osoby badane określały oba parametry i dodawały produkt do koszyka. Użytkownicy i użytkowniczki nie wiedziały czy podając ilość określają sztuki czy kilogramy (produktem była marchew o wartości 2,00 zł, lecz brakowało informacji o jednostce miary). Jeden użytkownik stwierdził, że są to produkty na sztuki więc wpisał wartość 20 gdyby w rzeczywistości wpisał taką kwotę mógłby otrzymać w zamówieniu 20 kilogramów marchwi zamiast 20 marchewek. Dla większości osób uczestniczących w testach komunikat znajdujący się u góry karty produktu był niewidoczny. Stonowany kolor komunikatu nie przyciągał wzroku użytkowników i użytkowniczek (grafika obok przedstawia końcowy komunikat lecz na stronie pojawiał się wcześniej komunikat zamieszczony poniżej) 13
7 Strona koszyka Strona koszyka była dla użytkowników i użytkowniczek bardzo intuicyjna. Dobrym rozwiązaniem okazało się umieszczenie tu powerbuttonów z opcjami dostawy i płatności. Użytkownicy i użytkowniczki nie mieli również problemu ze zmianą ilości towarów gdy tego potrzebowali. 14
8 Logowanie/Rejestracja/Gość Użytkownicy i użytkowniczki nie mieli problemu z wyborem odpowiedniej opcji logowania/rejestracji. Ze względu na zadaniowy charakter nie skupiali się na korzyściach płynących z rejestracji. 15
9 Formularz zamówienia Formularz zamówienia nie sprawił trudności żadnej osobie badanej. 16
10 Potwierdzenie Użytkownicy i użytkowniczki w miarę dokładnie przeglądali potwierdzenie zamówienia skupiając się głównie na cenie, a następnie na podziękowaniu. 17
IAI-Shop.com 1 Podsumowanie Duża liczba elementów na stronie utrudniała skanowanie strony wzrokiem i wyszukiwanie istotnych informacji (np. menu produktowe i newsletter). Brak rozróżnienia graficznego ważnych elementów potęgował ten efekt. Dobra kategoryzacja produktów sprawiała, że użytkownicy i użytkowniczki bez problemu odnajdowali produkt posługując się menu. Proces zamówienia zawierał niespodziewany krok potwierdzenie danych, który dezorientował osoby badane. Myślały one, że zamówienie zostało złożone i wychodziły ze strony. Tymczasem był to krok pośredni przed właściwym zamówieniem towaru część osób kończyła zadanie przed złożeniem zamówienia. 1 Strona z potwierdzeniem zamówienia była trudna do skanowania wzrokiem, brakowało wizualnego wartościowania treści. 1 Dotyczyło to strony, której zadaniem było maksymalizowanie ilości rejestracji. Jest to opcjonalna strona, która domyślnie jest wyłączona, a na czas testów została omyłkowo aktywowana. 18
2 Sposób dotarcia do produktu Użytkownicy i użytkowniczki nie mieli problemu z dotarciem do produktu wszystkie osoby klikały na odpowiednią kategorię z menu produktowego. Strona główna zawiera bardzo dużo elementów, które nie zostały odpowiednio wyróżnione kolorystycznie. Trudno określić bez wczytywania się w szczegóły, który element jest bardziej lub mniej ważny. Na mapie cieplnej widać wiele punktów fiksacji w obrębie elementów, które w zadaniu nie były istotne. 19
3 Lista produktów Użytkownicy i użytkowniczki będąc na stronie z listą produktów klikali w zdjęcie lub przycisk zobacz szczegóły. Osoby badane nie wybierały w tym przypadku opcji do koszyka. Osoby badane zwracały również szczególną uwagę na cenę roweru. 20
4 Karta produktu Osoby badane, które znalazły się na karcie produktu od razu dodawały produkt do koszyka bez szczególnego zainteresowania treścią tej strony. Wynikało to głównie z charakteru badania. 21
5 Koszyk Koszyk nie sprawiał użytkownikom i użytkowniczkom większych problemów. Kilka osób zwracała uwagę na przycisk kontynuuj zakupy, który nie został wizualnie odróżniony od pierwszorzędnego przycisku złóż zamówienie. 22
6 Logowanie/Rejestracja/Gość Użytkownicy poprawnie wybierali przycisk złożenia zamówienia jako gość. Dzięki dobrze opisanym przyciskom nie musieli czytać żadnych innych tekstów. 23
7 Formularz zamówienia Formularz zamówienia nie sprawiał użytkownikom i użytkowniczkom większych problemów. Osoby badane poprawnie określały sposób dostawy i płatności. 24
8 Potwierdzenie danych Użytkownicy i użytkowniczki wnikliwie studiowały stronę z potwierdzeniem danych osobowych. Uwagę osób badanych przykuwały zwłaszcza dwa komunikaty w kolorze czerwonym. 25
9 Zapisanie danych Stroną, która sprawiła największy problem było zapisanie danych. Graficznie była bardzo podobna do strony logowania/rejestracji. Wszyscy użytkownicy i użytkowniczki byli stroną zdezorientowani i nie wiedzieli co mają zrobić. Większość osób stwierdzała, że zamówienie zostało przyjęte do realizacji i nie muszą już niczego potwierdzać. Dopiero dokładne przestudiowanie treści strony przez kilku użytkowników pozwoliło na dopełnienie przez nich zamówienia. Zapisanie danych to strona opcjonalna, która została omyłkowo aktywowana na czas naszych testów. Domyślnie strona jest wyłączona i można ją uruchomić z panelu administracyjnego. Jej główną funkcją jest maksymalizacja ilości rejestracji. 26
10 Potwierdzenie Kilka osób, które dotarły na stronę z potwierdzeniem stwierdziło, że strona jest mało czytelna, co potwierdza mapa cieplna. Widać na niej, że użytkownicy nie przyjmują konkretnego kierunku skanowania strony. Elementy są rozproszone wizualnie i trudno wskazać, które informacje są na niej najważniejsze. 27
SOTE 1 Podsumowanie Prosta graficznie strona i odznaczające się menu główne ułatwiało użytkownikom i użytkowniczkom poruszanie się po stronie. Strona z podsumowaniem była oszczędna w treści, dzięki czemu osoby badane bez wysiłku zaznajamiały się z zamieszczonymi tam informacjami. Na liście z produktami brakowało przycisków akcji, lecz osoby badane bez większych problemów przechodziły do karty produktu klikając na zdjęcie produktu. Brak wizualnego wyróżnienia newslettera sprawił, że osoby badane musiały dokładnie skanować całą stronę wzrokiem, aby go znaleźć. Rozkład wizualny koszyka z formularzem zamówienia nie wspierał naturalnego skanowania wzrokiem. Osoby badane musiały poświęcić chwilę na zorientowania się, które pola muszą wypełnić. Wypełnianie formularza nie sprawiało jednak problemów. 28
2 Sposób dotarcia do produktu Użytkownicy i użytkowniczki od razu zauważali menu produktowe i z niego korzystali. Był to jedyny wyraźny element nawigacji, dlatego był dobrze zauważalny. 29
3 Lista produktów Osoby badane wybierały produkt i klikały w zdjęcie, aby przejść do karty produktu. Czerwony przycisk dodania do koszyka nie zachęcał użytkowników i użytkowniczki do klikania. Brakowało przycisku zobacz szczegóły lecz osoby badane bez najmniejszego problemu przechodziły do karty produktu. 30
4 Karta produktu Osoby badane dodawały produkt do koszyka klikając w duży i łatwo zauważalny przycisk. Ze względu na brak opisów użytkownicy i użytkowniczki nie mieli możliwości zaznajomienia się z zaletami produktu. 31
5 Koszyk/Formularz zamówienia Użytkownicy i użytkowniczki mieli problem z koszykiem, gdzie elementy nie zostały logicznie i intuicyjnie rozmieszczone. Osoby badane po dłuższej chwili potrzebnej na rozeznanie się na stronie wypełniały poszczególne pola formularza zamówienia, który był zamieszczony na jednej stronie wraz z koszykiem. Wypełnienie formularza nie było dla użytkowników i użytkowniczek problematyczne. 32
6 Podsumowanie zamówienia Strona z podsumowaniem zamówienia nie sprawiła użytkownikom i użytkowniczkom problemów. Wszystkie osoby zaznajamiały się z informacjami zamieszczonymi na stronie i poprawnie składały zamówienie. 33
7 Potwierdzenie Potwierdzenie zamówienia było dla użytkowników i użytkowniczek bardzo intuicyjne. Osoby badane zaznajamiały się z treścią tej podstrony. 34
Newsletter Zadanie ze znalezieniem newslettera nie sprawiło problemu żadnej osobie badanej. Najefektywniejszą stroną okazał się sklep platformy Home.pl, który dzięki swojej prostocie ułatwiał użytkownikom i użytkowniczkom znalezienie pola newslettera. Sklep IAI-Shop.com był mocno przeładowany treścią, przez co znalezienie newslettera zajęło osobom znacznie więcej czasu. Ostatni badany sklep Sote shop był w miarę prosty i wyważony pod względem ilości treści, jednak newsletter nie wyróżniał się wizualnie, przez co był trudny do znalezienia. Mapy cieplne wskazują na ilość fiksacji użytkowników i użytkowniczek w trakcie poszukiwania newslettera. 35
36
Podsumowanie Przeprowadzone badania z użyciem eyetrackingu pozwoliły sprawdzić zachowania użytkowników i użytkowniczek w trakcie wykonywania kilku typowych zadań w badanych sklepach internetowych. Głównym celem było sprawdzenie ścieżki zakupowej i nawigacji po sklepach. Sytuacja badawcza i zadaniowy charakter testu ogranicza trafność badania - pozwala wskazać błędy z jakimi mogą spotkać się osoby korzystające ze sklepów, ale nie pozwala przewidzieć jak duża grupa klientów będzie miała podobne problemy. Pomimo zauważonych błędów warto zwrócić uwagę, że badane były testowe maski sklepów. Każdy właściciel może dowolnie zmieniać wygląd sklepu z panelu administracyjnego. Duży wpływ na efektywność nawigacji i wydajność procesu zakupowego ma dostosowanie sklepu do rodzaju produktu, jego kategoryzacji i wybranej strategii sprzedaży. 37