Successfully reported this slideshow.

Proces zakupowy - badania eyetracking

2,501 views

Published on

Published in: Design
  • Be the first to comment

  • Be the first to like this

Proces zakupowy - badania eyetracking

  1. 1.
  2. 2. Wnioski z badań eyetrackingowych przeprowadzonych w trakcie realizacji przez użytkowników kolejnych kroków procesu zakupowego w sklepie internetowym<br />
  3. 3. Opis badania<br />Badane sklepy to Toys4Boys i Świat Książki<br />Badania miały charakter eksploracyjny. <br />Próba badanych wynosiła 10 osób. Każdy z uczestników badania mógł dowolnie wybrał produkty, które chce kupić.<br />
  4. 4. Według statystyk 59,8% użytkowników przerywa proces zakupowy i nigdy go niekończy*<br />Głównymi obszarami, które zostały poddane badaniu były:<br /><ul><li> Opcje i informacje w koszyku
  5. 5. Nawigacja w procesiezakupowym,
  6. 6. Czytelnośćumieszczanychopisów,
  7. 7. Informacje o kosztach dostawy i płatności,
  8. 8. Działanieformularzy.</li></li></ul><li>Koszyk<br /><ul><li>Widocznośćobjaśnień i pomocy
  9. 9. Mechanizmykontynuacjizakupów</li></li></ul><li>Koszyk<br />Objaśnienia w usprawnianiu procesu decyzyjnego<br />„Informacja: Koszyk”<br /><ul><li> Duża ilość tekstu
  10. 10. Nie przyciąga uwagi</li></ul>Mało pomocna?<br />„Jak korzystać z koszyka”<br />Toys4Boys<br />źródło: Ideacto, Eyetracking<br />
  11. 11. Koszyk<br />Objaśnienia w usprawnianiu procesu decyzyjnego<br />Świat Książki<br />źródło: Ideacto, Eyetracking<br />
  12. 12. Koszyk<br />Siła czytelnej nawigacji<br />„Przyciski nawigacji”<br /><ul><li> Odpowiednio dobrane usprawniają proces podejmowania decyzji
  13. 13. Koncentracja na właściwych elementach</li></ul>źródło: Ideacto, Eyetracking<br />
  14. 14. Koszyk<br />Siła czytelnej nawigacji<br />Okno safari<br />
  15. 15. Koszyk<br />Informacja o czasie dostawy powoduje nieznaczny wzrost konwersji<br />źródło: Ideacto, Eyetracking<br />
  16. 16. Koszyk<br />Wnioski<br /><ul><li> Do ikon dodawaj opisy.
  17. 17. Stosuj użyteczne nagłówki, czyli wyjaśnij jednoznacznie treść, której dotyczą.
  18. 18. Do ważnych tekstów dodawaj ikony, które przyciągają uwagę.
  19. 19. Skracaj i upraszczaj teksty.
  20. 20. Nadawaj priorytety przyciskom, aby ułatwić użytkownikom nawigowanie. </li></li></ul><li>Produkty polecane, rekomendowane<br /><ul><li>Widocznośćproduktówrekomendowanych, polecanych
  21. 21. Wpływ na wypełnianie formularza podczas procesu zakupowego</li></li></ul><li>Produkty polecane, rekomendowane<br />Elementy zbędne i nieprzydatne<br />źródło: Ideacto, Eyetracking<br />„Top 10” przy procesie zakupowym<br /><ul><li> (Na szczęście?) nie odwraca uwagi
  22. 22. Jeśli ma być przydatne, może warto dodać np. ceny produktów?</li></li></ul><li>Produkty polecane, rekomendowane<br />
  23. 23. Produkty polecane, rekomendowane<br />Podsumowanie<br /><ul><li> Pamiętaj, że elementy dodatkowe (produkty rekomendowane i inne) </li></ul>widoczne w procesie mogą rozpraszać iodciągaćwzrokużytkowników.<br /><ul><li> Zdecyduj na którym kroku należało by zrezygnować z widoczności dystraktorów</li></li></ul><li>Promocje i prezenty<br /><ul><li> Widoczność promocji, kuponów, zniżek</li></li></ul><li>Promocje i prezenty<br />Nietrafiona, czy niewidzialna promocja?<br />„Promocja - Prezent od Toys4Boys”<br /><ul><li> A gdzie patrzy użytkownik?
  24. 24. Czy przeczytał warunki?</li></ul>źródło: Ideacto, Eyetracking<br />
  25. 25. Promocje i prezenty<br />Nietrafiona, czy niewidzialna promocja?<br />Toys 4 Boys<br />Militaria.pl<br />źródło: Ideacto, Eyetracking<br />
  26. 26. Formularze<br /><ul><li> Reakcja użytkowników na błędy, np. błędnie wypełniony formularz
  27. 27. Redukowanie, ukrywaniepólformularza</li></li></ul><li>Formularze<br />Mylące okna<br />źródło: Ideacto, Eyetracking<br /><ul><li>Domyślny adres pobiera automatycznie dane adresowe z konta.
  28. 28. Opcjonalny, powinien być uzupełniony, gdy adres dostawy będzie inny niż domyślny.</li></li></ul><li>Formularze<br />Co się działo?<br />źródło: Ideacto, Eyetracking<br />Użytkownik zaczął dopisywać dane do drugiego formularza <br /><ul><li> Zrezygnować, wygasić, dodać objaśnienie?</li></li></ul><li>Formularze<br />źródło: Ideacto, Eyetracking<br />
  29. 29. Formularze<br />Wyrównywanie etykiet<br />Do prawej<br />Do lewej<br />Na górze<br />Toys 4 Boys<br />Toys 4 Boys<br />Czy to jest potrzebne?<br />źródło: Ideacto, Eyetracking<br />
  30. 30. Formularze<br />Wnioski<br /><ul><li>Stosujzrozumiałeetykiety.
  31. 31. Spraw, aby użytkownicy nie czuli się zdezorientowani działaniem funkcji. Informuj i uprzedzaj.
  32. 32. W celu zmniejszenia czasu potrzebnego na wypełnianie formularza zastosuj etykiety nad polami formularza.
  33. 33. Pola formularza najmniej przeszkadzają w czytaniu etykiet do lewej. Dlatego stosuj je, gdy ich zrozumienie jest ważne i gdy chcesz użytkowników trochę zmusić, aby skupili na nich swoją uwagę. Dodatkowo są dosyć przyjemne w percepcji, ze względu na swoje lewostronne wyrównanie, tworzące prostą linię.
  34. 34. Gdy etykiety są mniej więcej równej długości, dosuń je do prawej strony, aby zmniejszyć dystans od pól do wpisywania.
  35. 35. Staraj się zredukować odległość pól etykiet od pól do wpisywania.</li></li></ul><li>Wnioski końcowe<br />Etykiety i formularze<br /><ul><li>Stosuj zrozumiałe etykiety.
  36. 36. Minimalizuj liczbę pól formularzy.
  37. 37. Aby wyróżnić formularz i skupić na nim uwagę użytkowników możesz stosować delikatne jasne tło.</li></ul>Nawigacja<br /><ul><li> Spraw, aby użytkownicy nie czuli się zdezorientowani działaniem funkcji, powinno być ono intuicyjne i przewidywalne.</li></ul>Informujiuprzedzaj.<br /><ul><li> Stosuj opisy ikon, zwłaszcza tych abstrakcyjnych.
  38. 38. Nadaj priorytety przyciskom, aby ułatwić użytkownikom nawigowanie.</li></li></ul><li>Wnioski końcowe<br />Płynność procesu<br />zakupowego<br /><ul><li>Unikaj elementów dodatkowych, które mogą rozpraszać i odciągać wzrok użytkowników.
  39. 39. Pamiętaj, że prezentacja zawartości koszyka w kolejnych krokach procesu zakupowego rozprasza.
  40. 40. Jasno i precyzyjnie projektuj kroki procesu zakupowego, tak aby użytkownik wiedział gdzie się znajduje i jaki krok jest ostateczny.
  41. 41. Stosuj spójne i jasne nazwy dla poszczególnych kroków procesu zakupowego oraz przycisków.</li></ul>Teksty<br /><ul><li> Do ważnych tekstów dodaj elementy graficzne, które przyciągną uwagę.
  42. 42. Stosuj użyteczne nagłówki, czyli wyjaśnij jednoznacznie treść, której dotyczą.
  43. 43. Skracaj i upraszczaj teksty.
  44. 44. Pomoc i wszystkie dodatkowe informacje umieszczaj kontekstowo.</li></li></ul><li>Jeśli są Państwo zainteresowani ofertą, lub uzyskaniem dodatkowych informacji prosimy o kontakt:<br />www.eyetracking.pl<br />

×