różne style przycisków w tym samym systemie

Różne style przycisków w tym samym systemie osłabiają spójność wizualną interfejsu.

Dlaczego przycisk jest elementem, na którym najszybciej widać bałagan

Przycisk niesie kilka informacji naraz: że w to miejsce można kliknąć, jak ważne jest działanie i czy jest ono bezpieczne. Gdy jeden ekran systemu ma przyciski zaokrąglone i wypełnione kolorem, a drugi prostokątne z samą obwódką, użytkownik za każdym razem musi na nowo rozszyfrowywać interfejs. Efekt jest mierzalny: rośnie czas wykonania zadania i liczba kliknięć w niewłaściwy element. Najbardziej kosztowna odmiana tego problemu to niespójność w oknach potwierdzenia, gdzie raz po lewej stronie stoi działanie akceptujące, a raz odrzucające — użytkownik działający z pamięci mięśniowej kasuje dane, chcąc je zapisać.

Skąd bierze się rozjazd stylów

W praktyce przyczyną rzadko bywa niedbałość projektanta. Częściej system rósł etapami: część ekranów pochodzi z pierwotnej wersji aplikacji, część dopisano po kilku latach inną biblioteką komponentów, a jeszcze inne moduły dołożył zewnętrzny wykonawca. Do tego dochodzi mieszanie stylów wbudowanych w system operacyjny ze stylami z arkusza CSS, wymuszanie wyglądu deklaracjami z dopiskiem important, kopiowanie fragmentów kodu z dokumentacji różnych bibliotek oraz wersjonowanie: aktualizacja biblioteki interfejsu zmienia domyślny wygląd komponentów tylko tam, gdzie nie nadpisano ich lokalnie. W aplikacjach biznesowych osobnym źródłem są raporty i wydruki generowane przez zupełnie inny moduł.

Koszty ukryte poza estetyką

Niespójne przyciski utrudniają nie tylko korzystanie, lecz także utrzymanie. Każdy wariant to osobny zestaw stanów do zaprogramowania: najechanie kursorem, wciśnięcie, zaznaczenie klawiszem tabulacji, stan nieaktywny, stan ładowania. Im więcej wariantów, tym większa szansa, że któryś nie ma widocznego obramowania po zaznaczeniu z klawiatury, co odcina od obsługi osoby korzystające wyłącznie z klawiatury. Podobnie z kontrastem — przycisk zaprojektowany jako jasnoszary tekst na białym tle nie spełnia progu czytelności i staje się nieczytelny na matowej matrycy w jasnym pomieszczeniu. Warto też pamiętać o rozmiarze pola dotykowego na ekranach dotykowych oraz o tym, że oznaczenie stanu wyłącznie kolorem gubi się przy zaburzeniach rozpoznawania barw.

Porządkowanie interfejsu w firmowych aplikacjach

Spotykamy ten problem najczęściej we wdrożeniach oprogramowania handlowego, gdzie do standardowego programu dołożono własne formularze i raporty. Ujednolicamy wtedy szablony wydruków i układ okien dodatkowych tak, aby operator nie musiał się przestawiać między modułami, a przy okazji sprawdzamy skalowanie interfejsu na ekranach o wysokiej rozdzielczości — to tam najczęściej wychodzi, że część okien została zaprojektowana pod stałą liczbę pikseli i rozjeżdża się na nowszym laptopie. Pracujemy z klientami indywidualnymi i firmami przez siedem dni w tygodniu.