⚡ Teoria i nauka

Prawa UX

Kluczowe prawa UX z Laws of UX Jona Yablonskiego. Naukowe zasady projektowania lepszych doświadczeń.

Wszystkie zasady

01

Prawo Fittsa Fitts's Law

Czas dotarcia do celu zależy od odległości i wielkości tego celu. Większe i bliższe elementy klikamy szybciej. Dlatego główny CTA powinien być duży i blisko centrum uwagi, a opcje destrukcyjne (usuń, anuluj) powinny być mniejsze i dalej od głównej ścieżki.

Tip: Główny przycisk akcji na stronie powinien mieć minimum 44x44px na mobile i być umieszczony w zasięgu kciuka. Nie chowaj go na dole długiej strony ani nie rób go mniejszego niż przyciski drugorzędne.
02

Prawo Hicka Hick's Law

Czas podjęcia decyzji rośnie logarytmicznie wraz z liczbą i złożonością opcji. Menu z 3 opcjami to szybka decyzja, menu z 20 opcjami to paraliż. Dotyczy to nawigacji, formularzy, filtrów i każdego miejsca, gdzie użytkownik musi wybrać.

Tip: W każdym menu, liście opcji i zestawie filtrów pokaż najpierw najpopularniejsze 3-5 opcji. Resztę schowaj za 'Pokaż wszystkie'. Użytkownik w 80% przypadków wybierze jedną z pierwszych opcji.
03

Peak-End Rule Peak-End Rule

Ludzie oceniają doświadczenie na podstawie dwóch momentów: najintensywniejszego (peak) i ostatniego (end). W interfejsie oznacza to, że nawet jeśli cały proces jest przeciętny, świetny moment w środku i pozytywne zakończenie sprawią, że użytkownik zapamięta całość dobrze.

Tip: Zidentyfikuj moment kulminacyjny w Twoim produkcie (np. pierwszy sukces, odkrycie kluczowej funkcji) i zaprojektuj go wyjątkowo. Zadbaj też o zakończenie: podziękowanie po zakupie, animacja sukcesu po onboardingu.
04

Efekt Zeigarnik Zeigarnik Effect

Niedokończone zadania pamiętamy lepiej niż dokończone. W interfejsie progress bar wypełniony w 80% motywuje do ukończenia silniej niż informacja 'Twój profil jest niekompletny'. Ludzie mają naturalną potrzebę zamykania otwartych pętli.

Tip: W onboardingu i procesach wielokrokowych pokazuj pasek postępu. Zacznij od 10-20% wypełnionego (np. 'Krok 1 z 5 gotowy'), żeby użytkownik poczuł, że już zaczął i chce dokończyć.
05

Goal Gradient Effect Goal Gradient Effect

Im bliżej celu, tym silniejsza motywacja. Klient z kartą lojalnościową '8/10 pieczątek' kupuje częściej niż ten z '2/10'. W interfejsie oznacza to, że progress bar przyspieszający pod koniec (wizualnie) motywuje skuteczniej niż liniowy.

Tip: W programach lojalnościowych i procesach wielokrokowych pokaż użytkownikowi, jak blisko jest celu. Jeśli brakuje mu 1 kroku, wyróżnij to: 'Jeszcze tylko 1 krok i gotowe!' działa silniej niż 'Krok 4 z 5.'
06

Efekt serialnej pozycji Serial Position Effect

Najlepiej zapamiętujemy elementy z początku (efekt pierwszeństwa) i końca (efekt świeżości) listy. Środkowe elementy są najczęściej pomijane. W nawigacji oznacza to, że najważniejsze opcje powinny być na początku i na końcu menu, a nie w środku.

Tip: W dolnej nawigacji mobilnej (tab bar) umieść najważniejszą akcję na skrajnej lewej pozycji (Home) i skrajnej prawej (Profil). Środkowe pozycje są najrzadziej zauważane i zapamiętywane.
07

Prawo Doherty'ego Doherty Threshold

Jeśli system odpowiada w ciągu 400 milisekund, użytkownik postrzega interakcję jako natychmiastową i utrzymuje flow pracy. Powyżej 400ms uwaga się rozprasza, a powyżej 1 sekundy użytkownik zaczyna wątpić, czy system działa.

Tip: Mierz czas odpowiedzi kluczowych akcji (zapis, wyszukiwanie, przejście między ekranami). Jeśli cokolwiek przekracza 400ms, dodaj optymistyczny UI (pokaż wynik natychmiast, a w tle wyślij request) lub skeleton loader.
08

Efekt estetyczności-użyteczności Aesthetic-Usability Effect

Użytkownicy postrzegają estetyczne interfejsy jako łatwiejsze w użyciu, nawet jeśli obiektywnie nie są. Atrakcyjny wizualnie design sprawia, że ludzie są bardziej tolerancyjni wobec drobnych problemów z użytecznością i chętniej próbują różnych ścieżek.

Tip: Zainwestuj w dopracowanie wizualne kluczowych ekranów: landing page, onboarding, checkout. Nie muszą być 'wow', ale muszą być spójne, czytelne i profesjonalne. Użytkownicy wybaczą drobne niedogodności, jeśli produkt dobrze wygląda.

Powiązane kategorie

Chcesz wiedzieć więcej?

Projektuj lepsze interfejsy z pomocą AI

Sprawdź UX Toolkit for Claude →