Zbliżenie na szachownicę z ustawionymi szachami. Napis: Heurystyki Nielsena, czyli 10 zasad projektowania przyjaznego dla użytkowników

Heurystyki Nielsena, czyli 10 zasad projektowania przyjaznego dla użytkowników

Choć heurystyki Nielsena powstały w latach 90., to wciąż sprawdzają się jako wytyczne do projektowania stron i aplikacji przyjaznych użytkownikowi. Nie są sztywnymi regułami. Raczej wskazówkami, które warto wykorzystać, jeśli chcemy, aby interfejs zachęcał odbiorcę do interakcji i przebywania w naszym serwisie.

Czym są heurystyki i dlaczego warto brać je pod uwagę podczas projektowania?

Pojęcie „heurystyki” wywodzi się z nauk społecznych, głównie z psychologii. Oznacza prawidłowości w sposobie myślenia, kojarzenia i łączenia faktów, które można określić jako automatyzmy czy drogi na skróty. W świecie marketingu i UX najbardziej znanymi mechanizmami tego typu są heurystyki Nielsena. To 10 zasad opracowanych przez ojca user experience, Jakoba Nielsena, w latach 90. Badacz stworzył je jako narzędzie do oceny użyteczności. Służą też jako wskazówki, jak projektować interfejsy stron internetowych tak, by były przyjazne i czytelne dla użytkowników.

Heurystyki Nielsena opierają się na wiedzy o tym, jak użytkownicy myślą i wchodzą w interakcje z przekazami, komunikatami, technologią. Dzięki podążaniu za taką naturalną „konsumpcją” treści, strony czy aplikacje lepiej odpowiadają na potrzeby odbiorców, co zwiększa ich zainteresowanie i zaangażowanie, a w rezultacie – konwersję. Pozwalają też wyeliminować błędy, które w osiągnięciu tego celu przeszkadzają (np. powodują wyjście z witryny czy porzucenie koszyka zakupowego).

Heurystyki Nielsena – jak brzmi 10 zasad przyjaznego projektowania?

Zasady, o których mowa, to:

1. Pokazuj status sytemu

Użytkownicy muszą wiedzieć, co dzieje się na ekranie czy w systemie. Stosuj przejrzyste i zrozumiałe komunikaty. Informuj na przykład o tym, na jakim etapie składania zamówienia znajduje się klient. Dawaj znać, że wprowadzone dane są prawidłowe lub nieprawidłowe (oraz ewentualnie co i jak należy poprawić). Ale też pokazuj (np. za pomocą animujących się symboli), że jakiś proces (m.in. przekazywanie płatności, ładowanie materiałów) trwa. To dobry sposób, żeby uniknąć ewentualnej frustracji odbiorcy.

2. Zachowaj zgodność między systemem a rzeczywistością

W tej zasadzie chodzi o to, żeby stosować język i symbole, które użytkownik już zna i kojarzy, np. z życia codziennego. Ważne, żeby unikać w komunikatach słownictwa technicznego i branżowego. Nie pisz np. o „wystąpieniu błędu 12345”. Użytkownikowi i tak to prawdopodobnie nic nie powie. Spójne z tą heurystyką jest m.in. wykorzystywanie słowa „koszyk” do określenia miejsca, w którym zapisują się produkty wybrane do zakupu na stronie internetowej. Dzięki temu poruszanie się po stronie czy aplikacji jest bardziej intuicyjne i sprawniejsze.

3. Daj użytkownikom pełną kontrolę

To do nich należy decyzja, jakie działanie i interakcje chcą podjąć. Strona czy aplikacja nie może niczego wymuszać, powinna też dawać możliwość wyjścia, anulowania procesu, zamknięcia jakiegoś okna czy cofnięcia się do poprzedniego kroku w formularzu.
Przy okazji tego punktu warto też wspomnieć o konieczności potwierdzania krytycznych działań. Chodzi o sytuację, w której użytkownik chce zrobić coś o dużym znaczeniu, np. usunąć wszystkie dane czy wręcz całe swoje konto. Czasem są to akcje przypadkowe (np. błędne kliknięcie ikonki). Aby tego uniknąć, należy pytać, czy użytkownik na pewno chce to zrobić. Dobrą praktyką jest też umożliwienie odwołania decyzji np. przez 30 dni.

4. Trzymaj się standardów i zachowaj spójność

Nielsen wyróżnił dwa rodzaje standaryzacji i spójności. Pierwszy z nich to zgodność zewnętrzna. Chodzi w niej o podążanie za ogólnie przyjętymi w UX/UI zasadami. Dotyczą one elementów, które w każdym serwisie wyglądają lub funkcjonują w podobny sposób. W myśl tej reguły wpisuje się wykorzystywanie powszechnie już znanych symboli. Osoby poruszające się po internecie wiedzą np., że ikonka z trzema poziomymi liniami oznacza menu. Nie ma potrzeby wymyślania koła na nowo.

Drugim rodzajem spójności jest ta wewnętrzna. Jeśli stosujesz jakiś element, który np. powoduje konkretną akcję, to w całym serwisie powinien mieć on taką samą funkcję i wyglądać tak samo. Ustandaryzowane powinny być też np. fonty, kolorystyka, style przycisków (łącznie z tym, jak wyglądają np. po najechaniu kursorem), sposób wyświetlania komunikatów.

5. Zapobiegaj błędom

Ta zasada trochę wiąże się z heurystyką nr 1. W interfejsie warto przewidzieć jasne i czytelne komunikaty, jakich danych i jakiego działania oczekujemy od użytkownika. Na przykład jeśli do zapisania się na newsletter niezbędne jest zaznaczenie zgody na przetwarzanie danych, napisz o tym wprost.
Elementem najbardziej wrażliwym na tę regułę są formularze. Dobrym sposobem na zapobieganie błędom w tym przypadku jest uwzględnienie przy polach opisów, które podpowiedzą, jakie dane i w jaki sposób należy wprowadzić (np. „wpisz numer telefonu w formacie XXX-XXX-XXX”). Warto też wykorzystać techniczne możliwości interfejsu. W powyższym przykładzie będzie to automatyczne ustawienie pola w formularzu tak, żeby wprowadzany numer wyświetlał się w pożądanym formacie. Czyli po wpisaniu trzech cyfr przez użytkownika, łącznik zostanie dodany domyślnie przez system.

6. Pokaż zamiast zmuszać do pamiętania

To jedna z kluczowych reguł psychologii i działania naszych umysłów. Rozpoznawanie jest łatwiejsze niż zapamiętywanie i odtwarzanie. Najważniejsze informacje powinny być dostępne na wyciągnięcie rę… myszki. Tam, gdzie to możliwe i zasadne, warto wprowadzić podpowiedzi, odnośniki do pomocnych podstron. A nawet „sugestie” zakupowe w postaci sekcji „najpopularniejsze produkty” w sklepie internetowym. Jeśli jakieś komunikaty mogą być przydatne użytkownikom np. na kolejnych podstronach, daj możliwość skopiowania ich. Przykładem jest kod rabatowy, o którym marka pisze na stronie głównej, a który trzeba wprowadzić podczas zakupu.

Ta heurystyka dotyczy też zapamiętywania informacji przez system. Wyobraźmy sobie sytuację, w której użytkownik posiada konto w jakimś sklepie internetowym. Regularnie zamawia w nim różne produkty i za każdym razem musi ręcznie wprowadzać swój adres… Warto też przemyśleć strukturę formularza i w pewnym stopniu go zautomatyzować. Możesz na przykład część z adresem rozpocząć od pola z kodem pocztowym. Po wprowadzeniu go przez użytkownika, system sam powinien rozpoznać i wpisać domyślnie miasto.

7. Zadbaj o elastyczność i efektywność

System powinien podążać za użytkownikiem i przewidywać jego działania oraz potrzeby. Chodzi m.in. o wskazówki i podpowiedzi, ale też sekcję z najczęściej zadawanymi pytaniami (FAQ) czy łatwy dostęp do wsparcia/kontaktu. Z Twojej strony czy aplikacji mogą korzystać różni odbiorcy, o różnym stopniu zaawansowania w poruszaniu się po świecie online czy z różną znajomością branży, oferty. Interfejs powinien być zaprojektowany tak, aby każda z tych osób mogła się w nim odnaleźć. Na przykład warto przewidzieć dodatkowe wskazówki (otwierane w dymkach) dla osób, które ich potrzebują. Lub dwie opcje wyświetlania menu: podstawową oraz zaawansowaną, w której dostępne będą dodatkowe narzędzia czy funkcjonalności dla bardziej doświadczonych użytkowników.

8. Postaw na estetykę i umiar

Interfejs powinien być przejrzysty i nie przytłaczać. Pozbycie się zbędnych elementów, intuicyjne ułożenie elementów i treści (np. zgodnie z zasadą AIDA) zwiększa funkcjonalność i ułatwia użytkownikom poruszanie się po stronie czy aplikacji.

9. Zapewnij skuteczną obsługę błędów

Ta heurystyka jest uzupełnieniem tej spod numeru 5. Pomimo zapobiegania błędom zdarza się, że one występują. Należy przygotować scenariusz na taki wypadek. Nie wystarczy informacja o tym, że błąd się pojawił. Trzeba też jasno napisać, dlaczego tak się stało i jak to naprawić. Dzięki temu można uniknąć frustracji użytkownika i marnowania czasu na próby domyślenia się, co poszło nie tak. Jeśli przyczyna błędów leży po stronie witryny, komunikuj o tym. Najlepiej zanim jeszcze użytkownik podejmie jakieś działanie. Na przykład jeśli zakupy w Twoim sklepie są chwilowo niemożliwe, bo system się wykrzaczył, dodaj o tym informację na samej górze sklepu.

10. Zadbaj o pomoc i dokumentację

Użytkownicy muszą mieć możliwość szybkiego dostępu do wszelkich pomocnych informacji – samouczków, FAQ, podstrony z różnymi opcjami kontaktu, poradników, tutoriali, regulaminu strony. Jeśli to możliwe, w interfejsie warto uwzględnić opcję wyszukiwania treści na stronie.

Powyższe heurystyki nie są sztywnym zestawem reguł. Raczej to wskazówki, które warto wdrożyć, ale przy uwzględnieniu dodatkowych czynników i tego, w jaki sposób w praktyce będzie wykorzystywana Twoja witryna czy aplikacja. Jednym z takich aspektów może być specyfika grupy docelowej. Na przykład jeśli tworzysz serwis, z którego korzystają jedynie profesjonaliści obeznani z tematem, być może nie ma potrzeby dodawania wielu samouczków czy tutoriali. Kluczowe jest przetestowanie interfejsu z realnymi użytkownikami, żeby jak najlepiej odpowiedzieć na ich potrzeby. Warto też dodać, że choć heurystyki Nielsena powstały jako zasady dotyczące projektowania stron i aplikacji, to są na tyle uniwersalne, że niektóre z nich można też mieć na uwadze przy tworzeniu innych przekazów, np. materiałów reklamowych, newsletterów czy wszelkiej komunikacji marketingowej.