Zasady projektowania UX: spójność

Najważniejsza zasada UX

Spójność to jedna z najważniejszych zasad w projektowaniu UX. Wszystkie inne elementy – typografia, proporcje, kolory – mogą być bez zarzutu, ale nie będą dobrze spełniały swojej roli, jeśli zabraknie stabilnej podstawy, na której stworzą określony porządek w całym projekcie.

Spójność to również ta zasada, którą projektant może najłatwiej i najszybciej naruszyć. Tymczasem to właśnie ona sprawia, że projekt jest intuicyjny, łatwy w nawigowaniu i w obsłudze.

Najważniejsza zasada UX
Jak projektować dobre UX – spójność

Użyteczność, przyjazność i łatwość w nauczeniu się, jak działa strona lub aplikacja rosną, kiedy podobne elementy wyglądają podobnie i działają w podobny sposób.

Im bardziej spójny jest twój projekt, tym bardziej prawdopodobne, że użytkownicy będą przenosić wcześniej zdobytą wiedzę o jej działaniu na nowe funkcje bez niepotrzebnej frustracji i stresu, że coś nie działa. Dzięki temu mogą się skupić na zadaniu, a nie uczyć się, jak działa interfejs przy każdej zmianie ekranu lub podstrony.

 

Dlaczego warto dbać o spójność w UX

  • Użytkownicy uczą się szybciej jak korzystać z twojego projektu
    Jeśli przyzwyczaisz użytkownika, że przyciski uruchamiające działanie lub przyciski potwierdzeń znajdują się zawsze w tym samym miejscu i są do siebie podobne, kolejne etapy rejestracji czy wykonywania działania będą bardziej przyjazne i intuicyjne.

 

  • Spójność eliminuje niepewność
    Kiedy użytkownik nie jest pewny, co zrobić dalej albo dlaczego aplikacja nie działa tak, jak tego oczekuje, kolejnym krokiem jest frustracja. Nie chcesz, żeby odbiorca tak się czuł, prawda?

 

  • Spójność oszczędza czas i pieniądze
    Design, który jest spójny, najczęściej powstaje z elementów zdefiniowanych i zaprojektowanych wcześniej. To sprawia, że projektant i jego zleceniodawca mogą podejmować decyzje szybciej, bez marnowania czasu na spory i dyskusje. Sam proces powstawania designu również jest szybszy i tańszy.

 

Cztery typy spójności

Spójność wizualna

Podobne elementy – na przykład przyciski – są zaprojektowane w podobny sposób i zachowują podobne cechy (kolor, kształt, proporcje, położenie). To sprawia, że łatwiej jest zrozumieć działania aplikacji lub strony. Rozmiar fontu, przycisków, oznakowań powinien korespondować ze sobą na wszystkich poziomach działania produktu.

 

Spójność funkcjonalna

Podobne komendy i czynności działające w taki sam sposób podnoszą spójność funkcjonalną. Czerwony x zawsze przerywa działanie, strzałka w tył cofa do poprzedniego kroku – taka przewidywalność sprawia, że rośnie poczucie pewności i bezpieczeństwa w czasie użytkowania.

 

Spójność wewnętrzna

To połączenie dwóch pierwszych opisanych powyżej. Te same rozwiązania stosowane w całym projekcie sprawiają, że staje się on bardziej użyteczny, przyjazny i łatwiejszy do nauczenia się obsługi. Dzięki temu nawet jeśli wprowadzisz nowe funkcjonalności zaprojektowane z zachowaniem zasad znanych ze „starej” wersji, będą one łatwe do rozpoznania i przyswojenia przez użytkowników.

 

Spójność zewnętrzna

Skąd wiesz, że aplikacja mobilna, broszura reklamowa i strona www jednej firmy pochodzą właśnie od niej, nawet jeśli nie widzisz logo? W ten sposób działa spójność zewnętrzna: jeśli te same zasady działania i elementy charakterystyczne są obecne w wielu mediach na różnych platformach, zwiększa się nie tylko poziom UX, ale również samej identyfikacji wizualnej marki.

Jeśli szukasz przykładu, pomyśl o produktach Adobe. Jeśli obsługujesz Photoshop, z dużym prawdopodobieństwem nie przerazi cię interfejs Illustratora i będziesz wiedział, gdzie szukać podobnych funkcji.

 

Jak zachować spójność w projektach?

Podstawą spójności jest to, aby powtarzać układ tych samych elementów lub czynności wiele razy i w różnych punktach produktu, a przy tym zawsze dać użytkownikowi możliwość ukończenia zadania.

 

Warstwa wizualna

Typografia, kolory, rozmiary, układ, siatka – wszystko to powinno być zdefiniowane przed rozpoczęciem projektowania, a potem używane konsekwentnie w całym projekcie.

Zdefiniuj wyraźną hierarchię wizualną: najważniejsze rzeczy powinny być większe od tych mniej istotnych. Trzymaj się jednej palety kolorów w całym projekcie. Odległości i marginesy powinny być takie same w całym projekcie (na przykład na kolejnych podstronach). Elementy z kolei powinny być mocno osadzone na siatce, która pozwoli na ułożenie ich estetyczny sposób.

 

Tone of voice

Tone of voice, czyli cały zespół komunikatów niewerbalnych, który kreuje wrażenie, emocje i skojarzenia, jakie chcesz uzyskać. Nietrudno zrozumieć, dlaczego ma on wielki wpływ na to, jak twój użytkownik będzie odbierał cały produkt.

Jeśli na przykład chcesz, żeby twój projekt był zabawny i utrzymany w swobodnym stylu, stosuj się do tego konsekwentnie, nawet w wiadomościach o błędach i pomyłkach. Zwróć uwagę na tone of voice InPost: cała ich komunikacja, od tutorialu i explainera na stronie aż po maile wysyłane do odbiorców paczek i komunikaty na paczkomatach jest utrzymany w tym samym czytelnym, wyrazistym stylu.

 

Używaj znajomych wzorów

Twoi użytkownicy poruszają się w świecie cyfrowym od jakiegoś czasu i pewne rozwiązania są już dla nich oczywiste. Nie warto wyważać otwartych drzwi i forsować nowe rozwiązania, skoro stare są intuicyjne. Lepiej jest wykorzystać je i wprowadzać do swoich projektów. W ten sposób użytkownik nie będzie musiał zastanawiać się, jak używać danej funkcji.

 

Naginaj spójność, ale jej nie łam

Może ci się wydawać, że spójność jest nudna i wyklucza innowacje, więc nie warto trzymać się jej zbyt ściśle. Łamanie zasad nie jest złe, ale dopiero, kiedy dobrze je poznasz i wiesz, jaki efekt chcesz osiągnąć przez pomijanie reguł.

W przypadku spójności lepiej jest jednak naginać zasady, niż je łamać – to drugie najczęściej kończy się psuciem całego UX, a dla projektanta oznacza to także dodatkowe spotkania i spory nad kolorem tego konkretnego buttonu lub krojem pisma do tego konkretnego wiersza.

Decyzje, które podejmujesz, powinny pochodzić ze zrozumienia użytkowników i ich potrzeb. Jeśli chcesz wprowadzić zmiany w projekcie, upewnij się, że odpowiadają temu, jak użytkownicy korzystają z produktu.

 

Zasady projektowania: spójność – podsumowanie

Dopasuj swój projekt do potrzeb i oczekiwań użytkowników. Staraj się przyjmować ich punkt widzenia i szukać usprawnień tam, gdzie są potrzebne, a nie tam, gdzie podpowiada ci je artystyczna ambicja.

Spójność połączona z takimi podstawami projektowania jak hierarchia wizualna, typografia, określone schematy i „oczywiste” umiejscowienia funkcji czy przycisków daje najlepsze efekty. Pamiętaj: mała zmiana jest dobra, ale duża zmiana niekoniecznie będzie najlepsza.

Skomentuj

avatar