User experience - co to jest i co oznacza? Jak zadbać o dobry UX?

Chcesz pozyskać nowych klientów z Internetu?

Zamów bezpłatną konsultację ze Specjalistą od reklamy w Internecie! Otrzymasz darmowe porady, konsultacje i analizę Twojej strony internetowej.

User experience (UX) - co to jest i co oznacza? Jak zadbać o dobry UX?

Aż 88% kupujących online nigdy nie wraca na strony, które były dla nich mało użyteczne. 70% klientów e-sklepów deklaruje, że porzuca koszyki z powodu złych doświadczeń zakupowych.

Internautów frustrują zbyt wolno ładujące się strony, niezrozumiałe treści, a nawet nielogiczne struktury informacji.

Wystarczy dobry interfejs, aby podnieść współczynnik konwersji witryny o 200%, a dobry projekt UX może go zwiększyć nawet o 400%! (źródło: Affde). 

Z tego artykułu dowiesz się, co to jest user experience, dlaczego jest ważny i jak może Ci pomóc w generowaniu coraz lepszej sprzedaży. Podpowiadamy, jak zadbać o dobry user experience. 

Chcesz sprawdzić, które elementy Twojej witryny wymagają optymalizacji pod kątem UX?

Umów się na bezpłatną konsultację teraz!

Rozwiń wszystkie

Od czego pochodzi skrót UX? Co to znaczy user experience?

Skrót UX pochodzi od angielskiego sformułowania user experience i oznacza po polsku dosłownie: doświadczenie użytkownika. 

UX - co to jest? 

UX (ang. user experience) to ogół wrażeń, jakich doświadcza użytkownik w kontakcie z danym produktem czy usługą. O UX mówi się najczęściej w kontekście aplikacji, serwisów internetowych i urządzeń elektronicznych. Termin user experience bywa używany wymiennie z określeniem usability (po polsku użyteczność), choć ten, w odróżnieniu od UX, dotyczy jedynie wrażeń związanych z bezpośrednim korzystaniem z produktu. 

Czym jest UX design?

UX design to projektowanie doświadczeń użytkownika. Intuicyjna aplikacja mobilna, łatwy w obsłudze system bankowy, wiarygodny portal branżowy, dobrze sprzedający sklep internetowy - wszystko to efekty odpowiednio zaprojektowanego doświadczenia użytkownika.  

Już w momencie pierwszej interakcji z produktem, aplikacją czy stroną internetową pojawiają się związane z ich użytkowaniem odczucia - pozytywne lub negatywne. Specjaliści UX muszą więc zaprojektować je tak, aby proces użytkowania był szybki, przyjemny, intuicyjny i satysfakcjonujący. Proces ten nazywa się projektowaniem user experience (ang. user experience design, UX design), w którym olbrzymią rolę odgrywa rozpoznanie potrzeb i przyzwyczajeń użytkowników.  

Wszystkie działania podejmowanie w ramach UX designu mają poprawić użyteczność produktu końcowego - tak, aby był on lepszy w odbiorze. W konsekwencji więc user experience dąży do przekształcenia użytkowników w klientów poprzez dostarczenie im pozytywnych doświadczeń. 

Projektanci user experience wykorzystują w tym celu różne metody. Jedną z nich jest projektowanie zorientowane na użytkownika (ang. user-centered design, UCD).  W tej metodyce kluczowe jest poszukiwanie odpowiedzi na pytania: 

  • kim jest użytkownik?
  • jaki problem użytkownika ma rozwiązać dany produkt?
  • co jest ważne dla użytkownika?
  • jakie są jego cele?
  • jakie użytkownik ma ograniczenia i problemy?
  • jakie jest wyobrażenie użytkownika na temat produktu?

Każdy cykl projektowania zorientowanego na użytkownika składa się z następujących po sobie etapów, które są ciągle powtarzane:

  • analiza użytkownika,
  • analiza i dokumentowanie wymagań,
  • projektowanie,
  • wdrożenie,
  • testowanie. 

W efekcie powstaje produkt dostosowany do potrzeb użytkownika końcowego, przydatny i satysfakcjonujący, pozbawiony barier i problemów. 

Kto jest ojcem terminu user experience?

Termin user experience ma swoje korzenie w firmie Apple Computers. Pracujący w niej Don Norman - profesor psychologii poznawczej i nauk komputerowych - w 1993 roku nadał sobie tytuł Architekta User Experience i miał od tej pory kluczowy wpływ na rozwój UX. Norman w ten sposób rozumie UX:

To, co ważne, to całościowe doświadczenie, od momentu, kiedy po raz pierwszy usłyszę o produkcie, aż do zakupu, otwarcia pudełka, uruchomienia, po serwis, utrzymanie, uaktualnienia. Wszystko ma znaczenie: wzornictwo przemysłowe, projekt graficzny, projekt instrukcji, całe usability, projekt funkcjonalny.

Historia UX

Początków tradycyjnie rozumianego UX należy doszukiwać się w latach 70. To wtedy właśnie okazało się, że warunkiem prawidłowego korzystania z komputerów osobistych (PC) jest zaprojektowanie ich tak, aby odzwierciedlały logikę człowieka, a więc to, jak myślimy i działamy na co dzień. Zaczęto więc łączyć psychologię poznawczą z inżynierią. Wykonywano szereg badań z udziałem zwykłych osób, których zadaniem było testowanie rozwiązań związanych z obsługą komputera. Sprawdzano, jak radzą sobie z poszczególnymi czynnościami i jak bardzo wzrasta ich poziom frustracji, kiedy coś okazuje się trudne do wykonania. 

W latach 80. i 90. dużą rolę w rozwoju UX odegrali Jakob Nielsen - doktor informatyki Duńskiego Uniwersytetu Technicznego i prawdziwy weteran usability, oraz wspomniany wcześniej Don Norman, którzy w 1998 roku założyli firmę konsultingową Nielsen Norman Group, skupiającą się na interfejsach i doświadczeniach użytkownika. 

Sam Nielsen uważa, że jednym z pionierów UX był Bell Labs - badawczy i wdrożeniowy oddział telekomunikacyjnego przedsiębiorstwa Alcatel-Lucent, które powstało w 1925 roku. Firma ta już w latach 50. miała działać w dziedzinie UX, a potwierdzeniem tego jest chociażby stosowana przez nią klawiatura dotykowa, z której korzystamy współcześnie. 

Dziś user experience kojarzymy przede wszystkim z tworzeniem stron www i projektowaniem cyfrowym. UX nieustannie ewoluuje, a wraz z nim zmieniają się nazwy i definicje towarzyszące tej dziedzinie. Zaobserwować można także coraz wyraźniejszy podział na specjalizacje w ramach UX. 

Obok UX designera występuje więc SXO designer, odpowiedzialny za przygotowywanie serwisu maksymalnie przyjaznego użytkownikom i botom indeksującym, UX writer, zajmujący się tworzeniem odpowiednich treści dla użytkownika, czy Security IT / UX designer, dbający o bezpieczeństwo użytkowników produktów i user experience. 

Nad projektowaniem stron www i aplikacji mobilnych zgodnie z założeniami user experience czuwają obecnie rozbudowane zespoły programistów, grafików, psychologów, a nawet socjologów. Na znaczeniu zyskuje także kognitywistyka, która pozwala projektantom UX analizować wzorce behawioralne oraz przenosić je na zachowanie maszyn i urządzeń. Wszystko po to, by stworzyć produkt idealnie dopasowany do użytkownika. 

Jaki powinien być UX?

Pionier w dziedzinie user experience - Peter Morville - zebrał 7 najistotniejszych czynników, które muszą zostać spełnione, aby dostarczyć pozytywnych wrażeń użytkownikowi. Przygotował tym samym model “plastra miodu”, według którego produkt “idealny” powinien być:

  • funkcjonalny (ang. useful),
  • użyteczny (ang. usable),
  • dostępny (ang. accessible),
  • wzbudzający pożądanie (ang. desirable),
  • wiarygodny (ang. credible),
  • wartościowy (ang. valuable),
  • łatwy do znalezienia (ang. findable).
jaki powinien być ux
UX według Petera Morville'a
Źródło: Semantic Studios

Dobrze zaprojektowane doświadczenia użytkownika mają ogromny wpływ na stworzenie, wdrożenie i dalszy rozwój produktu. To właśnie od UX w dużej mierze zależy, czy dany produkt odniesie sukces na rynku i wyróżni się na tle konkurencji. Zaangażowanie specjalistów UX ma ogromny wpływ na jego finalny odbiór, a co za tym idzie na generowanie konwersji i zbieranie leadów. 

Zorientowanie na użyteczność i funkcjonalność produktu jest bardzo ważne - wystarczy spojrzeć na UX z 3 perspektyw:

  • użytkownika, który np. wchodząc na daną stronę internetową, oczekuje jasnej, prostej, szybkiej i bezproblemowej ścieżki do zrealizowania określonych celów. Jeżeli sfinalizowanie transakcji lub zdobycie niezbędnych informacji wymaga podjęcia zbyt wielu, w dodatku skomplikowanych, kroków, w użytkowniku narasta frustracja, czego efektem jest opuszczenie witryny;
  • robotów Google, które dawniej oceniały witrynę jedynie pod kątem zamieszczonych w treściach słów kluczowych oraz liczby prowadzących do niej linków. Dziś najpopularniejsza wyszukiwarka na świecie bierze pod uwagę ponad 200 unikalnych i mierzalnych czynników rankingowych, wśród których szczególne miejsce zajmuje szybkość ładowania witryny, wysokiej jakości content czy responsywność strony. Zadaniem robotów indeksujących (tzw. Googlebotów) jest symulowanie użytkownika, a co za tym idzie promowanie tych witryn, których on oczekuje, wpisując określoną frazę w wyszukiwarkę. W tym miejscu UX spotyka się z SEO. O tym, jak duży wpływ mają na siebie obie te dziedziny, piszemy w dalszej części artykułu;
  • właściciela witryny, któremu zawsze powinno zależeć przede wszystkim na pozyskiwaniu użytkowników. Na nic jednak zdadzą się działania powodujące wzrost ruchu, ale niepodnoszące współczynnika konwersji, a więc niegenerujące zysku. To właśnie UX strony czy aplikacji ma zwiększyć współczynnik konwersji - należy go zaprojektować tak, aby użytkownicy mogli realizować swój osobisty, a jednocześnie Twój biznesowy cel. 

Projektowanie user experience to klucz do tworzenia dobrych produktów - takich, które przynoszą oczekiwane korzyści użytkownikom i dają wymierny zysk przedsiębiorcom. 

O tym, jak ważne jest stawianie doświadczeń użytkownika na pierwszym miejscu, świadczą liczby:

  • 88% kupujących twierdzi, że nigdy nie powróci na witryny, które były dla nich mało użyteczne.
  • 70% klientów sklepów internetowych porzuca koszyki z powodu złych doświadczeń zakupowych.
  • 52% użytkowników twierdzi, że głównym powodem, dla którego nie wracają na strony internetowe, jest ich estetyka.
  • 90% użytkowników przestaje korzystać z aplikacji z powodu ich słabej wydajności.
  • Tylko 1% Internautów twierdzi, że serwisy e-commerce zawsze spełniają ich oczekiwania. 
  • Współczynnik odrzuceń wzrasta aż o 123%, jeśli czas ładowania strony wynosi więcej niż 1 sekunda.
  • 79% użytkowników opuszcza witryny, na których nie znajduje potrzebnych informacji, i kontynuuje poszukiwanie na innych stronach. 
  • 65% Internautów odmówiłoby wypełnienia formularza na stronie, jeśli wymagane byłoby podanie zbyt wielu danych osobowych.

Źródło: Affde

UX - na co zwrócić uwagę, projektując doświadczenia użytkownika?

W projektowaniu doświadczeń użytkownika znaczenie ma wszystko: dobry interfejs, ciekawy design, wartościowy content, odpowiednia architektura informacji. Liczy się aspekt wizualny, ogólna wartość produktu, to, jak użytkownik go odbiera i jaki przynosi to efekt. 

W projektowaniu doświadczeń to właśnie użytkownik jest najważniejszy, ponieważ to dla niego tworzony jest produkt. Poniżej prezentujemy kilka najważniejszych elementów, którymi warto kierować się, tworząc UX:

  • pierwsze wrażenie  - w branży designu i UX przyjęła się zasada 5 sekund - tylko tyle masz czasu, by przykuć uwagę klienta;
  • architektura informacji (AI) - organizowanie strony internetowej czy oprogramowania w celu wspierania użyteczności informacji, a więc umożliwienie użytkownikom jak najłatwiejszego dotarcia do poszukiwanych treści; 
  • afordancja - termin ten wypromował sam Donald Norman, podkreślając, że cecha danego produktu powinna sugerować jego funkcję, np. kształt klamki, który sugeruje, że drzwi można pociągnąć;
  • clicktracking - śledzenie kliknięć użytkownika;
  • RWD (ang. responsive web design) - przygotowanie produktu pod każdy rodzaj urządzenia;
  • heatmap - graficzna analiza danych pokazująca, jak użytkownicy zachowują się na stronie internetowej (które elementy przyciągnęły największą uwagę i wygenerowały najwięcej kliknięć czy też co odciągnęło uwagę od najważniejszych treści);
  • CTA (ang. call to action) - prawidłowe zastosowanie przycisku zachęcającego użytkownika do określonego działania przekłada się na wzrost konwersji;
  • błędy użytkownika - każdy błąd popełniany przez użytkownika na stronie powinien wiązać się z możliwością jego szybkiej i intuicyjnej naprawy, np. w formularzu;
  • psychologia koloru - istnieje szereg badań, na podstawie których można stwierdzić, jakie odczucia wzbudzi w odbiorcy określony odcień;
  • efekt izolacji, nazywany także efektem von Restorff lub fenomenem Kohlera-Restorff - lepsze zapamiętywanie przez odbiorców elementów, które w jakiś sposób się wyróżniają.

Dobre praktyki i podstawy UX - 10 heurystyk Jakoba Nielsena

Wspomniany już wcześniej Jakob Nielsen, guru usability, zaprezentował ogólne zasady związane z projektowaniem komunikacji człowieka z maszynami. Razem z Ralfem Molichem, szefem duńskiej firmy konsultingowej Dialog Design, opracował na początku lat 90. zbiór 10 heurystyk, które uznawane są dziś za absolutne podstawy UX. Prawie każde współczesne szkolenie z user experience zaczyna się od przedstawienia dziesięciu postulatów, którymi powinien kierować się każdy dobry UX Designer, czyli projektant doświadczeń użytkownika. 

  1. Widoczność statusu systemu

    Użytkownik wchodzący na daną stronę internetową, nie jest z nią jeszcze zaznajomiony. Jej zadaniem jest zatem bieżące informowanie o statusie wykonywanych przez niego akcji, pokazywanie, w jakim miejscu dokładnie się znajduje i co na tym etapie może zrobić. 

    ux widoczność statusu
    Widoczność statusu systemu - informacja o tym, na jakim etapie znajduje się użytkownik
    Źródło: Zalando

    O statusie systemu w kontekście stron internetowych informują także tytuł (TITLE) oraz nagłówek H1. To również podstawowe elementy, na które zwracają uwagę specjaliści SEO. Widzi je także użytkownik, zarówno w treści strony (nagłówek H1), jak i poza nią (tytuł w pasku przeglądarki). Elementy te pełnią więc nie tylko funkcję informacyjną, ale też sprzedażową - ich zadaniem jest zachęcić użytkownika do określonego działania, między innymi poprzez przekazywanie informacji o tym, co znajduje się na stronie. 

  2. Zgodność pomiędzy systemem a światem rzeczywistym

    Metody komunikacji stosowane na stronie powinny być znane użytkownikowi ze świata zewnętrznego. Należy więc używać słów czy sposobów nawigacji, z którymi Internauci spotykają się na co dzień, a także trzymać się powszechnie obowiązujących standardów. Jeśli kolor czerwony stosowany jest zwykle dla oznaczenia błędu, niepowodzenia czy niedostępności, nie ma potrzeby tego zmieniać. Jeśli dane kontaktowe firmy znajdują się zazwyczaj w stopce strony, niech tak zostanie. 

    Zasada ta dotyczy nie tylko samej strony internetowej, ale i większego systemu, którego jest częścią - Internetu, social mediów czy wyszukiwarek. Należy więc zadbać o to, aby strona prezentowała się dobrze również na zewnątrz. Idealnym tego przykładem jest sposób prezentacji witryny na stronie wyników wyszukiwania (w tzw. SERP-ach). To, w jaki sposób witryna zostanie tam opisana, jest nie tylko istotną wskazówką dla Google, ale i dla użytkowników.

    O Ile w TITLE (tytule strony) szczególne znaczenie ma optymalizacja pod kątem wyszukiwarki, o tyle w META description (opisie strony) można, a nawet trzeba dodać elementy marketingowe i UX’owe, choćby w postaci sprzedażowych treści, CTA czy emoji. Należy unikać tytułów i opisów, które wprowadzają użytkowników w błąd.

    ux title description
    Sposób prezentacji witryny w wyszukiwarce - TITLE i META Description
    Źródło: Google.pl

    Zgodność systemu z rzeczywistością należy odnieść także do znajdujących się na stronie przycisków i linków. Ich treść i sposób prezentacji powinny jasno komunikować, czego użytkownik może spodziewać się, klikając w dany element. 

    Dla przykładu: linki typu: Kliknij tutaj czy Sprawdź nie przekazują wprost informacji o tym, co znajduje się na stronie, do której prowadzą. Odpowiednia treść linków (tzw. anchor text) jest również ważna z punktu widzenia pozycjonowania. Anchor tekstowy odzwierciedlający nazwę artykułu, np. Co to jest marketing internetowy? nie tylko jasno informuje o tym, co użytkownik znajdzie pod linkiem, ale i ułatwi zadanie robotom indeksującym. Takie zabiegi usprawniają również linkowanie wewnętrzne. 

  3. Kontrola użytkownika nad systemem

    Użytkownicy mogą i mają prawo popełniać błędy. Jedną z kluczowych zasad projektowania UX jest umożliwienie im szybkiego cofnięcia zmian i naprawy błędów.

    Tam, gdzie jest to konieczne, słusznym będzie dodanie przycisku Wstecz (zwłaszcza w przypadku, gdy droga jest jedna, a czynności wykonywane są krok po kroku, np. podczas dokonywania płatności), ale w projektowaniu strony internetowej zawsze trzeba mieć na uwadze ścieżki, po których użytkownik ma szansę trafić na daną podstronę (np. z wyników wyszukiwania). 

    Nie da się ich zgeneralizować, dlatego trzeba dać użytkownikowi pełną kontrolę nad tym, co robi i gdzie może się cofnąć. Można w tym celu wykorzystać m.in. wspomniane wyżej linkowanie wewnętrzne, realizując je za pomocą przycisków z nazwami podstron, z których użytkownik mógł przejść na daną podstronę.

    ux kontrola użytkownika nad systemem
    Kontrola użytkownika nad systemem - możliwość usunięcia poszczególnych produktów z koszyka,
    przycisk "Wróć do sklepu" umożliwiający powrót na stronę główną 
    Źródło: Zalando
  4. Zachowanie spójności i trzymanie się standardów

    Komunikaty stosowane na stronie powinny być za każdym razem takie same. Należy zachować spójność i trzymać się ogólnie panujących standardów, np. menu na górze, a stopka na dole strony. Jeżeli dokonujemy jakichś zmian na stronie, np. w obrębie koloru przycisku, to należy zachować ten standard na wszystkich podstronach, aby nie wprowadzać użytkownika w błąd. Taką konsekwencję należy zachować, tworząc również przyciski o takiej samej lub podobnej funkcji. 

    ux zachowanie spójności
    Zachowanie spójności - przyciski wyceny w takiej samej konwencji
    Źródło: SEMPIRE

    Spójne powinny być także treści na poszczególnych podstronach. Jeśli w kilku opisach produktów zastosowana została tabela ze specyfikacjami, to należy umieścić ją na wszystkich kartach produktów, a przynajmniej na tych, w przypadku których da się wyodrębnić takie parametry. 

  5. Zapobieganie błędom

    Należy nie tylko wyeliminować błędy, które utrudniają korzystanie ze strony internetowej, np. niedziałające linki, ale także zapobiegać sytuacjom, które mogą skutkować popełnieniem błędu, np. zakupem niewłaściwego rozmiaru odzieży. Jeżeli jakieś działanie może wywołać błąd lub niepożądany efekt, trzeba nie tylko o tym poinformować, ale także zablokować taką możliwość. 

    Zasady te łatwo odnieść do prezentacji produktów na zdjęciach w sklepach internetowych. Zawsze warto zaznaczyć, w jakich okolicznościach zdjęcia te zostały wykonane - jeśli np. jest to sukienka prezentowana na zdjęciu przez modelkę, to należałoby napisać, ile wzrostu ma ta modelka i jaki rozmiar nosi. Do opisu produktu warto też dodać tabelę rozmiarów z dokładnymi oznaczeniami i ewentualnie poradnik/instruktaż mówiący o tym, jak dokonać właściwych pomiarów. 

    Jeżeli produkt jest chwilowo niedostępny, należy jasno zakomunikować to użytkownikowi, uniemożliwiając dodanie go do koszyka i zakup, ale jednocześnie nawołując do innych działań konwertujących, np. zapisania się do bazy mailingowej w celu powiadomienia o jego ponownej dostępności.

    ux zapobieganie błędom
    Zapobieganie błędom - przewodnik po rozmiarach, uniemożliwienie wyboru niedostępnego produktu,
    zachęta do pozostawienia kontaktu
    Źródło: H&M
  6. Możliwość wyboru zamiast zapamiętywania

    Użytkownik powinien mieć zapewniony łatwy i szybki dostęp do strony głównej, koszyka czy kontaktu z poziomu poszczególnych podstron. Dzięki temu nie musi zapamiętywać architektury strony, aby swobodnie z niej korzystać. Nawet jeśli coś wydaje się dla nas oczywiste, wcale nie musi być takie dla użytkownika naszej witryny. Zamiast zmuszać go do zapamiętywania, lepiej dać mu wybór, ale w ten sposób, aby nie przeładować go informacjami. 

    Pomocna w tym celu okaże się liczba Millera, która mówi o tym, że człowiek jest w stanie przetwarzać jednocześnie od 5 do 9 danych. Zgodnie z tą regułą tworzy się również menu na stronach internetowych - liczba jego elementów oscyluje zwykle w zakresie od 5 do 9. 

    ux możliwość wyboru
    Zastosowanie i przestrzeganie liczby Millera - układ 7 rzędów i układ 5 rzędów
    Źródło: SEMPIRE

    Tę zasadę UX należy stosować również w kontekście prezentacji produktów i usług na stronie internetowej. Informacje na ich temat powinny być nie tylko jednolite, ale i kompletne, a nie rozmieszczone po całym serwisie. 

    Dobrym przykładem może być tutaj kwestia cennika. Słusznym jest wyodrębnienie dla niego osobnej podstrony, ale odsyłanie do niej z poziomu karty usługi bez jakiejkolwiek wzmianki o cenie jest niezgodne z zasadami UX. Użytkownik, który zapoznaje się z opisem produktu lub usługi, chce od razu wiedzieć, jaka jest jego cena. Odsyłanie go na odrębną podstronę nie tylko rodzi ryzyko, że już z niej nie wróci, ale zmusza do zapamiętania najważniejszych specyfikacji produktu/usługi czy konfiguracji, które wiążą się nierozerwalnie z ceną. 

  7. Elastyczność i efektywność

    Ilu użytkowników, tyle sposobów poruszania się po serwisie. Jedni preferują docieranie do poszukiwanych informacji za pomocą menu, inni wykorzystują w tym celu wyszukiwarkę. Są też i tacy, którzy poszukują produktów, korzystając z opcji filtrowania. Należy więc dać użytkownikom dużą elastyczność, dostarczając im jednocześnie możliwie najlepsze doświadczenia. 

    Im bardziej rozbudowane witryny, tym bardziej zaawansowane sposoby dobierania kryteriów wyszukiwania i sortowania wyników. Służy temu tworzenie statycznych podstron z poszczególnych adresów filtrów - dzięki temu użytkownicy mogą w łatwy sposób znaleźć to, czego poszukują. 

    ux elastyczność i efektywność
    Elastyczność i efektywność - możliwość wyszukiwania po kategoriach, możliwość sortowania i filtrowania,
    wyszukiwarka produktów
    Źródło: Zalando

    Elastyczność i efektywność przekazu to także dostosowanie witryny do osób z zaburzeniami widzenia, choćby poprzez możliwość zmiany wielkości czcionki za pomocą rolki (CTRL+SCROLL) lub z poziomu przycisków na stronie. 

    Jeżeli dodatkowo chcesz zadbać o lepszy przekaz sprzedażowy lub ukierunkować użytkownika na określone działania, np. zakup konkretnych usług czy skorzystanie z aktualnej promocji, warto uzupełnić sekcje menu o przykuwające wzrok elementy, np. obrazek czy odpowiedni przekaz tekstowy. 

  8. Estetyka i minimalizm

    Każda zbędna informacja na stronie nie tylko prowadzi do jej przeładowania, ale wpływa również na negatywny odbiór użytkownika i zaburza z nim interakcję. 

    Kluczowe jest także odpowiednie sformatowanie treści, właściwy kontrast i dobór kolorów na stronie, a nawet dostosowanie witryny do osób z zaburzeniami widzenia barw

    ux estetyka treści
    Estetyka treści na stronie internetowej - czytelna, przejrzysta i uporządkowana treść
    Źródło: SEMPIRE
  9. Skuteczna obsługa błędów

    Jeżeli użytkownik poruszający się po witrynie, natrafia na jakiś błąd, należy dokładnie wyjaśnić mu, co się stało, i co powinien dalej zrobić. W tym kontekście niezwykle ważna jest sprawna komunikacja z użytkownikiem. Wszelkie komunikaty o błędach należy wyrażać jasnym, możliwie najprostszym językiem, unikając w ten sposób niezrozumiałych i trudnych dla użytkownika sformułowań. 

    Doskonałym przykładem może być skuteczna obsługa formularzy, a więc dostarczanie użytkownikom odpowiednich komunikatów związanych z uzupełnianiem poszczególnych pól.

    ux obsługa błędów
    Walidacja formularza z jasnym i zrozumiałym komunikatem
    Źródło: SEMPIRE
  10. Pomoc i dokumentacja

    Użytkownik poruszający się po stronie internetowej może potrzebować pomocy lub dodatkowych informacji związanych ze sposobem działania witryny. Należy więc umożliwić mu łatwy i szybki dostęp do niezbędnej dokumentacji, umieszczając na poszczególnych podstronach sekcje FAQ, tworząc wpisy poradnikowe i słowniki najważniejszych pojęć czy umieszczając dodatkową sekcję informacyjno-pomocniczą w stopce strony. Jeżeli coś może być dla użytkownika niejasne, wskaż mu miejsce, w którym znajdzie szczegółowe wyjaśnienie problemu. 

    ux pomoc i dokumentacja
    Pomoc i dokumentacja - słownik pojęć
    Źródło: SEMPIRE

Jak zadbać o dobry UX? Checklista - 30 elementów, które powinieneś wdrożyć

Przygotowaliśmy dla Ciebie listę kontrolną, a w niej 30 elementów, które powinieneś wdrożyć, aby maksymalnie zwiększyć satysfakcję użytkowników odwiedzających Twoją witrynę. Sprawdź, jak zadbać o dobry UX. 

  1. Utwórz dla domeny protokół HTTPS

    Protokół nie stanowi części domeny, lecz wskazuje metodę, która będzie używana do przesyłania lub wymiany danych. Najbardziej znane schematy do przesyłania plików HTML to HTTP (ang. Hypertext Transfer Protocol) oraz HTTPS (ang. Hypertext Transfer Protocol Secure). 

    Protokół HTTPS to po prostu bezpieczna wersja HTTP, odpowiedzialna za szyfrowanie danych przesyłanych pomiędzy serwerem a użytkownikiem. HTTPS sprawia, że wrażliwe dane są odpowiednio zabezpieczone, a więc trudniejsze do przechwycenia przez niepowołane osoby. Protokół ten wiąże się ściśle z certyfikatem SSL, który również należy wdrożyć. 

    Przesyłanie poufnych danych w serwisie (np. dotyczących karty płatniczej) bez protokołu HTTPS jest bardzo niebezpieczne. Użytkownicy lepiej więc reagują na strony, które korzystają z szyfrowanej komunikacji. 

    Poznaj sprawdzone metody wdrażania protokołu HTTPS według Google i utwórz go dla swojej domeny - dzięki temu Twoi użytkownicy będą czuć się bezpieczniej. Strona zostanie oznaczona w przeglądarkach symbolem kłódki - tak jak na poniższym przykładzie. Po kliknięciu w symbol użytkownik będzie mógł uzyskać więcej informacji na temat szyfrowania.

    ux https
    HTTPS - informacja o bezpiecznym połączeniu
    Źródło: Reserved
  2. Zastosuj certyfikat SSL

    Aby wymusić komunikację przez protokół HTTPS, niezbędny jest certyfikat SSL (ang. Secure Socket Layer), który poświadcza wiarygodność domeny i potwierdza pełne szyfrowanie transmisji danych pomiędzy przeglądarką użytkownika a serwerem. W praktyce uniemożliwia zatem dostęp osób niepowołanych do wrażliwych danych, którymi użytkownicy posługują się na Twojej stronie. Komunikat, że strona jest niezabezpieczona, to dla zdecydowanej większości użytkowników poważny sygnał ostrzegawczy - zamiast zostawiać na nie swoje dane, wolą przejść do konkurencji. 

    Uruchom certyfikat SSL jak najszybciej. Gwarancja bezpiecznego połączenia to nie tylko skuteczna ochrona przesyłanych danych, ale także wyższa konwersja i pozytywne doświadczenia użytkowników. 

  3. Zadbaj o przyjazne adresy URL

    Optymalizacja adresów URL sprzyja nie tylko pozycjonowaniu, ale i doświadczeniu użytkownika. Prosty i czytelny adres URL jest dla nich zrozumiały, a więc i przyjazny. Jeżeli jego poszczególne elementy są logicznie ułożone, ułatwiają poruszanie się po witrynie nie tylko użytkownikom, ale też robotom indeksującym. 

    Zdecydowanie bardziej przyjazny jest adres URL:
    https://www.sempire.pl/pozycjonowanie.html 

    niż:
    https://www.sempire.pl/?id=46&sort=default&view=1

    Zadbaj o czytelne adresy URL na swojej stronie - krótkie, intuicyjne i łatwe do zapamiętania. Niech każdy z nich dokładnie opisuje zawartość podstrony, do której prowadzi - użytkownik powinien wiedzieć, czego może się spodziewać, klikając w link. 

    Nieodpowiednia struktura adresów URL nie tylko nie wzbudza zaufania użytkowników, ale też wpływa negatywnie na proces pozycjonowania. Skomplikowane linki zawierające ciąg niezrozumiałych znaków nie zachęcają do kliknięcia i przejścia na witrynę z naturalnych wyników wyszukiwania.

    Pamiętaj też, że Google cały czas uczy się zachowań użytkowników i na tej podstawie ocenia witryny, dlatego odpowiednia struktura adresów URL pomoże Ci również w osiągnięciu wyższych pozycji. 

  4. Ustaw TITLE i META Description dla wszystkich podstron w serwisie

    Choć TITLE (tytuł strony) i META Description (opis strony) kojarzą się głównie z optymalizacją witryny pod kątem wyszukiwarek, to jednak to, w jaki sposób są skonstruowane, w dużym stopniu wpływa na wrażenie użytkownika i decyduje o tym, czy zechce on przejść na witrynę z wyników wyszukiwania. 

    • Ustaw TITLE, przekazując w nim informację o tym, co użytkownik znajdzie na stronie.
    • Wprowadź META Description, dzięki któremu zachęcisz użytkownika do kliknięcia w link i przejścia na Twoją witrynę. Dodaj elementy marketingowe i UX’owe w postaci sprzedażowych treści, chwytliwego CTA, emoji i korzyści dla użytkownika. 
    user experience title description
    Sposób prezentacji sklepu internetowego w wyszukiwarce - TITLE i META Description
    Źródło: Google.pl
  5. Zintegruj wizytówkę w Google Maps ze stroną

    Wizytówka w Mapach Google (ang. Google Maps) pozwala użytkownikom dotrzeć do najważniejszych informacji na temat Twojej firmy już z poziomu wyszukiwarki: danych kontaktowych, wskazówek dojazdu, godzin otwarcia czy ocen klientów. 

    Zintegruj wizytówkę Google Maps ze swoją stroną i umieść na niej mapkę - dzięki temu wskażesz fizyczną lokalizację swojej firmy, a tym samym zwiększysz jej wiarygodność i utwierdzisz użytkowników w przekonaniu, że faktycznie istnieje.

    Użytkownicy będą mieć możliwość wyświetlenia większej mapy, a tym samym wyznaczenia trasy, zobaczenia zdjęć (również Street View), sprawdzenia opinii i szybkiego dotarcia do wspomnianych wyżej informacji. 

    ux integracja Google Maps
    Integracja Google Maps ze stroną
    Źródło: AZ Serwis
  6. Zadbaj o odpowiedni widok strony głównej

    Potraktuj stronę główną jak wizytówkę - umieść na niej informacje, którymi chcesz się pochwalić. Zaprezentuj swoje najlepsze produkty, nowości, promocje i oferty specjalne. Użyj w tym celu banerów, sliderów lub boksów.

    Bądź ostrożny - unikaj agresywnych pop-upów, zwróć też uwagę, aby slidery nie rozpraszały uwagi odbiorców - możesz ustawić je tak, aby zatrzymywały się po najechaniu na nie myszką. Przekieruj użytkowników ze strony głównej na kluczowe kategorie w Twoim serwisie.

    ux strona główna
    Strona główna - baner główny z najważniejszą informacją o wyprzedaży produktów
    Źródło: Zalando
  7. Pamiętaj o zasadzie odwróconej piramidy

    Zasada odwróconej piramidy mówi o tym, aby nie testować cierpliwości użytkownika i najważniejsze informacje zawsze umieszczać na początku materiału, a w miarę jego “upływu” i zagłębiania się w temat poruszać bardziej szczegółowe i poboczne wątki. 

    Stosuj tę zasadę zarówno w przypadku tworzenia treści, zawierając już na samym początku najistotniejsze fakty i kluczowe informacje, jak i w trakcie projektowania designu strony, umieszczając na górze te elementy, które od razu przykuwają wzrok użytkownika. 

    Szczególną uwagę poświęć obszarowi, który jest widoczny bez konieczności scrollowania (ang. Above the Fold - ATF) - to właśnie w tym miejscu powinieneś umieścić najistotniejszy content - informację o wyprzedaży produktów (jak na powyższym przykładzie), nowej kolekcji, specjalnej ofercie, słowem: wszystko to, co może przełożyć się na wyższy współczynnik konwersji. Zadbaj o to, aby w obszarze ATF znalazły się następujące elementy:

    • logo, menu, CTA,
    • nagłówek H1 informujący o tematyce strony,
    • grafika główna / baner,
    • breadcrumbs wskazujący, w którym miejscu znajduje się użytkownik.

    Poniżej punktu przewinięcia strony (ang. Below the Fold) umieszczaj natomiast mniej sprzedażowe treści - plansze informacyjne, polecane kategorie, aktualności czy linki do wpisów blogowych. 

    ux odwrócona piramida
    Below The Fold - boks inspiracyjny :Odkryj sekrety kawy", sekcja "Szczególnie polecamy",
    strefy marek
    Źródło: MediaMarkt
  8. Zadbaj o intuicyjną nawigację

    Przeanalizuj wszystkie możliwe scenariusze zachowań użytkowników Twojej witryny. Zastanów się, jak powinna wyglądać ich ścieżka zakupowa. Zadbaj o to, aby klient mógł szybko, intuicyjnie i skutecznie odnaleźć poszukiwany produkt. Trzymaj się zasady 3 kliknięć - maksymalnie tyle powinno wystarczyć użytkownikowi, aby przenieść się do wybranego miejsca na Twojej stronie. 

    Najczęściej stosowanym rodzajem nawigacji w sklepie internetowym jest megamenu, czyli wielokolumnowe menu, które organizuje kategorie i pozwala na szybkie przekierowanie użytkownika do każdej podkategorii. Ogranicz górne menu do 7 głównych kategorii - to optymalna, zdaniem ekspertów, liczba (źródło: ecommerce CEO). 

    Nad nawigacją umieść belkę z kluczowymi informacjami - odnośnikiem do strony “Kontakt” i wyróżnikami Twojego e-sklepu, np. darmową dostawą. Po prawej stronie nawigacji umieść kluczowe przyciski w sklepie: wyszukiwarkę, dostęp do konta (rejestracja/logowanie) oraz koszyk.

    ux nawigacja
    Nawigacja: górne menu z kategoriami głównymi, szybka pomoc, informacja o wyprzedaży i darmowej dostawie,
    wyszukiwarka, konto, koszyk
    Źródło: Reserved
  9. Umieść wyszukiwarkę w sklepie

    Kluczowym elementem nawigacji jest wyszukiwarka, która pomaga w odnalezieniu produktów. Umieść ją u góry strony. Jeżeli prowadzisz niewielki sklep internetowy, wystarczy wyszukiwarka w podstawowej wersji - z automatycznymi podpowiedziami i wbudowanymi synonimami. W przypadku rozbudowanych e-sklepów i marketplace’ów konieczna będzie zaawansowana wyszukiwarka, która zdoła obsłużyć tysiące wpisywanych naraz zapytań. 

    Zadbaj o to, aby dostarczyć użytkownikom podpowiedzi, dzięki którym szybciej znajdą poszukiwany produkt. Możesz też rozważyć opcję szybkiego podglądu produktu, dzięki którym użytkownicy otrzymają więcej informacji już na etapie wyszukiwarki, bez konieczności przechodzenia na kartę produktu. Jeżeli chcesz zaoszczędzić czas klientów, dodaj funkcję autouzupełniania wyszukiwania. 

    ux wyszukiwarka
    Zaawansowana wyszukiwarka z podpowiedziami uwzględniającymi podobne wyszukiwania,
    kategorie oraz produkty
    Źródło: Morele
  10. Daj możliwość wygodnego filtrowania i sortowania produktów

    Umieść filtry w widocznym miejscu - w lewej kolumnie lub na samej górze, tuż nad listingiem produktów, dzięki czemu będą widoczne dla użytkownika bez konieczności scrollowania.

    Jeżeli masz dużą liczbę wariantów produktów, wyświetlaj domyślnie tylko kilka (najlepiej najpopularniejszych) przykładów, a pozostałe warianty daj w liście rozwijanej - tak jak na załączonym poniżej przykładzie.

    Filtry powinny być rozmieszczone od tych najbardziej popularnych do najmniej używanych.  

    ux filtrowanie i sortowanie produktów
    Filtry umieszczonej w lewej kolumnie, wyświetlane domyślne warianty, a pozostałe dostępne w liście rozwijanej
    Źródło: Allegro
  11. Umieść w stopce najważniejsze linki

    Stopka to obszar zarezerwowany dla Twoich danych teleadresowych i najważniejszych linków dotyczących regulaminu, dostawy, zwrotów i zasad płatności.

    Pogrupuj tematycznie odnośniki, zgodnie z ich przeznaczeniem - dzięki temu użytkownik łatwo odnajdzie poszukiwane informacje. Dla lepszego zobrazowania niektórych elementów, np. dostępnych metod płatności, zastosuj piktogramy.

    Umieść także w stopce odnośniki do mediów społecznościowych. 

    ux stopka
    Stopka - odnośniki pogrupowane tematycznie, dane osobowe, piktogramy
    Źródło: Castorama
  12. Zakomunikuj wyraźnie USP

    USP (ang. Unique Selling Proposition) to unikalna propozycja sprzedaży, która pozwala wyróżnić Twoją ofertę na tle konkurencji. Użytkownik chce znać korzyści, jakie może uzyskać, decydując się na Twój produkt. Chce też wiedzieć, dlaczego to właśnie Twoją ofertę powinien wybrać z wielu innych dostępnych w sieci. Musisz więc jasno zakomunikować mu te korzyści i wyraźnie podkreślić to, co stanowi Twoją przewagę. 

    Dobrym rozwiązaniem będzie USP w formie belki umieszczonej u góry strony lub pod sliderem. Umieść na niej informację o darmowej dostawie i zwrocie, szybkiej wysyłce, atrakcyjnym rabacie lub innej korzyści, która od razu zwróci uwagę klientów. 

    ux usp belka korzyści
    USP - belka korzyści u góry strony
    Źródło: Answear
  13. Zadbaj o odpowiednie strony kategorii produktowych

    Strona kategorii pełni ważną funkcję w sklepie internetowym - ma pomóc w wyborze niezdecydowanym jeszcze użytkownikom i ułatwić im znalezienie produktu poprzez zminimalizowanie liczby kliknięć. 

    Możesz w tym celu skorzystać z graficznych boksów linkujących do podkategorii (tak jak na poniższym przykładzie) lub zawrzeć na stronie kategorii wszystkie dostępne w niej produkty. W drugim przypadku zadbaj o proste i wygodne filtrowanie produktów według podkategorii i danych technicznych/specyfikacji. 

    Kluczową rolę na stronie kategorii odgrywa treść. Zadbaj o to, aby pełniła funkcję nie tylko informacyjną, ale przede wszystkim poradnikową.

    Pamiętaj, aby dostarczyć użytkownikom wszystkich niezbędnych informacji, ale jednocześnie dać szybki dostęp do oferowanych w kategorii produktów - dobrym rozwiązaniem będzie umieszczenie krótkiego, sprzedażowego opisu nad listingiem produktów oraz długiego, poradnikowego tekstu na dole strony, pod listingiem produktów. 

    ux strona kategorii
    Strona kategorii - graficzne boksy linkujące do podkategorii 
    Źródło: MediaMarkt
  14. Zadbaj o odpowiednią prezentację produktów w sklepie

    Karta produktu to jeden z najważniejszych elementów sklepu internetowego. To, w jaki sposób jest zaaranżowana, w znacznym stopniu decyduje o tym, czy klient ostatecznie dokona zakupu. 

    Kluczowe elementy UX, które decydują o użyteczności karty produktu:

    • pełna nazwa produktu,
    • unikalne zdjęcia i multimedia,
    • czytelna cena, 
    • model do wyboru,
    • warianty produktu - dostępne rozmiary, warianty kolorystyczne itp.,
    • unikalny opis produktu,
    • instruktaż,
    • dane techniczne/specyfikacja,
    • informacja o dostępności produktu,
    • sekcja: “Powiadom o dostępności”,
    • przycisk “Dodaj do ulubionych”,
    • USP wskazujące korzyści zakupu, np. darmowa dostawa, możliwość zakupu na raty, darmowy zwrot itp.,
    • FAQ,
    • oceny i opinie klientów - uwiarygodniające produkt, wzbudzające poczucie bezpieczeństwa i ułatwiające podjęcie decyzji,
    • czytelne CTA, np. “Dodaj do koszyka”, “Kup teraz”,
    • produkty komplementarne i alternatywne.

    Pamiętaj, aby zgodnie z zasadą odwróconej piramidy umieszczać najistotniejsze informacje u góry strony, a te bardziej szczegółowe zawrzeć poniżej punktu przewijania. Zacznij od najważniejszych cech produktu, dodaj skrócony opis i zdjęcia, następnie umieść linki do poszczególnych sekcji, dodaj szczegółowy opis, a na samym końcu zawrzyj dane techniczne. 

    Poniżej przykład dobrze zaaranżowanej, użytecznej karty produktu.

    ux karta produktu
    Karta produktu - góra strony: pełna nazwa produktu, najważniejsze cechy (skrócony opis), cena, zdjęcie z możliwością powiększenia,
    USP - belka informująca o bezterminowych zwrotach, linki do poszczególnych sekcji (specyfikacja, szczegóły, produkty powiązane, opinie),
    przycisk: “Do koszyka”, przycisk “Dodaj do listy”.
    Źródło: Castorama
    ux karta produktu specyfikacja
    Karta produktu - widok po przewinięciu: parametry/dane techniczne
    Źródło: Castorama

     

    ux karta produktu opis produkty powiązane opinie
    Karta produktu: widok po przewinięciu: szczegółowy opis produktu, produkty powiązanie, opinie
    Źródło: Castorama 
  15. Zadbaj o przejrzystą i czytelną treść na stronie

    Nie ma nic bardziej irytującego niż “ściana tekstu” na stronie internetowej. Użytkownicy preferują krótkie bloki tekstu, lubią, kiedy informacje przedstawiane są za pomocą tabel czy infografik, są przyzwyczajeni do “skanowania” wzrokiem treści - chcą szybko wyłapywać najistotniejsze dla nich informacje, oczekują zatem ich odpowiedniej prezentacji.

    Zadbaj o przejrzystą i czytelną treść na wszystkich podstronach swojego serwisu, stosując:

    • nagłówki, za pomocą których oddzielisz poszczególne sekcje tematyczne,
    • krótkie akapity, najlepiej 4-5 zdaniowe, które będą “przyjazne” dla oka,
    • zasadę: nowa idea = nowy akapit,
    • krótkie zdania, które będą proste w odbiorze,
    • wypunktowania, 
    • graficzne formy wyrazu - zdjęcia, infografiki, tabele, wykresy,
    • hipertekstowość,
    • ciekawostki, dane liczbowe, statystyki,
    • zasadę odwróconej piramidy,
    • CTA,
    • zrozumiały dla użytkowników język.

    Pamiętaj, aby dostarczać użytkownikom wartościową, merytoryczną treść. Staraj się zawsze wyczerpać temat i odpowiedzieć na pytanie, z którym użytkownik trafił na Twoją stronę internetową. 

    ux czytelna treść
    Czytelna i przejrzysta treść
    Źródło: ANIA KRUK
  16. Postaw na wysokiej jakości zdjęcia i multimedia

    O dobrym UX decydują również zdjęcia - im lepsze jakościowo, tym bardziej obrazują dany produkt, a więc ułatwiają podjęcie decyzji związanej z jego zakupem.

    Główne, poglądowe zdjęcie produktu czasem nie wystarczy. Jeśli istotną jego cechą jest niewidoczny z daleka element, np. faktura materiału, powinieneś umożliwić jego dostrzeżenie, udostępniając również zdjęcia macro. Jeżeli klientom zależy na obejrzeniu produktu z każdej strony, postaw na technologię 360. 

    Wartością dodaną będą z pewnością materiały wideo, np. filmy ukazujące produkt w użyciu, filmy instruktażowe czy recenzje. Im więcej rzetelnych informacji jesteś w stanie dostarczyć, tym bardziej ułatwiasz podjęcie decyzji o zakupie. 

    ux zdjęcia
    Zdjęcia i multimedia - prezentacja produktu z różnych ujęć
    Źródło: Zalando
  17. Stosuj upselling i crosselling

    Daj klientom możliwość dobierania produktów komplementarnych, wykorzystując technikę crossellingu (sprzedaży krzyżowej). W ten sposób nieinwazyjnie skłonisz ich do zakupu akcesoriów i dodatkowych produktów.

    Rozważ przy tym rozwiązania z zakresu automatyzacji marketingu (ang. marketing automation), dzięki którym będziesz mógł wyświetlać im ostatnio oglądane lub specjalnie wybrane dla nich produkty.

    Stosuj upselling, umożliwiając klientom zakup produktów o wyższym standardzie lub większej funkcjonalności. 

    ux crosselling
    Crosselling - technika sprzedaży produktów komplementarnych 
    Źródło: H&M
  18. Stosuj przyciski CTA

    Przyciski CTA to ważny element UX na każdej stronie internetowej - mają skłonić użytkownika do konkretnego działania, np. dodania produktu do koszyka, złożenia zamówienia czy kontaktu z firmą. 

    Zadbaj o spójny wygląd przycisków w całym serwisie. Postaw na ich kontrastowy kolor, który od razu przykuje uwagę i odróżni je od reszty elementów na stronie.

    Zwracaj się bezpośrednio do użytkownika, stosując zwrot, który będzie dla niego w pełni zrozumiały i od razu zasygnalizuje mu, czego może spodziewać się po kliknięciu.

    Umieść przyciski CTA w widocznych i łatwych do odnalezienia miejscach. 

    ux przyciski CTA
    Spójne wizualnie i kontrastowe przyciski CTA
    Źródło: MediaMarkt
  19. Dodaj sekcję FAQ

    Rozwiewaj wątpliwości użytkowników i udzielaj odpowiedzi na najczęściej pojawiające się pytania. Dzięki temu nie tylko zbudujesz zaufanie, ale wykażesz się także profesjonalizmem i zadbasz o wizerunek eksperta w branży.

    Sekcja FAQ (ang. frequently asked questions - często zadawane pytania) w sklepie internetowym pozwala użytkownikom szybko dotrzeć do najważniejszych dla nich informacji i pomóc w podjęciu decyzji zakupowej, a Tobie samemu w dużym stopniu zaoszczędzić czas.

    ux faq
    Sekcja FAQ z najczęstszymi pytaniami
    Źródło: TOP SECRET
  20. Zapewnij wsparcie, udostępniając live chat, chatbot lub obsługę telefoniczną

    W procesie poszukiwania produktów, finalizacji transakcji, a nawet po dokonaniu zakupów klienci często potrzebują wsparcia. Na ich pozytywne doświadczenia w tym obszarze wpływają rozwiązania, które umożliwiają szybki i prosty kontakt. 

    Z pomocą mogą przyjść live chaty, obsługa telefoniczna lub chatboty. Dwa pierwsze rozwiązania sprawdzą się raczej w przypadku większych sklepów internetowych. Mniejsze sklepy mogą postawić na chatboty z gotowymi zestawami pytań i zamkniętą listą odpowiedzi. 

    ux live chat
    Live chat w sklepie internetowym
    Źródło: Komputronik
  21. Postaw na minimalistyczny i funkcjonalny koszyk

    Projektując koszyk w swoim e-sklepie, zwróć uwagę na jego design i funkcjonalność. Zrezygnuj ze sprzedażowego contentu i wszelkich rozpraszaczy, które mogą spowodować, że użytkownik przejdzie na inną podstronę.

    Postaw na minimalistyczny design koszyka. W tym miejscu klient ma przede wszystkim upewnić się, że dokonał właściwego wyboru i dodał do koszyka odpowiednie produkty. Zaprezentuj mu podsumowanie uwzględniające:

    • pełną nazwę produktu,
    • zdjęcie główne produktu,
    • cenę,
    • liczbę sztuk,
    • wybrany model,
    • wybrany rozmiar,
    • wybrany kolor. 

    Koszyk to również miejsce, w którym użytkownik powinien mieć możliwość wprowadzenia poprawek: usunięcia poszczególnych produktów, zmiany liczby sztuk czy rozmiaru.

    Postaw na kompromis pomiędzy designem a funkcjonalnością. Rozważ, czy nie warto umożliwić klientowi wybór sposobu dostawy już na etapie koszyka. Dzięki temu poinformujesz go o dodatkowych kosztach i ułatwisz decyzję związaną z finalizacją zamówienia. 

    Pamiętaj, aby umieścić na stronie button reprezentujący minikoszyk - dzięki temu użytkownik będzie wiedzieć o rodzajach i liczbie dodanych do koszyka produktów, bez konieczności przechodzenia na dedykowaną temu podstronę. Zadbaj o to, aby klient miał możliwość szybkiego podglądu i ewentualnego usunięcia produktów już z poziomu minikoszyka. 

    ux minikoszyk
    Minikoszyk - podsumowanie produktów dodanych do koszyka, możliwość usunięcia produktów oraz przeniesienia ich na listę życzeń,
    informacja o kosztach przesyłki oraz całkowitej kwocie zamówienia
    Źródło: Zalando
  22. Uprość formularze na stronie

    Zapomnij o skomplikowanych formularzach na stronie. Konieczność podania zbyt wielu, w dodatku wrażliwych informacji, nie tylko irytuje użytkowników, ale często też skutecznie zniechęca ich do finalizacji zakupów.

    Uzyskuj za pomocą formularzy tylko te dane, które są niezbędne do zrealizowania zamówienia: 

    • imię i nazwisko,
    • adres wysyłki,
    • sposób dostawy,
    • forma płatności.

    Formularze w sklepie internetowym powinny być krótkie, proste i intuicyjne. W przypadku rejestracji wystarczy tak naprawdę samo imię i adres e-mail. O dokładne dane osobowe i teleadresowe możesz poprosić później - na etapie realizacji zamówienia. 

    Usuń zbędne pola formularza, które są nie tylko nieużyteczne, ale i niezgodne z zasadami RODO, np. data urodzenia. Jeżeli chcesz zachęcić użytkowników do rejestracji w sklepie internetowym, wprowadź benefity, które będą dostępne tylko dla zarejestrowanych, np. szybkie zwroty. 

    Pozytywnie na UX wpłynie jednokolumnowa struktura formularzy. Wiele kolumn może rozpraszać uwagę użytkownika i sprawić, że rejestracja potrwa dłużej. Warto też wprowadzić natychmiastową weryfikację danych po wypełnieniu każdego pola - dzięki temu użytkownicy mogą na bieżąco sprawdzać ich poprawność. 

    ux formularz rejestracji
    Uproszczony formularz rejestracji - adres e-mail, imię i nazwisko, hasło
    Źródło: Reserved
  23. Daj możliwość zrobienia zakupów jako gość

    Daj możliwość finalizacji zamówienia bez konieczności rejestracji w Twoim sklepie internetowym. Wielu użytkowników wybiera tę właśnie opcję, ponieważ jest szybsza i, co równie ważne, mniej zobowiązująca.

    Klient Twojego sklepu internetowego powinien mieć wybór pomiędzy założeniem konta w serwisie a zrobieniem zakupów bez rejestracji. 

    ux zakupy jako gość
    Możliwość finalizacji zamówienia jako gość, bez konieczności zakładania konta w sklepie
    Źródło: H&M
  24. Zadbaj o wygodne formy płatności

    Aby ułatwić klientom robienie zakupów i finalizowanie transakcji w sklepie internetowym, należy zadbać nie tylko o prostą i intuicyjną ścieżkę zakupową czy krótkie formularze. Ważny z punktu widzenia UX jest także sposób dokonywania płatności. 

    Zadbaj o to, aby w Twoim e-sklepie dostępne były najpopularniejsze formy płatności. Większość użytkowników preferuje nowoczesne bramki, które dają szeroki wybór metod płatności - od automatycznych płatności największych banków, przez płatności kartą, po BLIK, płatności odroczone, raty online czy płatności subskrypcyjne. 

    ux formy płatności
    Wygodne i najpopularniejsze formy płatności
    Źródło: H&M
  25. Zadbaj o wygodne opcje dostawy i nieskomplikowaną procedurę zwrotu

    Daj możliwość wyboru wielu opcji dostawy, które użytkownik może dopasowywać nie tylko pod kątem indywidualnych preferencji czy wygody, ale też kosztu czy czasu wysyłki. 

    Jeżeli chcesz wpłynąć na pozytywną decyzję zakupową klienta, zapewnij darmową dostawę, choćby od pewnej kwoty zamówienia. Wyszczególnij tę opcję na karcie produktu i w formie belki u góry strony. Dodaj informację o tym, do której godziny bieżącego dnia użytkownik powinien dokonać zakupu, aby otrzymać zamówiony towar dnia następnego - z pewnością wpłynie to pozytywnie na jego wrażenia.

    Poinformuj o warunkach zwrotu, wymiany i reklamacji produktu. Zadbaj o nieskomplikowane procedury. Umieść na stronie niezbędne formularze i instruktaż wyjaśniający krok po kroku, jak przejść przez poszczególne procesy i dopełnić wszystkich formalności. 

    ux dostawa zwroty
    Dostawa i zwroty - informacje o warunkach na karcie produktu,
    dodatkowe wyszczególnienie w belce u góry strony
    Źródło: Zalando
  26. Dodaj pasek postępu wypełniania danych w checkout

    Checkout (przejście do kasy) to najważniejszy element ścieżki zakupowej użytkownika - to w tym miejscu dochodzi do finalizacji transakcji. Jeżeli źle go skonstruujesz, istnieje duże prawdopodobieństwo, że użytkownik opuści tę stronę, nie dokonując zakupów. 

    Tuż pod tytułem strony dodaj pasek postępu wypełniania danych. Dzięki wyraźnie podzielonym etapom realizacji zamówienia klient będzie wiedzieć, w którym miejscu dokładnie się znajduje. Daj możliwość powrotu do wcześniejszych etapów i edycji pól formularza, sposobu dostawy czy metody płatności. 

    ux pasek nawigacji
    Pasek postępu wypełniania danych
    Źródło: Komputronik
  27. Zadbaj o odpowiednią prędkość wczytywania stron

    Ważna pod kątem user experience jest także prędkość wczytywania stron - im szybsza, tym większa szansa na konwersję. Użyj narzędzia Google Speed Insights i sprawdź, jak Google widzi prędkość Twojej witryny. Dowiedz się, co warto na niej poprawić, aby zmniejszyć czas ładowania. 

    Zadbaj o to, aby Twoja strona internetowa uruchamiała się błyskawicznie. Zainwestuj w dobry hosting, zoptymalizuj grafiki, włącz kompresję GZIP, zadbaj o cachowanie zasobów - to tylko kilka możliwych usprawnień, które pozwolą Ci zmniejszyć czas wczytywania stron. 

  28. Zadbaj o responsywność 

    Strony responsywne, a więc dostosowujące się samoczynnie do rozdzielczości ekranu dowolnych urządzeń mobilnych i stacjonarnych, dają większy komfort przeglądania, a tym samym wpływają pozytywnie na doświadczenie użytkownika.

    Technika projektowania responsywnych stron internetowych (ang. Responsive Web Design, RWD) sprawia, że użytkownik może bez problemu znaleźć i odczytać wszystkie informacje, bez względu na to, czy wyświetlane są one na monitorze komputera stacjonarnego, laptopa, smartfonu czy tabletu, a także bez konieczności zmniejszenia czy powiększania pojedynczych elementów. 

    Responsywność to odpowiedź na potrzeby użytkowników. Wykonaj test optymalizacji mobilnej i zadbaj o responsywność, by ułatwić im sposób poruszania się po stronie i dokonywania zakupów. 

  29. Zadbaj o przyjazną stronę błędu 404

    Strona błędu 404 pojawia się wtedy, gdy serwer nie może znaleźć strony, którą użytkownik chce wyświetlić. Powodem tego może być m.in. zmiana adresu URL, usunięcie strony lub podstrony w serwisie czy złe wpisanie adresu URL. 

    Błąd 404 irytuje użytkowników, co skutkuje opuszczeniem przez nich witryny. Wpływa to negatywnie nie tylko na UX, ale też na SEO - pojawienie się błędu 404 automatycznie skraca czas pobytu na stronie, a to przy większej skali przekłada się na obniżenie pozycji witryny w organicznych wynikach wyszukiwania. 

    Poznaj kreatywne rozwiązania na strony błędu 404, dzięki którym poprawisz UX witryny lub sklepu internetowego.

    • Umieść na stronie nagłówek informujący o błędzie - możesz postawić na nieco luźniejszą formę, np. zabawny lub kreatywny tekst, który zniweluje stan irytacji i zaangażuje użytkownika w poznawanie innych treści na stronie.
    • Wstaw grafikę adekwatną do sytuacji.
    • Wyjaśnij, co mogło być powodem zaistniałego błędu.
    • Umieść sekcję z wyszukiwarką.
    • Dodaj odnośniki do kilku polecanych podstron w serwisie.
    ux błąd 404
    Przyjazna strona błędu 404 
    Źródło: Tauron
  30. Stwórz mapę strony w wersji HTML

    Mapa strony (ang. sitemap) w wersji HTML to zestawienie wszystkich podstron wchodzących w skład danej witryny. Odnośnik do niej umieszcza się zwykle w stopce strony. Dzięki temu, że mapa ta wyświetla strukturę i linki, pomaga użytkownikom poruszać się po stronie oraz znaleźć potrzebne treści.

    Stwórz mapę witryny w wersji HTML, która pomoże zagubionym użytkownikom w nawigacji i odnalezieniu właściwych podstron. Dobrze skonstruowana mapa z pewnością wpłynie pozytywnie na user experience. 

    ux sitemapa
    Sitemapa
    Źródło: kontaktowe.pl 

Czym różni się UX od UI?

Obok pojęcia user experience (UX) często występuje określenie user interface (UI), głównie dlatego, że nie ma skutecznego UI bez dobrze zaprojektowanego UX - i na odwrót. Terminów tych nie należy jednak stosować synonimicznie. User experience to doświadczenie użytkownika, a user interface to interfejs użytkownika. 

I choć dawniej ogólnie pojmowaną użytecznością serwisów czy aplikacji zajmowała się zwykle jedna osoba, dziś wielu działaniom z tej dziedziny dedykowane są osobne zawody. Oczywiście, może zdarzyć się, że projektant UX i UI to ta sama osoba, ale tylko wtedy, kiedy doskonale rozumie ona potrzeby biznesowe i zachowania użytkowników, a także posiada jednocześnie umiejętności graficzne. 

User experience designer, czyli projektant doświadczeń użytkownika, odpowiada za to, w jaki sposób odbiorca będzie korzystać z danego produktu. To do niego należy badanie potrzeb i przyzwyczajeń użytkowników, projektowanie architektury informacji, tworzenie makiet i prototypów produktów, a także testowanie użyteczności stworzonych rozwiązań. 

Z kolei user interface designer, czyli projektant interfejsu, nadaje odpowiednią formę wizualną przygotowanym przez projektanta UX prototypom. To do niego należy dobór odpowiedniej kolorystyki, typografii, przycisków, formularzy, zdjęć, grafik i wszystkich innych elementów wpływających na wygląd serwisu czy aplikacji. 

UX różni się od UI tym, że sprowadza działania wyłącznie do elementów funkcjonalnych, a nie graficznych czy estetycznych. Bez UI nie ma jednak UX - i odwrotnie. Zarówno UX, jak i UI design zmierzają do kształtowania możliwie najlepszego produktu końcowego. 

UX w pozycjonowaniu

Proces optymalizacji zakłada zmianę lub ulepszenie określonych czynników w celu poprawy sytuacji w konkretnych aspekcie. Pozycjonowanie stron internetowych ma na celu ich optymalizację pod kątem wyszukiwarek, UX z kolei zmierza do optymalizacji doświadczeń użytkownika.

Jeszcze do niedawna uważano, że prace SEO dzieją się kosztem UX i na odwrót. Te dwie fundamentalne techniki marketingu internetowego przez wiele lat występowały w opozycji do siebie. Tymczasem każda z nich ma przecież wspólny cel: optymalizację konwersji. 

Wystarczy więc tylko odpowiednie podejście i poprawne wdrożenie rozwiązań SEO i UX. Dla przykładu: doświadczony specjalista SEO i kreatywny copywriter z pewnością znajdą złoty środek na to, aby zoptymalizować nagłówki w serwisie, a więc sprawić, aby były one przyjazne zarówno dla robotów Google, jak i dla użytkowników. 

Dziś SEO i UX wzajemnie się uzupełniają - do tego stopnia, że powstało pojęcie SXO (ang. Search Experience Optimization), a więc optymalizacja doświadczeń użytkownika, która łączy działania SEO (ang. Search Engine Optimization) i UX (ang. User Experience). 

W strategii SXO chodzi więc o to, aby dzięki działaniom SEO użytkownik trafił na stronę z naturalnych (bezpłatnych / organicznych) wyników wyszukiwania, a poprzez prace UX doświadczył na niej samych pozytywnych wrażeń. 

Etapy projektowania UX

Projektowanie UX w dużej mierze opiera się na analityce i dotyczy całego procesu planowania oraz wdrażania produktu. User experience design rozpoczyna się od badań i tworzenia prototypu, a kończy na wprowadzeniu produktu na rynek. Proces projektowania UX można podzielić na 3 główne etapy:

  • strategia i badania user experience,
  • prototypowanie i testowanie,
  • wdrażanie i optymalizacja.

Strategia i badania user experience

Badania i prace związane z user experience muszą mieć punkt odniesienia, dlatego pierwszym etapem projektowania UX powinno być opracowanie przemyślanej strategii, która uwzględniać będzie najważniejsze cele biznesowe. Kolejnym krokiem jest poznanie potrzeb i przyzwyczajeń użytkowników - służą temu analizy jakościowe i ilościowe. Analiza materiału zdobytego na podstawie przeprowadzonych badań daje solidne podstawy do opracowania pierwszej wersji produktu. 

Do najpopularniejszych metod badawczych UX należą:

  • wywiady indywidualne,
  • badania kwestionariuszowe,
  • zogniskowane wywiady grupowe,
  • eye-tracking,
  • analizy map ciepła (heatmap),
  • analizy danych z Google Analytics,
  • tworzenie person UX,
  • case study,
  • ankiety,
  • nagrania sesji
  • sondy kulturowe,
  • analizy konkurencji,
  • badania dzienniczkowe,
  • sortowanie kart. 

Prototypowanie i testowanie

Na etapie prototypowania UX designer tworzy tzw. makiety (ang. wireframes) - czarno-białe lub w odcieniach szarości. Korzysta w tym celu ze specjalnych aplikacji, m.in. Adobe XD czy Axure. Istotnym elementem prototypowania jest UX writing, czyli tworzenie zwięzłych i możliwie najbardziej zrozumiałych tekstów. Po przygotowaniu makiet projektant UX przeprowadza testy z użytkownikami i zbiera kluczowe informacje zwrotne. Na tej podstawie wprowadzane są niezbędne poprawki. Skonstruowana w ten sposób makieta trafia w ręce UI designera, czyli projektanta interfejsów. 

Wdrażanie i optymalizacja

Praca nad finalnym wyglądem strony należy już do UI designera i programistów. Wdrożenie ostatecznej wersji projektu nie oznacza jednak końca prac. UX to proces ciągły, który wymaga stałego monitorowania i analizowania zachowań użytkowników, a co za tym idzie dokonywania bieżących zmian celem usprawnienia produktu. Pomagają w tym narzędzia analityczne, takie jak HotJar czy Google Analytics. 

W przypadku, kiedy produkt nie spełnia oczekiwań użytkowników i nie daje zadowalającego współczynnika konwersji, user experience designer wraca do etapu strategii i badań UX. Testowaniu różnych wariantów witryny czy aplikacji służą testy A/B. 

UX - przydatne narzędzia

W projektowaniu doświadczeń i interfejsu użytkownika niezbędne są specjalistyczne narzędzia, które umożliwiają:

Praca UX

Praca nad UX’em strony łączy w sobie szereg dziedzin z pogranicza projektowania, programowania, inżynierii, psychologii, socjologii, sztuki, a nawet filozofii. Dobry specjalista UX to osoba niezwykle wszechstronna, mogąca pochwalić się dużą kreatywnością i imponującymi umiejętnościami z zakresu analityki. 

Kim jest UX designer?

UX designer to projektant doświadczeń użytkownika, nazywany również projektantem użyteczności (ang. usability designer), który odpowiada za projektowanie produktów cyfrowych zgodnych z oczekiwaniami użytkowników, a więc funkcjonalnych i intuicyjnych. 

Czym zajmuje się UX designer?

UX designer zajmuje się projektowaniem doświadczeń użytkownika od podstaw. Jego zadaniem jest zwiększenie satysfakcji odbiorców poprzez poprawę funkcjonalności i użyteczności produktu cyfrowego (strony internetowej czy aplikacji). Finalny produkt ma być łatwy i przyjemny w obsłudze, ma też zapewniać wysoki współczynnik konwersji. Projektowanie doświadczeń użytkownika poprzedzone jest dokładnym badaniem jego potrzeb. 

UX designer to zawód, który cieszy się coraz większą popularnością, również w Polsce. W niektórych ogłoszeniach o pracę widnieje nazwa stanowiska: UX / UI designer, a to oznacza, że projektowaniem doświadczeń użytkownika i projektowaniem interfejsu ma docelowo zajmować się jedna osoba. W większych organizacjach jednak prowadzone są osobne rekrutacje na stanowiska: UX designer, UI designer, a nawet UX researcher.

  • UX researcher - przeprowadza badania i wywiady z użytkownikami produktu. Zabrane na ich podstawie wnioski przedstawia w raporcie.
  • UX designer - projektuje interakcje i makiety, opracowuje strategię, zajmuje się prototypowaniem, planowaniem testów i tworzeniem architektury informacji.
  • UI designer - odpowiada za elementy wizualne, dobiera kolorystykę, zajmuje się ustawianiem rozkładu tekstu, menu, panelami sterowania czy urządzeniami peryferyjnymi. 

Ile zarabia UX designer?

Miesięczne wynagrodzenie na stanowisku UX designer wynosi (dane za 2020 rok, źródło: No Fluff Jobs):

  • 9 000-12 750 zł na umowie o pracę,
  • 8 000-12 000 zł przy współpracy B2B.

Zarobki te zależą oczywiście od poziomu umiejętności, doświadczenia i miasta, w którym osoba ubiega się o pracę UX designera. 

Jak zostać UX designerem? Jak zacząć w UX?

UX design to wciąż młoda, ale dynamicznie rozwijająca się dziedzina, dlatego oferowane są liczne kursy, szkolenia, a nawet studia podyplomowe. Tym, którzy chcą rozpocząć swoją przygodę z projektowaniem UX, polecamy: 

  • infoShare Academy - kursy UX i UI designu
  • Coursera - kurs z interaction design
  • Future Collars - 4-miesięczny kurs z projektowania użyteczności
  • Nie tylko design - podcast Tomka Skórskiego
  • Witflow - warsztaty UX
  • AGH - studia podyplomowe z User Experience & Product Design
  • SWPS - studia podyplomowe z User Experience Design / Product Design
  • UX Wrocław - spotkania i imprezy dla zainteresowanych tematyką user experience
  • książki: 
    Donald Norman, The Design of Everyday Things
    Russ Unger, A Project Guide to UX Design
    Steve Krug, Rocket Surgery Made Easy
    Vijary Kumar, 101 Design Methods
    Caroline Jarrett, Forms that Work: Designing Web Forms for Usability
    Susan Weinschenk, 100 Things Every Designer Needs to Know About People

User experience - Twój sposób na pozyskiwanie klientów

Zgodnie z przewidywaniami analityków Market Research Future, wartość rynku oprogramowania UX ma wzrosnąć aż do 356 milionów dolarów w 2026 roku. To wzrost o 172 miliony dolarów w porównaniu do roku 2019. Tak dynamiczny rozwój rynku ma być spowodowany nieustannym wzrostem branży e-commerce, a także rozpowszechnieniem technologii takich jak sztuczna inteligencja czy Internet rzeczy. 

UX zajmuje dziś ważne miejsce w biznesie. Każda strona internetowa czy inny produkt cyfrowy są projektowane po to, by realizować określone cele. W przestrzeni online jest to najczęściej sprzedaż lub generowanie leadów. Jeżeli chcesz zwiększyć współczynnik konwersji na swojej stronie, musisz poświęcić uwagę UX, a więc tak zaprojektować doświadczenia użytkowników, by Twoja witryna sprzyjała realizacji ich celów. 

Zależy Ci na tym, aby użytkownicy chętniej korzystali z Twojej strony? Chcesz, aby częściej wysyłali zapytania ofertowe lub dokonywali zakupów online? 

Umów się na bezpłatną konsultację z naszym Specjalistą SEO/SEM - dowiedz się, jak optymalizować konwersję.

Ocena artykułu:

1 2 3 4 5

4.98 / 5 według 364 opinii

Ta strona korzysta z ciasteczek aby świadczyć usługi na najwyższym poziomie. Dalsze korzystanie ze strony oznacza, że zgadzasz się na ich użycie.
Dowiedz się jak rozwijać swój projekt / stronę www ze Specjalistą ds. reklamy internetowej. Zadzwoń teraz!