HOT OR NOT, czyli 5 podstawowych zasad projektowania doświadczeń użytkownika (UX)

Jeśli nie masz dużego doświadczenia w projektowaniu, pojęcia takie jak UX mogą być dla Ciebie mylące. Ich znajomość jest jednak absolutnie niezbędna do osiągnięcia wyższego współczynnika konwersji. Na szczęście UX składa się z kilku podstawowych zasad - gdy je poznasz i wdrożysz, będzie to najpewniej jednoznaczne ze wzrostem ruchu, konwersji czy przychodów. A przecież o to nam właśnie chodzi.
HOT_OR_NOT,_czyli_5_must_have_Twojej_strony_internetowej_w_kontekście_projektowania_doświadczeń_użytkownika

Małe firmy, duże firmy, marki osobiste czy e-commerce – niezależnie w jakiej formie i na jaką skalę prowadzisz biznes, punktem styku z Twoją marką, a być może kluczowym miejscem osiągania celów biznesowych, jest Twoja strona internetowa czy aplikacja. Dowiedz się więc, czym jest projektowanie UX i poznaj pięć kluczowych elementów, które możesz później wykorzystać w swojej witrynie. 

Czym jest UX?

Krótko mówiąc, UX lub doświadczenie użytkownika odnosi się do tego, czy strona internetowa (lub aplikacja) jest łatwa i przyjemna w użyciu. Wszystko po to, aby pomóc odwiedzającym znaleźć to, czego szukają i osiągnąć swoje cele. Jednym z elementów UX jest interfejs użytkownika (UI).

Dlaczego doświadczenia użytkownika mają znaczenie?

Strony, sklepy internetowe czy aplikacje, które są nieintuicyjne i trudne w użyciu, zwykle zniechęcają odwiedzających. Z tego powodu źle zaprojektowany UX (lub w ogóle nie zaprojektowany, jak to często bywa) prowadzi do wyższych współczynników odrzuceń, a co za tym idzie, niższych współczynników konwersji i mniejszych przychodów. Użytkownicy, mając do dyspozycji wiele innych opcji, najczęściej znajdują to, czego potrzebują, gdzie indziej. 

Prawdopodobnie nie otworzyłbyś/otworzyłabyś sklepu stacjonarnego, którego towary nie są poukładane, a działy sklepu usystematyzowane. Podobnie w sklepie internetowym: jeśli produkty i treści są niezorganizowane, a architektura informacji nieustrukturyzowana i trudna w nawigacji, użytkownik nie osiągnie celu, a wrażenia korzystania z takiej strony pozostaną negatywne.

Niezależnie od tego, czy współpracujesz z programistą w ramach dużego projektu, czy też stosujesz podejście DIY przy pracy nad swoją stroną, wdrożenie podstawowych zasad UX jest koniecznością.

Istnieje wiele sposobów na poprawę UX Twojego produktu cyfrowego, strony, sklepu czy aplikacji. Jednak większość zmian, które będziesz chciał wprowadzić, będzie podlegać jednej z pięciu zasad wymienionych poniżej.

Zasada 1 – trafność

Odwiedzający przychodzą na stronę w określonym celu. Twoim (ora naszym – jako projektantów) zadaniem jest zapewnienie wysokiej jakości doświadczeń UX, aby pomóc im szybciej go osiągnąć. W związku z tym nie zaśmiecamy witryny wieloma przypadkowymi elementami, które nie są przydatne dla użytkowników. Doskonała kompozycja to taka, z której nic już nie da się ująć, bo pozostały tylko niezbędne elementy.

Jeżeli jesteś właścicielem/właścicielką sklepu e-commerce, doskonale wiesz po co przychodzą Twoi użytkownicy – po konkretne produkty. Dlatego to nie informacja o sklepie, czy wartości marki powinny znaleźć się w kluczowym miejscu landing page, tylko konkretne, najlepiej konwertujące produkty oraz czytelna nawigacja oparta na badaniach UX. 

Tutaj pojawia się kwestia kluczowych punktów kompozycji oraz pozytywnej i negatywnej przestrzeni. Przestrzeń pozytywna w kompozycji to obszar, w którym znajdują się treści, przestrzeń negatywna to obszar pusty, powietrze dla naszej kompozycji. Często podczas przedstawiania projektu spotykam się ze stwierdzeniami: Ale po co tu tyle pustego miejsca”, „Jakoś tu pusto”. Produkt cyfrowy nie jest powierzchnią reklamową w gazecie, gdzie płacimy za każdy jej milimetr – tu nie musimy się ograniczać. Pusta przestrzeń jest powietrzem dla naszej treści. Nie duśmy jej, dajmy jej oddychać. Wówczas użytkownik będzie miał poczucie zrównoważonej przestrzeni i harmonijnej kompozycji.

HOT – https://design.google/

 

NOT – https://www.art.yale.edu/

Zasada druga – użyteczność

Niezależnie od tego, czy użytkownicy dokonują zakupów, zapoznają się z ofertą Twojej firmy czy przeglądają archiwum Twojego bloga, strona powinna być dla nich użyteczna. Oto kilka procesów, które warto poddać audytowi na swojej stronie internetowej, e-commerce czy aplikacji:

  • Zamówienie: czy proces dodawania do koszyka i składania zamówienia jest na tyle prosty, aby ułatwić zakupy?
  • Formularze: jak łatwo jest znaleźć, wypełnić i przesłać formularze, których wypełnienia oczekujesz od użytkowników?
  • Tworzenie konta: czy użytkownicy mogą znaleźć stronę rejestracji i czy proces jest prosty i bezpośredni?
  • Przeglądanie: jak trudne jest dla użytkowników przechodzenie z jednego wpisu na blogu do innego lub z jednej strony produktu na drugą?


Jako przykład świetnego projektu UX wykorzystam przykład e-commerce
https://store.google.com/gb/. Po dodaniu produktu do koszyka, dwa kroki dzielą mnie od zakupu – z czego jeden ma zrealizować mój cel, a drugi zwiększać wartość koszyka sklepu. Cóż, świat jest pełen kompromisów.

HOT – https://store.google.com/gb/

NOT – https://pl.shein.com/

Zamiast skomplikowanego procesu z dużą liczbą kroków, krótka ścieżka zakupowa zmniejsza prawdopodobieństwo, że Twoi użytkownicy porzucą proces w połowie z powodu zagubienia, frustracji czy braku czasu.

Zasada trzecia – nawigacja

Łatwo zapomnieć o znaczeniu nawigacji w witrynie. Mimo że menu zajmuje tak niewiele miejsca na ekranie, odgrywa kluczową rolę w całości doświadczeń użytkownika. Im bardziej obszerna jest Twoja witryna, tym ważniejszy jest przejrzysty system nawigacji.

Dobrze zaprojektowana architektura informacji wspiera proces wyszukiwania i nawigowania po treściach, co wpływa na szybkość i łatwość korzystania z produktu. Dzięki temu użytkownicy będą chętniej z niego korzystać. Dlaczego Allegro odniosło tak fenomenalny sukces? Bo gdy tylko pojawia się w głowie konsumenta potrzeba znalezienia (a co za tym idzie – zakupu) konkretnego produktu, cały proces to zaledwie kilka kliknięć (a kryje się za tym dobrze zaprojektowany i przebadany proces wyszukiwania i płatności).

HOT

NOT – https://www.art.yale.edu/

Zasada czwarta – dostępność

Dostępność produktów cyfrowych to wyraz troski i szacunku wobec osób z niepełnosprawnościami i o obniżonych umiejętnościach cyfrowych, które mogą korzystać z czytników ekranu lub w inny sposób modyfikować swoje doświadczenie online. Każdy odwiedzający, niezależnie od stanu zdrowia i umiejętności, powinien mieć prawo w równym stopniu zrealizować swój cel końcowy na Twojej stronie czy w aplikacji. 

Najlepszym sposobem zapewnienia dostępności witryny jest przestrzeganie wytycznych dotyczących dostępności treści internetowych (WCAG). 

  • Przykładem może być tekst alternatywny lub „alt” – to krótki opis wyświetlany w sytuacji, gdy przeglądarka nie może załadować obrazu. Jest również używany przez czytniki ekranu do informowania użytkowników niedowidzących o tym, co zawierają obrazy. 
  • Podobnie w przypadku kontrastu koloru czcionki do tła, wielkości liter, ułożenia elementów, unikania szybko migających i zmieniających się obrazów.

Dobrze zaprojektowane UX jest tym samym, co podjazd dla wózków inwalidzkich do sklepu stacjonarnego. Standard, prawda? 

HOT

NOT

W tym przypadku nie podzielę się przykładem ubogiego UX w kontekście dostępności, bo musiałabym napiętnować większość znanych marek. Niestety braków w tym zakresie nie widzi gołym okiem osoba w pełni sprawna. Gdy się nią nie jest, szybko wychodzi na jaw, że użytkowanie takich produktów jest utrudnione albo całkowicie niemożliwe.

Zasada piąta – znajomość

Większość właścicieli witryn chce, aby ich witryna wyglądała niepowtarzalnie. Chociaż jest to zrozumiałe, nadal ważne jest, aby Twoja witryna spełniała także normy dotyczących projektowania stron internetowych.

Biorąc pod uwagę, jak powszechne jest obecnie korzystanie z Internetu, użytkownicy mają oczekiwania co do tego, jak powinny wyglądać strony internetowe i gdzie prawdopodobnie będą się znajdować określone elementy. Jeśli Twoja witryna nie spełnia tych oczekiwań, odwiedzający są bardziej narażeni na zamieszanie, frustrację i trudności ze znalezieniem tego, czego potrzebują.

HOT – https://girlswhocode.com/

NOT – https://www.zara.com/pl/

Co jest znane i nie powoduje obciążenia poznawczego?

  • Logo w lewym górnym rogu, które niezależnie, z jakiego miejsca na stronie, zawsze przeniesie nas na stronę główną.
  • Menu u góry strony.
  • Wezwanie do działania (CTA) w części strony widocznej na ekranie.
  • Funkcja wyszukiwania w nagłówku.
  • Ikony social media w footerze lub menu strony.


Wszystkie te elementy spełniają standardy i oczekiwania związane z projektowaniem stron internetowych.

Key takeaways

  • Kluczem do sukcesu Twojego produktu cyfrowego, strony, e-commerce czy aplikacji jest zapewnienie użytkownikom prostej obsługi, dzięki czemu pozostaną w Twojej witrynie i staną się lojalnymi, powracającymi użytkownikami.
  • Trafność. Zdobądź wiedzę dotyczącą tego, czego chcą użytkownicy i dostarczaj im tylko te elementy, które są kluczowe dla osiągnięcia konkretnych celów. 
  • Znaczenie. Umieszczaj najpopularniejsze aspekty witryny na pierwszym planie. To  oczywiste rozwiązanie dla zapewnienia wysokiej jakości UX.
  • Użyteczność. Zasadniczo dotyczy tego, jak płynny jest proces konwersji dla użytkownika. 
  • Nawigacja. Udostępnij użytkownikom najpopularniejsze elementów witryny w menu, aby wspomóc uzyskanie lepszej konwersji. 
  • Dostępność. Użytkownicy sieci o różnych zdolnościach muszą wiedzieć, że są w stanie obsłużyć Twoją witrynę – może to oznaczać dla Ciebie dodatkową sprzedaż.
  • Znajomość. W kwestii interfejsu wizualnego czy ikon, bezpiecznym wyjściem jest nawiązywanie do ogólnie przyjętych standardów lub obiektów ze świata fizycznego. 


Masz pytania dotyczące UX lub jego podstawowych zasad? Chętnie na nie odpowiem!


O AUTORCE

Patrycja Gienia Okła

Senior Account Manager
UX/UI Designer

UX/UI, web, brand designer. Skupiona na rozwiązywaniu problemów. Od 10 lat stara się zrozumieć użytkowników [czytaj: ludzi] w Internecie. W oparciu o psychologię, socjologię projektuje produkty, usługi, strony internetowe i poprawia te już istniejące. Zdecydowana minimalistka i estetka, ewangelistka inkluzywności i dostępności w projektowaniu.

Dowiedz się więcej