Featured
Tag
UX/UI Design
|
2023-11-16

10 heurystyk Nielsena, czyli ponadczasowe zasady UX

Czy w świecie UX istnieją ponadczasowe zasady, których każdorazowo należy się trzymać, aby osiągnąć zadowalający rezultat?

I tak, i nie. Odpowiedź nie jest jednoznaczna. Warto jednak wspomnieć, że istnieje swoisty dekalog, który dla wielu UX designerów jest czymś w rodzaju checklisty pozwalającej ocenić stopień użyteczności aplikacji lub strony internetowej. Ten dekalog to 10 heurystyk użyteczności Nielsena – Molicha (10 heurystyk Nielsena).

Odpowiadając na pytanie czym są heurystyki użyteczności trzeba cofnąć się aż do roku 1990, kiedy panowie Jakob Nielsen i Ralf Molich przedstawili zbiór 10-ciu zasad interakcji pomiędzy człowiekiem i maszyną. Nielsen nie jest postacią tak znaną jak celebryci świata IT tacy jak Gates, Jobs czy Ellison, ale wpływ jaki wywarły jego heurystyki na podejście do tworzenia aplikacji oraz stron internetowych jest nieoceniony. Sam Nielsen to człowiek pełen kontrowersji, ponieważ z jednej strony posiadający bogate doświadczenie (pracował m.in. dla IBM) i stopień doktora w naukach informatycznych zdobyty w Duńskim Uniwersytecie Technicznym, a z drugiej będący zatwardziałym informatycznym konserwatystą i autorem wielu dyskusyjnych wypowiedzi. Krótko podsumowując – już 32 lata temu zostały stworzone ogólne zasady pozwalające ocenić użyteczność opracowywanych produktów.

10 heurystyk Nielsena

1. Pokazuj status systemu (Visibility of system status)

System powinien zawsze informować użytkowników, co dzieje się w danej chwili. W każdym momencie przeprowadzania jakiejkolwiek operacji użytkownik powinien mieć precyzyjną informację, jaki jest jej status. Dobrymi przykładami są paski postępu, wyróżnienia w postaci zmian kolorów przycisków lub podświetleń. Innym dobrym przykładem jest wizualna prezentacja dostępności towarów w sklepie internetowy lub dostępności miejsc w systemie rezerwacji biletów.

2. Zachowaj zgodność pomiędzy systemem a rzeczywistością (Match between system and the real world)

System powinien mówić językiem użytkownika – znanymi mu słowami, pojęciami i wyrażeniami. Należy unikać niezrozumiałych symboli, skomplikowanych fraz i żargonu zrozumiałego tylko dla osób wchodzących bardzo głęboko w aspekty techniczne danej technologii. Również wszystkie ikony i uporządkowanie interfejsu powinny nawiązywać do ogólnie przyjętych standardów – przykładami są przycisk play i stop w odtwarzaczach muzyki lub ikona kosza na śmieci do usuwania obiektów.

3. Zapewnij użytkownikowi kontrolę i swobodę (User control and freedom)

Użytkownicy często wykonują pewne czynności omyłkowo. Potrzebują wtedy czegoś w rodzaju „wyjścia ewakuacyjnego” celem cofnięcia się do poprzedniego etapu operacji, dokonania korekty, czy po prostu zamknięcia jakiegoś irytującego pop-upa. Niekiedy wystarczą odpowiednio umieszczona ikona „X” lub widoczny przycisku „anuluj”. Innym razem rozwiązaniem problemu „ograniczonej swobody” jest możliwość cofnięcia się w formularzu o kilka kroków wstecz w celu korekty jednej z uzupełnionych informacji bez konieczności rozpoczynania całego procesu od początku.

4. Zachowaj spójność i standardy (Consistency and standards)

Spójność przede wszystkim! Użytkownicy nie powinni musieć zastanawiać się, czy różne słowa i działania oznaczają to samo i prowadzą do tego samego celu. Doświadczenie mówi nam, że ikona wózka sklepowego wskaże produkty, które chcemy kupić, lupa pozwoli wyszukać potrzebne informacje, a niebieski podkreślony tekst możemy kliknąć.

Nielsen podzielił spójność na dwa rodzaje: wewnętrzną oraz zewnętrzną. Spójność wewnętrzna odnosi się do spójności w obrębie produktu lub całej rodziny produktów. Chodzi o trzymanie się jednolitego designu – zastosowanie jednolitych czcionek, kolorów, układów stron itp. Dobrym przykładem spójności wewnętrznej jest Office’owa wstążka – kilka produktów z logo MS a jednak czcionkę zmienimy w każdym z nich w niemal identyczny sposób.

Spójność zewnętrzna odnosi się do ogółu branżowych standardów. Użytkownicy korzystający z konkurencyjnych produktów będą chcieli przenieść swoje przyzwyczajenia również na nasz produkt. Przykłady? Menu umieszczone w tym samym miejscu na stronie, duży i wyraźny pasek wyszukiwania, logotyp umieszczony w lewym górnym rogu.

5. Zapobiegaj błędom (Error prevention)

Komunikaty o występujących błędach są ważne, ale rozwiązaniem lepszym jest projekt, który zapobiega występowaniu błędów. Można wykorzystać rozmaite narzędzia i techniki, ale główna zasada to: wyeliminuj w pierwszej kolejności kosztowne błędy, dopiero potem zajmij się drobnostkami. Dobrym przykładem zapobiegania błędom jest konieczność potwierdzania każdej operacji – eliminuje to wpływ przypadkowych kliknięć w całym procesie. Kolejnym rozwiązaniem są podpowiedzi w formularzach w jaki sposób należy wprowadzić dane np. wzrost w centymetrach lub numer telefonu bez spacji.

6. Pozwól rozpoznawać zamiast zmuszać do przypominania (Recognition rather than recall)

Odciążaj pamięć użytkownika wyświetlając obiekty, działania i opcje. Wszystkie niezbędne informacje powinny być widoczne na ekranie. Użytkownik nie powinien być zmuszony pamiętać przez cały proces, co robił na jego początku. Dobrymi przykładami odciążania pamięci użytkownika są podpowiedzi haseł wyszukiwania po wpisaniu tekstu oraz lista ostatnio przeglądanych produktów.

7. Zapewnij elastyczność i efektywność (Flexibility and efficiency of use)

Różnego rodzaju skróty oraz opcje dodane do interfejsu, które przyspieszają wykonywanie czynności zarówno przez początkujących jak i doświadczonych użytkowników. Przykładami są checkboxy „zaznacz wszystko”, szybkie linki, zapamiętywanie filtrów lub możliwość dodawania produktów do listy ulubionych. Personalizacja i możliwość dostosowania aplikacji do preferencji użytkownika to w zasadzie standard, ponieważ nic nie irytuje tak jak konieczność wykonywania każdorazowo powtarzalnych czynności jak ręczne ustawiania filtrów czy wyszukiwanie produktów, które zamawialiśmy już tysiąc razy.

8. Zachowaj estetyczny i minimalistyczny design (Aesthetic and minimalist design)

Wielu uważa, że właśnie ta heurystyka idealnie oddaje ducha Nielsena. W imię zasady „mniej znaczy więcej” każdy element nie powinien zawierać informacji niepotrzebnych lub rozpraszających uwagę. Każda informacja „dodatkowa” zmniejsza widoczność tej „podstawowej” – dlatego komunikaty powinny być zwięzłe, a każda informacja służyć konkretnemu celowi. Minimalizm ma zapewnić czytelność i przejrzystość – użyteczność to priorytet, estetyka nie może jej ograniczać. Najlepszymi przykładami są chyba proste i czytelne formularze, z odpowiednio dobraną, stonowaną paletą kolorystyczną, uzupełnione jedynie minimalistycznymi symbolami i ikonami.

9. Pomóż użytkownikom rozpoznawać, diagnozować i usuwać błędy (Help users recognize, diagnose, and recover from errors)

Krótko mówiąc chodzi o obsługę błędów. Komunikaty o błędach powinny być wyrażone prostym językiem (najlepiej dostosowanym do użytkownika), precyzyjnie określać problem i wskazywać rozwiązanie. Zdawkowe „wystąpił błąd”, „proces nie powiódł się” czy „błąd B0110” to zdecydowanie za mało i nie to, czego oczekuje użytkownik. Warto zadbać o odpowiednią oprawę komunikatu o błędzie – czerwona ramka, czerwona czcionka, czy ikona wykrzyknika w komunikacie zdecydowanie sugerują, że coś poszło nie tak. Modelowymi przykładami są komunikaty o zajętej już nazwie użytkownika wraz z podpowiedzą sugerowanej nazwy. Innym przykładem może być wyszukiwarka korygująca błąd ortograficzny we wpisanym przez użytkownika zapytaniu.

10. Zadbaj o pomoc i dokumentację (Help and documentation)

Nawet jeżeli interfejs nie wymaga rozbudowanej instrukcji, to i tak użytkownik powinien mieć zapewniony dostęp do dokumentacji oraz pomocy. Niezbędne informacje powinny być łatwe do wyszukania oraz zawierać listę kroków, które należy wykonać w określonym przypadku. W teorii użyteczny produkt powinien być wystarczająco intuicyjny, aby użytkownik nie musiał studiować samouczków, niestety nie za każdym razem jest to możliwe do osiągnięcia. Sekcja „pomocy”, FAQ, ewentualnie najczęściej występujące problemy, to przykładowe sposoby wdrożenia tej heurystyki.

Podsumowanie

10 heurystyk Nielsena nie stanowi kompendium wiedzy w zakresie użyteczności produktów, ale jest dobrym wprowadzeniem i punktem wyjściowym do testów użyteczności. Każdy zajmujący się User Experience powinien potraktować heurystyki jako listę kontrolną, która jest absolutnym minimum. Model opracowany przez Nielsena pozwala zidentyfikować zdecydowaną większość problemów w stosunkowo prosty sposób i stanowi dobrą bazę do budowania własnych dobrych praktyk.

Piotr Trzaskowski
UX/UI MANAGER / CEO - UX-MAN

Podobne wpisy

Wszystkie wpisy

Zapytaj o projekt Aplikacji lub Strony Internetowej

Zapytaj o usługi UX/UI dla siebie

Dziekujemy za wiadomość.
Odniesiemy się do niej w przeciągu najbliższej doby.
Coś poszło nie tak. Spróbuj wysłać wiadomość jeszcze raz.