O tym czym jest User Experience można przeczytać w osobnym artykule, w którym zamiast przepisywać Wikipedię i zamieszczać jakieś pseudo-wykresy pokazałem na żywych przykładach o co w tym wszystkim chodzi.

Co to jest User Experience - przykłady

W tym artykule zaprezentuję kilka sprawdzonych sposobów na zwiększenie wygody użytkownikom i zwiększenie konwersji na stronie internetowej, sklepie czy w aplikacji.

Ponieważ UX odnosi się zarówno do wyglądu strony internetowej jak i interakcji – porady będą miały interdyscyplinarny charakter i mogą być stosowane wybiórczo.

#1: Hierarchia elementów interaktywnych

Na stronie internetowej użytkownicy i właściciel portalu mają wspólne interesy. Przyciski akceptujące od anulujących warto odróżnić nie tylko za pomocą etykiety i barwy ale też wielkości a nawet designu. Tę sztuczkę UX przyspieszającą i ułatwiającą proces interakcji stosują największe portale i aplikacje e-commerce.

Przycisk nie ma tła, jest mniejszy i składa się z prostego słowa. Przycisk, który służy do dokonania zakupu jest większy, składa się z dwóch słów – co więcej jest miejsce na przecinek i wykrzyknik. Button wypełnia tło i klient, który już dawno podjął decyzję o zakupie dosłownie „przeklika” poprzez proces zakupowy bez czytania etykiet.

#2: Przestrzeń zamiast separatorów

Kiedy prezentujemy dane, w minimalnej tabeli lub siatce, kuszącym zabiegiem może być chęć oddzielenia poszczególnych komórek za pomocą separatora lub obramowania. Usuwając te krawędzie i zwiększając przestrzeń negatywną zyskamy ten sam efekt mniejszą ilością detali graficznych co powinno zwiększyć czytelność, estetyczność i – no właśnie – User Experience.

Krawędzie nie rozpraszają a całemu układowi nie brakuje zupełnie niczego, ponieważ, delikatną kreskę zamieniliśmy na lekko większy odstęp.

#3 Cień i glow

Przyszła chwila na garść powierzchowności. Cień nadaje naturalny wygląd przyciskom, a stosowany z umiarem zachęca do interakcji.

Używany obowiązkowo w material design by oddzielić warstwy statyczne od dynamicznych. Usuwanie go z powodów estetycznych może nie być dobrą decyzją pod kątem User Experience.

#4 Nie tylko jedno tło

Kto powiedział, że tło musi być jedno. Jeżeli projekt ma wiele warstw nikt nam nie zabroni zastosować jeszcze jednego stopnia przezroczystości lub jeszcze jednej barwy.

Dzięki tej sztuce UX w prosty sposób nadajemy hierarchię i wprowadzamy porządek nawet w bardzo skomplikowanym interfejsie.

#5 Zamień design w system projektowy

System projektowy to szkielet do budowania interfejsu. To coś więcej niż motyw czy szablon. System proponuje rozwiązania na prawie każdy problem. Zwalnia z konieczności wynajdywania koła na nowo i siłą rzeczy wymusza jednolity wygląd interfejsu i konsekwencję.

Zobacz jak wyglądają systemy projektowe znanych firm i projekty z których możemy śmiało skorzystać: https://designsystemsrepo.com/design-systems/

#6 Ukrywanie złożoności i stosowanie prostoty

Proste i czytelne wezwania do akcji są podstawą ich istnienia. Dodając dodatkowy opis czy zdanie niczego nie wskóramy a tylko zniechęcimy niecierpliwe osoby.

Im dłuższy opis tym mniejsze prawdopodobieństwo, że ktoś go w całości przeczyta. Sukces Twittera jako platformy mikro-blogowej nie było wymyślenie jakieś nowej funkcjonalności, tylko wymuszenie na użytkownikach krótkich postów ograniczonych do kilkudziesięciu znaków.

Zamiast opisywać w zakręcony sposób tego jak coś działa zamieść ilustrację lub animację, która wytłumaczy wszelkie zawiłości niemal w mgnieniu oka.

Kolejnym pomysłem może być uproszczenie menu. Jeżeli ktoś chce dostać się do szczegółów oferty odnajdzie odpowiedni link. Ładowanie dosłownie wszystko do menu głównego nie jest dobrym pomysłem.

#7 Powielanie identycznego CTA

Mnożenie nawet na jednej podstronie tego samego CTA jest charakterystyczną cechą stron sprzedażowych. Można wykorzystać dokładnie ten sam trik na standardowej podstronie.

Przykładowo kiedy otworzysz stronę Google Music:
https://play.google.com/music/listen Słowo zaloguj się pojawi się 3 razy, w menu głównym w pierwszej sekcji i w kolejnej. To samo robi przykładowo Netflix. Zaloguj się, Zacznij teraz, Rozpocznij: https://www.netflix.com/pl/ Trzy przyciski które prowadzą do jednego i tego samego miejsca. Widocznie to działa.

#8 Wykorzystywanie nowych technologii

A przede wszystkim tych, które zostały powołane do życia aby zwiększać jakość User Experience. Czytaj o stronach SPA, aplikacjach PWA czyli progresywnych stronach webowych i stronach AMP, czyli superszybkich stronach, które są wyjątkowo użyteczne na urządzeniach mobilnych.

Podsumowanie

Dzięki sztuczkom i trikom UX poprawimy wygodę i satysfakcję użytkowników wchodzących w interakcje z naszymi produktami cyfrowymi. Zachęcam do obejrzenia podlinkowanych artykułów, w których jest jeszcze więcej inspiracji i pomysłów na udoskonalanie stron i aplikacji internetowych.

Źródła

Oceń artykuł na temat: Triki (sztuczki) poprawiające User Experience
Średnia : 4.6 , Maksymalnie : 5 , Głosów : 19