Wyobraź sobie wizytę w swoim ulubionym sklepie. Wchodzisz pewnym krokiem. Pewnie szybko znajdziesz idealne jeansy, ekspedientka poda Ci właściwy rozmiar wprost do przymierzalni, przy kasie otrzymasz niespodziewany rabat i odejdziesz w kierunku zachodzącego słońca… Chwila. Nie tym razem?

Ludzie zapomną, co powiedziałeś, ludzie zapomną, co zrobiłeś. Ale nigdy nie zapomną wrażeń, jakie w nich wywołałeś.

Ta sentencja autorstwa Mayi Angelou doskonale podsumowuje istotę user experience. Jeśli jeszcze nie wiesz, co to jest i dlaczego warto zacząć o nim poważnie myśleć – jak najszybciej odrób tę lekcję. Inaczej współczynnik konwersji Twojej strony może bardzo ucierpieć.

User experience – definicja

Też nie lubimy definicji. Ale user experience (dalej UX) to od kilku lat buzzword, który wciąż nie jest do końca rozumiany. UX to całość wrażeń, jakich doświadcza użytkownik podczas korzystania z produktu interaktywnego. Na tej podstawie powstał user experience design, czyli metodologia projektowania (interfejsu produktu) skoncentrowanego na użytkowniku. W naszym wypadku tym produktem jest Twój sklep internetowy.

Zasady user experience: liczy się pierwsze wrażenie

Wróćmy do naszej wizyty w sklepie. Decydujesz się wejść. Stłoczony w grupce innych klientów, znajdujesz się w samym środku baaaardzooo woooolnoooo poruszających się obrotowych drzwi. Czujesz pierwsze ukłucie irytacji.

Wiesz dlaczego sklepy stacjonarne mogą sobie na to pozwolić, a internetowe nigdy? Bo kliknięcie “cofnij” albo “zamknij przeglądarkę” następuje zazwyczaj kilka sekund po odczuciu zniecierpliwienia, które negatywnie wpływa na user experienceklientów. Ucieczka z pełnej obcych ludzi, obracającej się szklanej tuby z pewnością nie jest taka prosta.

źródło: https://blog.kissmetrics.com/loading-time/?wide=1

Co więcej, istnieją badania, które pokazują, że każda sekunda opóźnienia w ładowaniu się strony to spadek satysfakcji klienta o 16% i spadek sprzedaży o 7%.

źródło: https://wpengine.com/blog/site-speed-infographic/

Musisz też wiedzieć, że to, co jako pierwsze zobaczą użytkownicy na Twojej stronie, decyduje o tym, czy zostaną na dłużej.

Koncentrowanie się na upychaniu wszystkiego above-the-fold dawno zostało ogłoszone jako mit, jednak nie w tym rzecz. Chodzi o zainteresowanie, odpowiedź na potencjalną potrzebę, stworzenie wrażenia “adekwatności”. Tak, jak prime time w reklamie telewizyjnej, tak przestrzeń above-the-hold jest najbardziej wartościowym miejscem na Twojej stronie.

Wyzwaniem nie jest przyciągnięcie uwagi użytkownika. Wyzwaniem jest przyciągnięcie uwagi do treści, które zwiększą szansę na konwersję.

User experience a sklep: lubimy to, co znamy

Udało się. Jesteś w środku. Teraz wystarczy znaleźć dział ze spodniami i coś wybrać. Pamiętasz, że były zaraz po prawej stronie, tuż za kurtkami… Chwila, chwila. Coś tu nie gra. Czemu w miejscu kurtek jest bielizna? Gdzie się podziały półki z jeansami? I dlaczego nie ma przejścia w prawo, tylko w lewo? Najpierw czujesz się zagubiony. Potem zaczyna narastać w Tobie irytacja.

W procesie zakupowym chodzi w dużej mierze o to, żeby klient nawet nie poczuł, że podejmuje kolejne decyzje (przemieszcza się po sklepie). Ludzie nie lubią się zastanawiać. Dlatego każda wątpliwość dotycząca poruszania się po Twojej stronie internetowej i każdy problem na etapie user experience może stanąć na przeszkodzie sfinalizowania transakcji.

Czy zastanawiałeś się, dlaczego nasze oczy przemieszczają się do górnego, lewego rogu ekranu, gdy szukamy nawigacji? Dlaczego wolimy scrollować w dół, niż na boki? Dlaczego klikamy w kolorowy/podkreślony tekst? W psychologii nazywa się to “efektem czystej ekspozycji”. A prościej – przyzwyczajeniem.

Nie bez przyczyny większość stron produktowych, wygląda jak iPad Pro, a strony linii lotniczych byłyby identyczne po usunięciu logotypów.

TL;DR a UX sklepu internetowego

Trafiłeś w końcu do półki z jeansami. Ale tutaj także czeka na Ciebie zaskoczenie. Aby dojść do wyboru fasonu i rozmiaru, musisz najpierw przeczytać instrukcję użytkowania, prania i dokładny skład ubrania. Dowiadujesz się, że spodni nie można narażać na ogień i że należy je prać w temperaturze max. 20 stopni, ale nie wiesz, jaki mają kolor i rozmiar. Masz ochotę zrobić w tył zwrot i natychmiast wyjść ze sklepu.

Użytkownik, który zderza się na naszej stronie internetowej ze ścianą tekstu, najprawdopodobniej zrobi to natychmiast. Dlatego tak ważne jest UX sklepu internetowego.

Jesteśmy generacją “skimmerów” – skanujemy wzrokiem stronę internetową, dopóki coś nie przeciągnie naszego wzroku i nie sprawi, że zatrzymujemy się na chwilę. Wysokiej jakości i rozdzielczości obraz, ruch, barwne animacje – to wszystko ma znacznie większą szansę na przykucie uwagi, niż tekst. co przekłada się na lepsze user experience.

Jednocześnie pamiętajmy, że przewijanie strony weszło już w krew większości użytkowników internetu. Stało się tak głównie dzięki powszechności Facebooka. W ten sam sposób zaczęliśmy konsumować też inne treści, czyli scrollować “wall” i zatrzymywać się tylko na “postach”, które nas interesują.

Dlatego nigdy nie traktuj tekstu jako “wypełniacza”. Jeśli nie wiesz, co umieścić na stronie – lepiej nie umieszczaj nic albo wstaw piękne zdjęcie. Świetnym przykładem jest strona:

W user experience nie ignoruj mobile

Niezniechęcony dotychczasowym torem przeszkód, trafiłeś do przymierzalni. Może w końcu coś kupisz. Jednak pomieszczenie jest tak mikroskopijne, że założenie spodni wiąże się z serią akrobacji. Pomimo wysiłków, co jakiś czas Twoja ręka albo noga wystaje poza zasłonkę. Na dodatek przywaliłeś czołem w lustro. Wykonanie prostej czynności jest po prostu niemożliwe.

Jeśli do tej pory nie wybiegłeś jeszcze ze sklepu, bardzo prawdopodobne, że robisz to właśnie teraz. Pomyśl, że właśnie tak czuje się użytkownik, który korzysta z urządzenia mobilnego, jednak musi poradzić sobie ze stroną zaprojektowaną dla standardowych rozdzielczości. Ignorowanie tego, to poważny błąd mający wpływ na user experience.

Liczby mówią same za siebie. Jakiś czas temu popularny sklep O’Neill Clothing, podzielił się swoimi wynikami po wprowadzeniu w życie responsywnego designu. Zespół O’Neill Clothing porównał trzy tygodnie przed wprowadzeniem zmian i trzy tygodnie po. Wyniki były naprawdę imponujące:

źródło: https://www.electricpulp.com/notes/you-like-apples/

W zasadzie te liczby nie powinny nas dziwić – przecież dobrze wiemy, jak ciężko włożyć spodnie o kilka rozmiarów za małe.

Formularz nie musi odstraszać

Wreszcie (!) docierasz do kasy. Zanim jednak zapłacisz za wybrane jeansy, musisz pokonać tor przeszkód: przeskoczyć przez trzy bramki, przejść pozytywną weryfikację skanerem antykradzieżowym, potwierdzić swoją tożsamość i odpowiedzieć na pytanie: ile razy dziennie wskazówki zegara się pokrywają? To ostateczny test, który potwierdzi jak bardzo zależy Ci na nowych spodniach.

Właśnie taki koszmar przypominają nam niektóre formularze do wypełnienia na stronach internetowych. Pamiętaj: im krótszy i mniej wymagający od użytkownika formularz, tym lepiej. Jednak często oznacza to też straty w informacjach, jakie moglibyśmy mieć o potencjalnym kliencie. Czyli mamy leada, ale niskiej jakości.

Podobnie jak wszystko inne, długość formularza zależy od kontekstu. Jeśli logujemy się do darmowego serwisu np. Twitter, formularz powinien być krótki. Jeśli wypełniamy wniosek o ubezpieczenie – niekoniecznie.

Chodzi o to, że jeśli użytkownik pożąda/potrzebuje tego, co mu oferujemy, to wykona wysiłek, aby to otrzymać. Naszym zadaniem jest sprawić, by ten proces był jak najbardziej przyjemny. Aby user experienceformularza był jak najlepszy, korzystajmy więc z:

• opcji autouzupełniania
• jasnych podpowiedzi
• walidacji danych i prostych komunikatów dotyczących błędów
• możliwości zaznaczania zamiast wpisywania treści
• odpowiedniej ilości “białej przestrzeni”

Pamiętaj również, by formularz pojawił się w procesie zakupowym dopiero w chwili, kiedy klient jest przekonany o chęci dokonania zakupu. Wrzucanie go na pierwszy krok procesu, będzie skutkować wysokim współczynnikiem odrzuceń.

***

To nie koniec tej historii.

Powyższe zasady są fundamentalne, jeśli zależy nam, żeby nasza strona była użyteczna i efektywna. Jednak to tylko wierzchołek góry lodowej. Im więcej dowiadujesz się o projektowaniu skoncentrowanemu na użytkownika, tym więcej dobrych (i złych) praktyk poznajesz. Dlatego w następnej części tego artykułu wrócimy do naszego sklepu i odbędziemy podróż od menu głównego, poprzez nawigację, strony produktowe, aż do strony płatności