Ostatnia aktualizacja 6 maja, 2022
UI Design, czyli projektowanie interfejsów, jest jedną z podstaw tworzenia użytecznych serwisów. UI łączy się nierozerwalnie z UX, czyli doświadczeniem użytkownika. Jakich zasad powinniśmy się trzymać podczas tworzenia projektów?
Ostatnia aktualizacja: 06.05.2022. Dodaliśmy informację o tym, co się składa na UI design.
Sprawdź: Backend Developer
Czym jest UI Design?
Występowanie interfejsów jest powszechne w każdej sferze życia. UI Design to nie tylko tworzenie interfejsów stron internetowych czy aplikacji w telefonie. To też projektowanie wszelkich paneli ekranowych do innych urządzeń elektronicznych, z których użytkownik może intuicyjnie korzystać.
User interface i user experience to duet, dzięki któremu przeciętny użytkownik nie musi się znać na technicznych aspektach działania sprzętu czy programu. Umowne sposoby korzystania „prowadzą za rękę” przez funkcje interfejsów, ponieważ podlegają one konkretnym zasadom projektowania interakcji.
Dobry projekt UI powinien być zrozumiały, estetyczny i funkcjonalny.
Co się składa na UI design?
UI designer w swoim projekcie musi uwzględnić i zrównoważyć estetykę oraz funkcjonalność finalnego produktu. Projektuje więc nie tylko hierarchię elementów, układ treści czy styl przycisków i formularzy, ale też decyduje o kolorystyce, rodzaju i wielkości fontów oraz aspektach graficznych.
Pomocnym narzędziem w projektowaniu UI jest moodboard. Dzięki takiej tablicy w jednym miejscu można zebrać inspiracje kolorystyczne, pasujące kroje pisma, a także zdjęcia i różne motywy, jakie posłużą do zaprojektowania wizualnej części. Moodboard można tworzyć fizycznie, jednak znacznie popularniejsze są obecnie aplikacje i wtyczki, np. Pinterest, MURAL lub wbudowane funkcje w programach do projektowania.
UI designer bazuje na makietach LoFi, które otrzymuje od UX designera i jego zadaniem jest nadać ostateczny kształt graficzny projektowanym stronom lub aplikacjom. Zdarza się jednak, że UI i UX designer to jedna i ta sama osoba.
Praca UI designera wymaga ciągłego kontaktu z innymi osobami, więc w czasie tworzenia projektu na bieżąco omawia zmiany nie tylko z szefem, ale też z klientem. W takiej sytuacji konieczne są wysoko rozwinięte kompetencje miękkie, szczególnie komunikacja i umiejętność rozwiązywania problemów.
Zobacz: inStreamly
UI Design – wytyczne projektowania
Aby zachować standardy funkcjonalności oraz intuicyjność korzystania z interfejsów, powstało 10 heurystyk użyteczności UI, których autorami są Jakob Nielsen i Rolf Molich. Powstały one na bazie wcześniejszych 8 zasad Bena Schneidermana.
1. Widoczność statusu systemu
Systemy powinny sygnalizować zmianę poprzez informację zwrotną dla użytkownika. Przykładem widoczności statusu może być zmiana koloru przycisku użytego w interfejsie.
2. Dopasowanie systemu do świata rzeczywistego
Używaj jasnego i zrozumiałego dla użytkowników języka. Stosuj oczywistą dla wszystkich symbolikę, która odnosi się do świata rzeczywistego i przyjętych norm. Na przykład ikonka hamburgera (trzy poziome paski w górnym rogu ekranu) oznaczająca menu w mobilnej wersji strony lub aplikacji.
3. Kontrola i swoboda użytkownika
Pozostaw użytkownikowi możliwość swobodnych ruchów. Użytkownik powinien móc cofnąć się do poprzednich kroków lub ponowić czynności.
4. Zachowanie spójności i standardów
Aby zachować użyteczność, stosuj standardy i spójność projektowania. Użytkownik nie powinien się domyślać.
5. Zapobieganie błędom
Zadbaj o ograniczenie błędów w systemie oraz ich odpowiednie oznaczenie, aby użytkownik wiedział, gdzie szukać rozwiązania.
6. Rozpoznawanie zamiast przypominania
Ogranicz liczbę informacji konieczną do zapamiętania. Wprowadź okna pomocy i nie przesadzaj z samouczkami.
7. Elastyczność i wydajność użytkowania
Daj użytkownikowi możliwość personalizacji funkcji za pomocą skrótów lub gestów.
8. Estetyka i minimalizm
Mniej znaczy więcej. Zachowaj prostotę treści i wyglądu, jednocześnie dbając o estetykę i uporządkowanie.
9. Pomoc użytkownikowi w diagnozowaniu problemów
Zadbaj o wyróżnienie komunikatów o błędach. Komunikuj o nich w prostym języku i zawrzyj podstawowe podpowiedzi możliwych rozwiązań.
10. Pomoc i dokumentacja
Dokumentacja powinna być łatwa do zrozumienia, dostępna i przedstawiona w odpowiednim kontekście. W założeniu użytkownik powinien móc poruszać się po systemie bez niej, ale w ostateczności musi mieć możliwość szybkiego znalezienia odpowiedzi na możliwe problemy.
