- Hierarchia treści i układy dla świetnych e-sklepów
- Strona główna
- Wyszukiwanie i wyniki
- Zestawienie produktów
- Treść
- Szczegóły produktu
- Koszyk
- Proces zakupowy
- Zakupy mobilne
- Układ strony i mapa termiczna
- Wyszukiwanie mobilne
- Wnioski
- Często zadawane pytania
- Jaka jest różnica między UI i UX, skoro są one zwykle wymieniane razem?
- Jak potwierdzić wiarygodność sklepu internetowego?
- Czy zainteresowanie zakupami online wzrosło po pandemii?
- Jak przyciągnąć odwiedzających e-sklep?
Aby mówić o tym, jak wykorzystać UX do osiągnięcia lepszych wyników lub stworzenia optymalnego layoutu dla stron e-commerce (sklepów internetowych), konieczne jest wyjaśnienie, czym jest UX.
UX to skrót od User Experience, a często spotykamy się z tym terminem w połączeniu ze słowem design jako UX design lub User Experience Design. Połączenie skrótu UX i słowa design często sprawia, że ludzie myślą, że UX design to to samo co web design (UI) lub projektowanie różnych stron albo że chodzi o grafikę i projekt wizualny.
Jednak cel projektowania UX jest zupełnie inny, a konkretnie stworzenie relacji między użytkownikiem a marką, gdzie użytkownik jest w centrum uwagi. Jest to proces projektowy, który towarzyszy nam przy projektowaniu produktu lub usługi od momentu jej powstania do wprowadzenia na rynek lub wdrożenia do produkcji.
Różnicę między UX a UI designem oraz wyjaśnienie, dlaczego oprócz wizualności strony, ważny również jej layout, można wyjaśnić na prostym przykładzie butelek po ketchupie.
Na zdjęciu po lewej stronie widzimy butelki ketchupu, które są przedmiotem pewnego projektu. Można powiedzieć, że na pierwszy rzut oka atrakcyjność wizualna obu butelek jest dobra i spełnia swoje zadanie. Na zdjęciu po prawej stronie widać, że mimo doskonałego designu obu butelek, doświadczenie z ich użytkowania jest inne, co będzie miało dodatkowy wpływ na decyzje zakupowe klienta. Dlatego na UX należy zwrócić taką samą uwagę, jak na ogólną oprawę wizualną.
Jednym z błędów w branży e-commerce jest to, że nie znamy swoich klientów i często skupiamy się przede wszystkim na danych ilościowych, takich jak analityka oraz na części technicznej rozwiązania i specyfikacji funkcji, które chcemy, aby e-sklep zawierał, bo rozwiąże nasze konkretne problemy.
Brakuje jednak miejsca dla klientów, więc nie znamy ich kluczowych problemów i potrzeb oraz sposobów ich zaspokojenia, co często przekłada się na rentowność i skuteczność e-sklepu oraz prowadzonych kampanii.
Poniższy przykład ilustruje, jak ważne jest skupienie się na poznaniu klienta. Dla przykładu możemy wziąć dwie osoby z tego samego kraju, w tym samym wieku, z rodziną, obie wybierają się na wakacje w te same miejsca. Jednak różnica między nimi to np. zawód, styl życia, czy religia, która wpływa na ich zachowania zakupowe.
Hierarchia treści i układy dla świetnych e-sklepów
Wiemy czym jest UX, z czym jest związany i dlaczego jego stosowanie jest kluczowe. Teraz omówimy ten termin bardziej szczegółowo na przykładzie strony e-sklepu.
Strona główna
Jedną z istotnych stron sklepu internetowego jest niewątpliwie strona główna. Jest ona pierwszą rzeczą, z którą klient styka się po otwarciu e-sklepu i odgrywa swoją rolę w podejmowaniu decyzji przez odwiedzających, których możemy podzielić na trzy podstawowe typy:
- klient, który przyszedł do e-sklepu i dokładnie wie, czego chce
- klient, który ma pojęcie o tym, co by chciał, ale nie wie konkretnie
- klient, który szuka inspiracji, a więc nie ma konkretnego pomysłu na to, co by kupił
Każdy klient podchodzi do zakupu inaczej, dlatego układ strony głównej powinien być dopasowany do jego zachowań zakupowych. Jedną z podstaw jest tworzenie angażujących treści na landing page, zwłaszcza jeśli dobrze znasz swoich potencjalnych klientów.
Istnieją jednak ogólne zasady dotyczące budowania odpowiednich treści dla klientów e-sklepu, np. banery na stronach z promocjami i produktami sezonowymi, na które nie trzeba przeznaczać niepotrzebnie dużo miejsca, ponieważ nie zawsze przyniosą Ci tyle kliknięć, ile oczekujesz. Wyjątkiem jest zniżka sezonowa lub atrakcyjny rabat czy oferta. Pod banerem strony wypada umieścić podstawowe informacje o zakupie, które interesują użytkownika – opcje płatności, czas dostawy produktu, wysyłka, reklamacje itp.
Jednym z ulubionych elementów dla klientów jest wyświetlanie najpopularniejszych kategorii w połączeniu z produktami typu Popularne w kategorii, Najpopularniejsze produkty, Najlepsze produkty w ofercie, czy Najpopularniejsze marki.
Rekomendacje produktowe i rabaty sprawdzają się głównie w przypadku klientów, którzy nie zdecydowali, co chcą kupić lub szukają inspiracji. W przypadku potencjalnych klientów musisz najpierw zdobyć ich zaufanie. Pomocne tu będą opinie użytkowników lub weryfikacja z recenzjami.
Dolna część strony głównej służy do przekazywania treści, które są wykorzystywane przez serwisy e-commerce do wspierania sprzedaży. W większości przypadków mają formę bloga lub wyświetlanych postów z serwisów społecznościowych. Jeśli zaangażujesz użytkownika swoimi treściami w tej sekcji, możliwe, że będzie on bardziej zmotywowany do zapisania się na Twój newsletter lub zaobserwowania sieci społecznościowych. Drzemie tu taki potencjał!
Nagłówek e-sklepu
Strona główna musi zaczynać się od nagłówka, zawierającego logo, które służy do przenoszenia na stronę główną. Następnie zazwyczaj widać rozbudowaną nawigację w postaci menu. Konieczne jest też pole wyszukiwania. Wreszcie w nagłówku e-sklepu muszą znaleźć się takie niezbędniki jak: koszyk z podsumowaniem ceny, przycisk logowania/tworzenia konta czy lista życzeń.
Nagłówek jest ważny, szczególnie dla klientów, którzy wiedzą czego chcą i kierują się od razu do wyszukiwania – to również on prowadzi do wysokiego prawdopodobieństwa zakupu. Natomiast z nawigacji korzystają głównie klienci, którzy są w fazie odkrywania produktu i potrzebują więcej czasu na podjęcie decyzji.
Stopka e-sklepu
Stopka to miejsce, w którym użytkownik często szuka informacji o: stronie, opcjach płatności, kontakcie, reklamach, sieciach społecznościowych itp. Załóżmy, że użytkownik przyzwyczaił się do przewijania strony na sam dół. W takim przypadku prawdopodobnie czegoś szukał lub spodobała mu się zawartość e-sklepu, dlatego w stopce wato też umieścić linki do głównych kategorii e-sklepu, aby klienci mogli wygodnie kontynuować przeglądanie.
Nawigacja
Nawigacja i struktura e-sklepów mają znaczący wpływ na takie metryki jak współczynnik konwersji, sprzedaż czy wkaźnik porzuceń. A jeśli użytkownicy nie mogą zorientować się, gdzie są i jak mogą znaleźć poszukiwany przedmiot, opuszczą stronę. Bez prostej i funkcjonalnej nawigacji nie dowiedzą się, jak przejść przez katalog produktów, blog, biuro, sklep itp.
Jeśli użytkownik szuka nawigacji na stronie lub w sklepie internetowym, to najczęściej pomyśli o poziomym menu z nagłówkiem. Często wykorzystywaną przestrzenią wspierającą nawigację główną na górze jest też pasek boczny. Kiedy użytkownicy przechodzą do kategorii na najwyższym poziomie, ich podkategorie pojawiają się w pasku bocznym. Funkcje nawigacyjne paska bocznego są doskonałym rozwiązaniem dla sklepów lub stron, które wymagają wielu informacji do strukturyzacji. Oprócz podkategorii, stanowi on doskonałą przestrzeń do filtrowania produktów.
Standardowym i skutecznym rozwiązaniem jest wspomniane już menu, reprezentujące duży pasek nawigacyjny wyświetlany po najechaniu myszką na dany element w głównej nawigacji. Jest to doskonały wybór w przypadku umieszczenia wielu pozycji w kategoriiach lub pokazania bardziej znaczącej liczby podstron niższego poziomu. Taki przejrzysty układ oferuje również więcej miejsca, na przykład na wyświetlanie produktów lub reklam oraz więcej miejsca na przedmioty, co poprawia doświadczenie klienta.
Wyszukiwanie i wyniki
Wyszukiwanie jest kolejnym z najbardziej krytycznych elementów nawigacji. Użytkownicy są bardziej skłonni do wyszukiwania pożądanych przedmiotów, jeśli wiedzą, że sklep internetowy oferuje produkt lub kategorię, której szukają.
Nasze badania pokazują, że około 30% użytkowników opuszcza stronę lub sklep, jeśli nie znajdzie na niej tego, czego szuka. Użytkownicy wybierają między menu wyszukiwania a menu nawigacyjnym w zależności od różnych czynników, z których kluczowymi są wspomniane już typy użytkowników i ich intencje oraz segmenty produktów, do których należą e-sklepy.
Wyniki wyszukiwania odgrywają osobną rolę w zachowaniach zakupowych użytkowników. Strona ta jest bardzo podobna do klasycznego zestawienia produktów w sklepie internetowym. Jednak typowym problemem wyszukiwania jest to, że nie jest ono wystarczająco inteligentne, aby zapewnić użytkownikowi wyniki, które odzwierciedlają jego zainteresowania i zachowania zakupowe. Dlatego użytkownicy często trafiają na stronę bez wyników, co w jednej trzeciej przypadków oznacza ich natychmiastowe opuszczenie e-sklepu.
Drugim powszechnym problemem jest brak możliwości filtrowania produktów znalezionych na stronie wyników lub ograniczenie dostępnych filtrów. Powoduje to, że wyszukiwanie nie może działać z filtrami fasetowymi, a użytkownik musi przeszukiwać wyniki, zamiast filtrować produkty zgodnie z własnymi preferencjami.
Zestawienie produktów
Zestawienia produktów są istotną częścią e-sklepu, która kieruje użytkowników do konwersji na szczegóły produktu. Podstawowy układ zestawienia produktów, czy też bardziej precyzyjnie wyświetlanych kategorii w e-sklepie, składa się z:
Rozszerzonego nagłówka
Rozszerzony nagłówek z nazwą kategorii wraz z opisem, w którym znajduje się użytkownik. Możesz również pomóc użytkownikom, dodając wskazówki dotyczące wyboru odpowiedniego produktu do etykiety.
Breadcrumbs
Breadcrumb, czyli inaczej nawigacja okruszkowa, stosowana jest w połączeniu z wyszukiwaniem. Użytkownikom łatwiej jest “podróżować” do kategorii, która ich interesuje, a nie znają np. jej dokładnej nazwy. Wówczas za pomocą breadcrumb mogą przeklikać się przez szczegóły wyszukiwanego produktu do pożądanej kategorii.
Opcje sortowania
Pod nazwą i opisem kategorii często wyświetlane są podkategorie lub filtry produktów z opcjami sortowania. Domyślnie są one jednak wyświetlane na pasku bocznym.
Pasek boczny
Pasek boczny jest często używany do wyświetlania podkategorii, filtrów produktów w kategorii lub wspomnianych filtrów fasetowych w wynikach. Załóżmy, że filtr paska bocznego nie jest wystarczająco zoptymalizowany lub struktura kategorii nie jest odpowiednio przetworzona. W takim przypadku zawartość paska bocznego jest znacznie dłuższa niż zawartość strony, co negatywnie wpływa na zachowanie użytkownika.
Treść
Centralną częścią jest treść strony, która składa się z produktów, gdzie dla każdego z nich powinien być wyświetlony przynajmniej:
- Obraz podglądu
- Nazwa produktu
- Cena lub wyświetlana cena oryginalna
- Dostępność produktu lub szacowana dostawa i liczba produktów w magazynie.
- Przycisk “dodaj do koszyka” – zależy on głównie od segmentu. Jeśli jest to odzież, która zależy od rozmiaru, może się nie sprawdzić, ale jeśli są to na przykład książki, użycie przycisku miałoby większy sens.
- Elementy marketingowe – opis nowości, rabat, wyprzedaż, wygodne opakowanie, ostatnie sztuki – to różne formy uatrakcyjnienia produktów dla użytkownika.
- Na liście można wyświetlić wszystko dla produktów, wystarczy pomyśleć o krytycznym czynniku lub czynnikach, na podstawie których użytkownik podejmuje decyzje, takich jak liczba dostępnych kolorów lub innych wariantów, itd.
Częstym pytaniem jest to, jak powinna wyglądać idealna paginacja w sklepie internetowym i czy używać przycisku “pokaż więcej” czy strzałek. Obie opcje działają dobrze, ale idealne rozwiązanie łączy oba warianty, a użytkownik wybiera rozwiązanie, które najbardziej mu odpowiada.
Przy zestawieniu produktów należy unikać nieskończonego przewijania, które znajduje zastosowanie w zupełnie innych przypadkach przeglądania treści, np. na portalach społecznościowych, galeriach itp. ale nie podczas zakupów.
Szczegóły produktu
Szczegóły produktu to jedna z głównych stron “konwersji” w sklepie internetowym i to właśnie tam podejmowane są największe decyzje. Możemy podzielić szczegóły dla użytkownika na dwie zasadnicze części – część zakupową i część informacyjną.
Część zakupowa
Część zakupowa prezentuje podstawowe parametry i informacje, które bezpośrednio wpływają na decyzję użytkownika. Idealna kompozycja tej części detalu produktu składa się z:
Zdjęcia produktów/galeria
Zawsze wyświetlaj jak najwięcej zdjęć produktów, wideo lub recenzje wideo produktów, wszystko w najlepszej możliwej jakości. Nawet ze zdjęć/filmów produktowych użytkownik uzyskuje wiele informacji, których może nie być w opisie. Ta sekcja często wykorzystuje etykiety lub informacje o zniżkach/promocjach, nowościach lub różnych nagrodach lub certyfikatach.
Marka produktu
Po kliknięciu na szczegóły marki produktu można wyświetlić wszystkie produkty i kategorie tylko wybranych marek.
Nazwa produktu
Idealnie, jeśli oprócz nazwy produktu występuje również marka lub oznaczenie odmiany, np. czerwona, metaliczna, XL itp.
Kod produktu
Ma ogromne znaczenie, zwłaszcza w e-commerce B2B, ale pomaga także klientom, którzy kupują te same produkty wielokrotnie w e-sklepach B2C.
Kategoria
Kategoria, w której znajduje się produkt, odgrywa istotną rolę w nawigacji użytkownika, zwłaszcza jeśli produkt został znaleziony przez reklamę lub podczas wyszukiwania w Internecie.
Parametry produktu
Parametry produktu – rozmiar, warianty, kolory itp. – odgrywają istotną rolę w podejmowaniu decyzji, dlatego najlepiej umieścić je w pobliżu informacji o dostępności i cenie przy przycisku “dodaj do koszyka”. Gdy użytkownik zmieni którykolwiek z parametrów, powinien zobaczyć zmiany w cenie, dostępności lub innych wartościach, które go interesują.
Dostępność
Dostępność wyświetlanego produktu w sklepie internetowym i w salonach.
Dostawa
Szybkość dostawy lub szacowana data dostawy – im dokładniejsze oszacowanie, tym bardziej zadowolony będzie użytkownik po zakupie.
Przycisk Dodaj do koszyka
Najważniejszy przycisk na stronie powinien być zawsze jasno zdefiniowany i jednoznaczny. Gdziekolwiek znajduje się na stronie, zawsze musi być jasne, że jest to przycisk dodawania do koszyka. Wzór przycisku zależy od segmentu działalności, sposobu komunikacji i projektu samego e-sklepu. Na przykład, jeśli sprzedajesz online luksusowe motocykle elektryczne, możesz łatwo użyć czarnego przycisku z tekstem kup. Jeśli jednak sprzedajesz i dostarczasz żywność, zielony przycisk z tekstem w koszyku będzie prawdopodobnie bardziej odpowiedni. Przycisk zazwyczaj wyświetla pole z kwotą.
Cena produktu
Najbardziej decydująca część zakupu. W sklepach internetowych często pracujemy z promocjami i rabatami, dlatego ważne jest, aby o nich informować. Jeśli przecenisz produkt, wyświetl etykietę rabatu i oryginalną cenę. Nie jest również najlepszym rozwiązaniem obniżanie cen wszystkich produktów jednocześnie, ponieważ może to podważyć ekskluzywność produktu.
Dodatkowe funkcje
Dodatkowe funkcje, takie jak lista życzeń, udostępnianie lub tabela rozmiarów, to typowe elementy, do których użytkownik jest przyzwyczajony lub których oczekuje w szczegółach. Krótki opis produktu, powiązany z częścią informacyjną strony, jest zwykle umieszczany po nazwie produktu.
Korzyści sklepu internetowego
Prezent za zakup i informacja o cenie dostawy, która jest zwykle przeliczana na podstawie liczby produktów w koszyku, system lojalnościowy lub prosta komunikacja zwrotna.
Część informacyjna
Część informacyjna produktu składa się głównie z głównego opisu produktu i jego właściwości. Powinna również zawierać galerię, recenzje wideo lub prezentacje, tabelę wszystkich parametrów produktu, opis producenta oraz różne dodatkowe materiały do pobrania.
W tej sekcji często znajduje się miejsce na recenzje lub pytania od odwiedzających, np. dyskusję w formie Q&A. Same recenzje są cennym źródłem informacji dla użytkowników i jednocześnie wspierają wiarygodność e-sklepu. Im lepiej opracowane są szczegóły produktu i im lepiej opisane są produkty, tym bardziej prawdopodobne jest, że użytkownicy dokonają zakupu w sklepie internetowym.
Szczegóły produktu to świetne miejsce, w którym możemy szybko pomóc użytkownikom odkryć inne produkty lub kategorie w ofercie e-sklepu za pomocą rekomendacji. Zaleca się umieszczanie rekomendacji bezpośrednio pod centralną częścią zakupową na szczegółach produktu, aby zyskały wystarczająco dużo miejsca i nie odwracały niepotrzebnie uwagi od głównego produktu.
Podczas przeglądania rekomendacji należy uważać, aby użytkownik nie pomylił ich na przykład ze wspomnianymi wariantami. Powinny być one umieszczone wyżej, w pobliżu przycisku zakupów i parametrów produktu.
Koszyk
Koszyk jest bramą do procesu zakupów. Koszyk ma uproszczony interfejs w porównaniu z innymi częściami witryny, aby pomóc użytkownikowi skupić się na sfinalizowaniu zakupu i uniknąć porzucenia koszyka. Często używaną funkcją w koszyku jest czas, który ostrzega użytkowników, że produkty będą dostępne tylko przez określony okres, motywując ich w ten sposób do szybszego podejmowania decyzji i dokonywania zakupów.
Idealna kompozycja koszyka składa się z następujących części i parametrów:
- Uproszczony nagłówek bez nawigacji – pozwala na szybki powrót do poprzedniej strony lub strony głównej i wyświetlenie kolejnych kroków w procesie zakupowym, które czekają na użytkownika.
- Informacja o darmowej wysyłce, lub prezencie, działająca na tej samej zasadzie – najlepiej umieszczona pod nagłówkiem nad podsumowaniem produktów
- Podsumowanie produktów w koszyku – domyślnie powinno wyświetlać produkty wraz z ceną końcową i możliwością zmiany ich numerów lub usunięcia z koszyka. Produkty muszą pokazywać wybrane parametry i możliwość kliknięcia w ich szczegóły w e-sklepie.
- Ostateczna cena produktów – jest wyświetlana zaraz po podsumowaniu produktów i miejscu na kod kuponu rabatowego.
- Polecenie produktu – koszyk jest idealnym miejscem na wsparcie zakupu rekomendacją. Miejsce na umieszczenie poleceń znajduje się tuż nad lub pod przyciskami “wróć” i “dokończ zakup”. Pozycja zależy od zawartości produktów w rekomendacji. Jeśli w bloku z produktem znajduje się zbyt wiele parametrów i zajmuje on zbyt dużo wysokości, umieszczamy je całkowicie na dole, ale jeśli są kompaktowe i niezbyt wysokie, możemy wygodnie umieścić je nad wspomnianymi przyciskami, wtedy przyciągają więcej uwagi użytkownika. Nigdy jednak nie umieszczaj rekomendowanych produktów w podsumowaniu koszyka nad wstawionymi produktami. Spowoduje to dezorientację użytkowników, którzy spodziewają się zobaczyć zupełnie inne produkty, co może zachęcić ich do opuszczenia strony.
Już w tej sekcji możesz poinformować użytkowników, jakie opcje płatności i wysyłki możesz im zaoferować przy zakupie, bez konieczności przechodzenia do kolejnych kroków. W takim przypadku poprawisz swoje statystyki i zmniejszysz współczynnik odrzuceń.
Proces zakupowy
Najczęściej stosowanym procesem zakupowym jest proces wieloetapowy. W przeciwieństwie do alternatywnych rozwiązań, takich jak jednoetapowy/jednostronicowy proces zakupowy, przynosi on więcej korzyści i możliwości.
Jednoetapowy proces jest skuteczny, głównie gdy jest stosowany na początku działalności e-sklepu lub w prostszych przypadkach, gdy e-sklepy nie oferują większej liczby opcji płatności i wysyłki w procesie zakupu, a użytkownicy nie są przyzwyczajeni do dokonywania zbyt wielu zakupów pod względem dużej liczby przedmiotów.
Wadą jest jednak mierzenie procesu zakupowego, ponieważ jest on tylko jednym krokiem. Każdy zakup użytkownika oznacza opuszczenie całego procesu zakupowego; na tej podstawie trudno nam oszacować, gdzie wystąpił problem.
Zalety wieloetapowego procesu zakupowego to przede wszystkim przejrzystość i znacznie lepsze pomiary przejścia przez proces zakupowy dzięki podziałowi na kilka kroków:
Koszyk lub podsumowanie zamówienia
Podsumowanie produktów, które klient zdecydował się dodać do koszyka.
Wybór płatności i wysyłki
Ta część procesu zakupowego jest prosta – pod warunkiem, że wszystkie opcje dla użytkownika są wystarczająco opisane, ze wszystkimi krytycznymi informacjami (a nie tylko nazwą wyboru i opłatą), ale także tymi dodatkowymi, takimi jak wybór dostawy kurierem, dostarczanie towarów tylko w dni robocze lub również w weekendy, data doręczenia itp.
Załóżmy, że klient wybiera odbiór osobisty. W takim przypadku powinien mieć możliwość wyboru sklepu i automatycznie zobaczyć godziny otwarcia, konkretny adres, najlepiej również telefon i oczywiście datę, kiedy będzie mógł odebrać towar. Użytkownicy często zaglądają do opcji wysyłki i płatności, aby dowiedzieć się, jaka będzie ostateczna cena ich zakupu wraz z dostawą i kiedy ją otrzymają, nawet jeśli jeszcze nie zdecydowali się na sfinalizowanie zakupu.
Logowanie do konta i wprowadzanie informacji rozliczeniowych i wysyłkowych
Jest to często najbardziej frustrująca część zakupu dla użytkownika, ponieważ często jest to kwestia wypełniania formularzy. Nawet jeśli użytkownik się nie zaloguje, możemy uprościć jego wypełnienie, używając imienia i nazwiska, numeru telefonu i adresu e-mail. Potwierdź każde pole podczas wypełniania, aby użytkownik wiedział, że wprowadził prawidłowe informacje. Poproś użytkownika o podanie danych po kolei; jeśli jest zainteresowany rejestracją, wyświetli pola do wprowadzenia hasła dopiero po wybraniu tej opcji. W kolejnych krokach będziesz potrzebować adresów do faktury i wysyłki.
Możesz ułatwić użytkownikom wypełnianie adresów poprzez automatyczne uzupełnianie adresu rozliczeniowego lub wysyłkowego. Jeśli użytkownik wprowadzi ulicę i numer, nie musisz martwić się o wypełnianie innych niepotrzebnych pól. Uzupełnianie danych zwykle kończy się udzieleniem zgody. Postaraj się maksymalnie uprościć tę część i sformułować ją tak prosto, jak to tylko możliwe. W sekcji danych osobowych często istnieje opcja dodania notatki do zakupu od klienta, ale jeśli nie masz pewności, że nie przeoczysz tych notatek, najlepiej w ogóle ich nie oferuj. Zmniejszysz w ten sposób prawdopodobieństwo złego doświadczenia użytkownika.
Podsumowanie całego zakupu + sprawdzenie wprowadzonych danych
Użytkownik może podjąć decyzję o zmianie czegoś, więc wskazane jest, aby umożliwić mu przejście do dowolnego kroku bez konieczności klikania przycisków “wstecz i kontynuuj”. W tym kroku musi on zobaczyć wszystkie dane niezbędne do podjęcia decyzji i wysłania zamówienia. Dlatego nie zapomnij poinformować go o ostatecznej cenie zakupu i, najlepiej, najdokładniej oszacować czas dostawy zamówienia.
Po wysłaniu zamówienia najlepiej jest, jeśli użytkownik przejdzie bezpośrednio do bramki płatności i dopiero po dokonaniu płatności na tak zwaną stronę z podziękowaniami; unikniesz zamknięcia strony przez użytkownika, zanim zostanie przekierowany do płatności, co ostatecznie utrudni proces zakupu nie tylko jemu, ale także Tobie. Strona z podziękowaniem jest w zasadzie również częścią procesu zakupowego i dostarcza głównie informacji o udanym zakupie. Jej ogromną zaletą jest możliwość uzyskania informacji od klienta dzięki prostemu formularzowi.
Na tej stronie można między innymi zmotywować anonimowego lub zalogowanego użytkownika do zostania lojalnym klientem i dokonywania kolejnych zakupów poprzez specjalne oferty lub kody rabatowe. Można też skierować go do innych treści w e-sklepie, takich jak rekomendacje produktów lub na przykład artykuły na blogu, a także skonfigurować kampanie e-mailowe w celu wysyłania ofert.
Zakupy mobilne
Zakupy mobilne to rosnący trend, w którym telefony komórkowe odgrywają coraz ważniejszą rolę. Powszechną praktyką jest wyszukiwanie informacji przed zakupem, na podstawie których użytkownicy decydują, czy i gdzie kupić dany produkt. Co ciekawe, według najnowszych danych 69% klientów dokonuje zakupów głównie na urządzeniach mobilnych.
Na rosnący trend zakupów mobilnych ma wpływ wiele czynników, takich jak postęp technologiczny, zasięg i dostępność szybkiego Internetu, przystępność cenowa urządzeń mobilnych, usługi płatności mobilnych, takie jak Apple pay i Google pay, ale także wsparcie e-sklepów poprzez rozwój ich aplikacji e-commerce i dążenie do osiągnięcia jak najlepszych doświadczeń zakupowych dla użytkownika. Jednym ze sposobów na uzyskanie pozytywnego doświadczenia użytkownika jest zrozumienie, w jaki sposób użytkownik kontroluje urządzenie mobilne.
Układ strony i mapa termiczna
Dzięki testom i analizom zachowań użytkowników możemy określić, w jaki sposób wchodzą oni w interakcję z ekranem, wyświetlając mapy termiczne. Możemy w ten sposób precyzyjnie określić, jak zaprojektować interfejs aplikacji lub strony internetowej, aby użytkownik mógł z niej wygodnie korzystać. Każdy kolor wyjaśnia, jak łatwo jest korzystać z różnych części ekranu.
Informacje te są dla nas niezbędnym wkładem w projektowanie interfejsu użytkownika i układu kluczowych elementów. Struktura tych elementów we właściwych miejscach na ekranie znacznie poprawia wrażenia cyfrowe, ponieważ przestrzeń ekranu urządzeń mobilnych jest znacznie ograniczona w porównaniu do tradycyjnych ekranów komputerowych.
Krytyczne części e-sklepu w widoku mobilnym:
Nagłówek
Nagłówek powinien spełniać określone parametry, aby służyć jako praktyczny element nawigacyjny; powinien być również kompaktowy, niezbyt wysoki, ponieważ pozbawi użytkownika dostępu do treści. Powinien zawierać logo z kliknięciem na stronę główną. Często stosowany jest tzw. pływający nagłówek, czyli nagłówek, który jest zawsze wyświetlany, nawet podczas przewijania.
Logo
Uproszczona wersja logo łatwo dopasowuje się do wyświetlacza mobilnego i nie zajmuje dużo miejsca.
Menu hamburgerowe
Istotna część nagłówka, pod którą ukrywa się nawigacja i koszyk, który pokazuje minimalną liczbę wstawionych elementów.
Pasek wyszukiwania
Pasek wyszukiwania powinien być widoczny w całości, najlepiej bez ukrywania go za ikoną lupy, by nie pozbawiać użytkowników wygody podczas przeglądania e-sklepu.
Wyszukiwanie mobilne
Zoptymalizowane i funkcjonalne wyszukiwanie na urządzeniach mobilnych odgrywa kluczową rolę. Optymalizacja polega na prawidłowym rozmieszczeniu elementów, które maksymalnie uproszczą kontrolę użytkownika, np. postaw na:
- Kompaktowe wyświetlanie autouzupełniania wraz z paskiem wyszukiwania na całym ekranie urządzenia – znacznie zwiększy przejrzystość i łatwość korzystania z wyszukiwania
- Autouzupełnianie – wyświetla wyniki od pierwszego znaku, a po otwarciu rekomenduje kategorie, najczęściej wyszukiwane frazy, ulubione produkty lub artykuły oraz inne treści
- Ukrywanie klawiatury – podczas przeglądania wyników w autouzupełnianiu wirtualna klawiatura jest automatycznie ukrywana, aby użytkownik miał wystarczająco dużo miejsca na przeglądanie produktów
- Porządek – wyniki są uporządkowane w zakładkach zgodnie z parametrami krytycznymi, między którymi użytkownik może klikać lub przesuwać, po prostu przesuwając się na strony.
Funkcjonalność wyszukiwania polega na jego zachowaniu podczas interakcji z użytkownikiem. Dokładne wyszukiwanie powinno zawsze prowadzić użytkownika do odpowiedniego wyniku i uwzględniać jego normalne zachowanie, niezależnie od tego, jak wpisuje wyszukiwaną frazę, czy pisze tytuł z literówkami, używa slangowego terminu lub archaizmu itp.
Użytkownicy szukają spersonalizowanych doświadczeń bardziej niż kiedykolwiek. Dlatego ładnie wyglądająca strona nie wystarczy. Musisz zbudować bezproblemowe doświadczenie, aby odnieść sukces lub zaryzykować utratę klientów tuż po ich pierwszej wizycie. Mamy nadzieję, że ten post pomoże Ci zrozumieć, jak skuteczne może być właściwe wykorzystanie UX, aby uczynić Twój biznes online bardziej atrakcyjnym i aby pozyskać więcej klientów.
Często zadawane pytania
Jaka jest różnica między UI i UX, skoro są one zwykle wymieniane razem?
Mówiąc najprościej, interfejs użytkownika (UI) składa się ze wszystkich elementów, które umożliwiają interakcję z produktem lub usługą. Z drugiej strony, doświadczenie użytkownika (UX) jest tym, co osoba wchodząca w interakcję z tym produktem lub usługą zabiera z całego doświadczenia. Istotne jest odróżnienie ogólnego doświadczenia użytkownika od interfejsu użytkownika, chociaż te dwa pojęcia łączą się ze sobą. Jako przykład rozważmy witrynę z recenzjami popularnych filmów. Podczas gdy interfejs użytkownika do wyszukiwania filmów jest doskonały, UX nie będzie korzystny dla takiego użytkownika, który chce uzyskać informacje o małej, niezależnej premierze, ponieważ baza danych zawiera tylko filmy z dużych wytwórni.
Jak potwierdzić wiarygodność sklepu internetowego?
- ważny certyfikat SSL
- oświadczenie o ochronie prywatności
- aktualne ceny/nie przeceniaj wszystkich produktów na raz
- aktualny adres i numer telefonu
- zwracanie uwagi na błędy ortograficzne i gramatyczne
- możliwość pisania recenzji w sklepie internetowym
- linki do sieci społecznościowych
testowanie A/B
Czy zainteresowanie zakupami online wzrosło po pandemii?
Dzięki lockdownom zainteresowanie zakupami online logicznie wzrosło. Sprzedaż e-commerce zwiększyła się nawet o kilka miliardów dolarów za granicą w 2021 roku i ponad 2 miliardy euro na Słowacji. Nie można przewidzieć, czy utrzyma się na poziomie 100%. Jednak w ciągu dwóch lat pandemii przestrzeń internetowa ewoluowała i dostosowała się do sytuacji, tak aby cały proces zakupów online był jak najszybszy i najwygodniejszy.
Jak przyciągnąć odwiedzających e-sklep?
- przyjemny design
- reklamy
- “poznaj” swojego klienta
- recenzje i kliknięcia w sieciach społecznościowych
- skup się również na szczegółach – układ strony odgrywa znaczącą rolę
- nie naciskaj na klientów z rejestracją lub newsletterem
- pomoc dla użytkowników
- rabaty i oferty – korzyści dla zarejestrowanych użytkowników
Gejza jest CEO i współzałożycielem Luigi's Box. Od ponad dekady pracuje nad doświadczeniem użytkownika i optymalizacją współczynnika konwersji w e-commerce. Jego głównym obszarem zainteresowania jest zarządzanie firmą, strategią, finansami oraz pomoc największym klientom w uzyskaniu jak największych korzyści z wyszukiwania i rekomendacji produktów.
Więcej wpisów tego autora