UX i UI design to podobne pojęcia, które wspólnie składają się na wrażenia użytkowania strony. Jednak UX i UI nie jest tożsame. To dwa główne puzzle układanki, jaką jest strona internetowa firmy. Przyjrzyjmy się bliżej obu pojęciom. Jakie są różnice między UX i UI i czy oba są konieczne?
Czy zdarzyło ci się kiedyś wejść na stronę internetową, z której szybko się ewakuowałeś? Zastanów się, co cię do tego skłoniło. Być może nie mogłeś w szybkim tempie znaleźć interesujących cię informacji. Może strona za długo się ładowała albo po prostu odrzucił cię sam jej wygląd? To nie takie rzadkie. Użytkownicy rezygnują z poruszania się po stronach trudnych w obsłudze, które nie odpowiadają na ich potrzeby i nie współgrają z ich pamięcią wzrokową, a nawet mięśniową. Nie bez powodu większość stron ma zbliżoną strukturę. Wiemy, gdzie szukać menu i że kliknięcie w logo przeniesie nas na stronę główną. To są właśnie detale, które nie wymuszają na nas nauki nowych rzeczy i sprawiają, że strona jest dla nas intuicyjna. Właściciele witryn i aplikacji, którzy ignorują ten fakt, mogą marnować potencjał swojego biznesu. Czemu? O tym poniżej.
Spis treści
UX i UI design – co to?
UX i UI to określenia odnoszące się do budowania stron internetowych. Celem zarówno UX, jak i UI jest stworzenie takiej strony, czy aplikacji mobilnej, by użytkownik czuł się na stronie swobodnie. Mógł bez większych trudności dotrzeć do potrzebnych informacji, by poruszał się na stronie nawet bez większych kompetencji cyfrowych. To ważne, ponieważ jeśli strona nie odpowiada na potrzeby użytkownika, może to rodzić frustrację i skończyć się szybkim zamknięciem karty. A to oznacza zwykle przejście do konkurencji. U której znajdzie to, czego nie mógł znaleźć na poprzedniej stronie. Spróbujmy teraz rozróżnić UX i UI design.
Co to jest UX design?
Skrót UX design pochodzi od User Experience Design, czyli doświadczenie użytkownika. Doświadczeniem nazywamy całościowy kontakt użytkownika ze stroną, czy aplikacją mobilną.
W UX chodzi o to, by osoba poruszająca się po stronie szybko dotarła do celu. Tym celem może być znalezienie produktu, dotarcie do danej informacji, czy założenie konta. UX design bierze pod uwagę takie czynniki, jak działanie strony, podział na kategorie, kroki potrzebne do dotarcia do celu. Przykład stanowi mapa kroków, obejmująca proces od znalezienia produktu, dodanie go do koszyka, po finalizacje transakcji. User expirence design dąży do tego, by strona była wygodna, a jej projektowanie zorientowane na użytkownika. Musi wywoływać pozytywne wrażenia i emocje, a nie frustrację. Jeśli sam natrafiając na stronę, zaczynasz się irytować jej działaniem, prawdopodobnie nie jest ona dostosowana do twoich potrzeb nawigacyjnych.
UX designer skupia się na kilku elementach
Za wrażenia użytkownika odpowiedzialny jest UX designer. Specjalista UX zaczyna cały proces od zbadania potrzeb użytkowników, aby wiedzieć, w jakim kierunku zmierzać. Każda grupa odbiorców jest inna. Przykładowo, jeśli firma kieruje swoje usługi do seniorów, to strona powinna mieć dużą i czytelną czcionkę oraz proste kategorie. Można także przeprowadzić ankiety wśród użytkowników lub też zainspirować się strona konkurencji, która robi to dobrze.
UX designer zajmuje się prototypowaniem, czyli tworzeniem testowej wersji strony, aby sprawdzić, jak pomysły działają w praktyce – jeszcze przed opublikowaniem. Projektant UX zwraca uwagę na architekturę informacji, czyli ich uprządkowanie, m.in. w menu. Zwiększenie satysfakcji klienta korzystającego ze strony jest możliwe poprzez ograniczenie liczby klików w dotarciu do celi. I tym właśnie UX designer zajmuje się, opracowując scenariusze np. dokonania zakupu danego produktu. Interaktywne prototypy pomagają w testowaniu rozwiązań.
W pracy UX designera to strony, czy aplikacja jest produktem. Proces projektowy oprócz podstawowych funkcji zakłada tworzenie rozwiązań, które ułatwią korzystanie ze strony, ale i optymalizację produktu. Mniej elementów na stronie, to szybsze ładowanie.
UI design (User Interface Design)
UI designer skupia się na aspekcie wizualnym. Projektowanie interfejsu użytkownika, czyli zestawie elementów, poprzez które następuje komunikacja między człowiekiem, a komputerem. Interfejs użytkownika obejmuje elementy strony. Zarówno kolory, jak i czcionkę, czy układ elementów na stronie. Strona musi być responsywna, tzn. dobrze wyświetlać się niezależnie od urządzenia, z którego korzysta odbiorca. Ważny jest także sam styl strony i to, czy jest ona zwyczajnie przyjemne w odbiorze i estetyczna.
Elementy UI
Jak już wspomnieliśmy, designer UI wpływa na doświadczenia użytkownika od strony graficznej. Design strony, jej nawigacja, wybór miejsc na pola tekstowe i grafiki, a także wygląd i umiejscowienie przycisków. To wszystko to, co wpływa na design strony – wszystkie kształty i kolory, tworzące jej interfejs. Zadaniem UI designera jest nadanie stronie wyglądu, który zachęca, a nie odstrasza.
Dlaczego UX i UI muszą współpracować?
Tworzenie produktów cyfrowych to proces, w którym wszystko musi być starannie zaplanowane. Projektowanie interakcji bez zaprojektowania interfejsu nie da takiego efektu jak holistyczne podejście. Oczywiście można zadziałać połowicze – lepsze to niż działanie po omacku. Jednak to projektowanie interakcji w połączeniu z pracą UI designera daje nam pełny produkt.
Zasady dobrego doświadczenia użytkownika
Zasady dobrego doświadczenia użytkownika to proste reguły, które sprawiają, że strona działa intuicyjnie. Użytkownik szybko znajduje informacje bez frustracji i nauki nowych sztuczek. Najważniejsze to prostota, spójność i hierarchia: mniej zbędnych elementów, menu zawsze w tym samym miejscu, najważniejsze rzeczy na widoku. Dzięki nim ludzie zostają dłużej, konwertują i wracają, zamiast uciekać do konkurencji po 5 sekundach.
Przykłady zastosowania UX i UI w praktyce
Przykłady zastosowania UX i UI w praktyce pokazują, jak te dwa elementy zamieniają zwykłą stronę w przyjazny sklep, gdzie użytkownik nie gubi się i chętniej zostaje. Przykład stanowi Allegro, gdzie UX skraca proces zakupów do trzech kliknięć dzięki badaniom i mapom ciepła, a UI dodaje duże „Kup teraz” oraz czytelne filtry kategorii, co zmniejsza porzucanie koszyków o kilkadziesiąt procent.
Kolejny przykład to Spotify, które personalizuje playlisty. Pokazuje piosenki, które lubisz, a ciemne tło z dużymi okładkami i prostym przesuwaniem palcem sprawia, że słuchasz godzinami. Strony z ofertami pracy typu GoWork mają wyszukiwarkę od razu na widoku i opcje aplikowania jednym kliknięciem, a kolorowe ikony zawodów i czytelny układ na telefonie sprawiają, że kandydaci chętniej wysyłają CV.
