UX, wireframes i testowanie użytkownika
Od szkicu do przetestowanego rozwiązania — jak projektujesz dla prawdziwych ludzi, a nie tylko dla własnego gustu
Wstęp
Strona internetowa lub aplikacja może wyglądać spektakularnie i całkowicie zawieść, jeśli użytkownik nie może się zorientować. UX — user experience, doświadczenie użytkownika — to dyscyplina, która zapewnia, że rozwiązanie cyfrowe jest zrozumiałe i obsługiwane. W mediach cyfrowych design i psychologia behawioralna się spotykają, a dobre decyzje UX opierają się na obserwacji prawdziwych użytkowników, a nie na twojej intuicji.
Od pomysłu do wireframe
Zanim coś będzie piękne, musi być jasne. Wireframe to uproszczona szkic strony lub ekranu — pola, linie i prosty tekst, bez kolorów lub ostatecznego projektowania. Celem jest zafałdowanie struktury: gdzie siedzi menu, jaka jest główna akcja na stronie, w jakiej kolejności użytkownik napotyka treść. Ponieważ wireframe jest szybki do zrobienia i równie szybki do naprawy, możesz przetestować wiele struktur, zanim spędzisz czas na wizualnym wyrażeniu.
Prototypy lo-fi i hi-fi
- 01Prototyp lo-fi — szorstki, często w skali szarości, skoncentrowany wyłącznie na strukturze i przepływie. Tanie do zmiany.
- 02Prototyp hi-fi — z rzeczywistymi kolorami, czcionkami i obrazami, klikowalny jako gotowe rozwiązanie. Używany do testowania ostatecznego wyglądu.
- 03Klikalny prototyp — kilka ekranów połączonych ze sobą, dzięki czemu osoba testująca może 'używać' rozwiązania, zanim zostanie napisany choćby jeden wiersz kodu.
Testy użytkownika — dlaczego zgadywanie nie wystarczy
Niezależnie od tego, jak doświadczony jesteś, nie możesz zobaczyć własnego rozwiązania oczami nowego użytkownika — już wiesz, jak to działa. Dlatego testy użytkownika są kluczową aktywnością w pracy UX: stawiasz prawdziwą osobę przed prototypem, dajesz mu zadanie i obserwujesz, gdzie się waha, klika źle lub się poddaje. Według badacza użyteczności Jakoba Nielsena (Nielsen Norman Group) testy zaledwie pięciu testów zazwyczaj ujawniają około 85 procent najbardziej widocznych problemów użyteczności w rozwiązaniu — więcej testów daje zmniejszający się zwrot, ponieważ te same problemy się powtarzają.
Metody ujawniania problemów
| Metoda | Co to pokazuje |
|---|---|
| Moderowany test użytkownika | Facylitator obserwuje użytkownika rozwiązującego zadania na żywo i pyta po drodze |
| Bezmierny test zdalny | Użytkownik rozwiązuje zadania samodzielnie poprzez narzędzie testowe, często nagrane na ekranie |
| A/B-test | Dwie wersje strony są pokazywane różnym użytkownikom, aby zobaczyć, która ma lepszą wydajność |
| Sortowanie kart (card sorting) | Użytkownicy sami grupują zawartość i pokazują, jak spodziewają się, że element menu powinien być nazwany i umieszczony |
| Przegląd heurystyczny | Doświadczony UX ocenia rozwiązanie na podstawie znanych zasad użyteczności bez osoby testującej |
Dostępność jest częścią UX
Dobry UX nie może być oddzielony od dostępności. Rozwiązanie, które działa tylko z myszą, wyklucza użytkowników, którzy nawigują za pomocą klawiatury. Rozwiązanie bez tekstu alternatywnego do obrazów wyklucza użytkowników czytników ekranu. Pomyśl o dostępności jako części doświadczenia użytkownika od pierwszego wireframe, a nie jako coś, co się appenduje na końcu.
Od testu do iteracji
Test użytkownika jest wart czegoś tylko wtedy, gdy wyniki są używane. Zbierz obserwacje, priorytet problemy, które napotykają najwięcej użytkowników, i napraw projekt przed ponownym testowaniem. Praca UX to koło, nie linia prosta: projektuj, testuj, poprawiaj, testuj ponownie. To koło, które zmienia teoretycznie dobrą ideę w rozwiązanie, które faktycznie działa dla ludzi, dla których zostało wykonane.
“Nie jesteś swoim użytkownikiem. To, co uważasz za oczywiste, może być niejasne dla kogoś, kto widzi rozwiązanie po raz pierwszy.”
— Rozważania zawodowe na temat testów użytkowników w pracy UX