UX Design - przewodnik dla programistów

UX Design - Co to jest?

User Experience Design to projektowanie doświadczeń użytkownika, czyli dbanie o to, aby interakcja z produktem dostarczała użytkownikom pozytywnych doświadczeń. Termin ten został po raz pierwszy użyty przez Dona Normana, który pracując w Apple Computers, nadał sobie tytuł „Architekta User Experience”. Korzystanie z aplikacji czy strony internetowej powinno sprawiać przyjemność i dawać satysfakcję na tyle, aby użytkownik chciał po raz kolejny sięgnąć po nasz produkt oraz polecić go innym.

UX Design - jak sama nazwa wskazuje, koncentruje się na użytkowniku, bo to właśnie on decyduje o sukcesie naszego projektu. Obecnie użytkownicy mają wysokie wymagania wobec produktów cyfrowych. Jeśli napotkają na trudności podczas korzystania z naszego produktu, to istnieje duże prawdopodobieństwo, że przeciętny użytkownik go wyłączy i już nigdy nie wróci. Dlatego tak istotne jest włączenie elementów UX Designu do procesu projektowego - minimalizacja ryzyka, że użytkownik nie odnajdzie się w naszej aplikacji i pójdzie do konkurencji.

Powiecie - dobrze, ale co ja jako software developer mam z tym wspólnego? W jaki sposób w codziennej pracy mogę wykorzystać UX Design?

Tak naprawdę każdy z nas ma na co dzień do czynienia z UX Designem, tylko o tym nie wie. Najlepiej zobrazuje to przykład: przestawienie czajnika elektrycznego bliżej szafki z herbatą, aby przygotowywanie napoju było łatwiejsze i szybsze. To właśnie UX – dostosowanie „produktu” do potrzeb użytkowników, którymi jesteśmy my sami.

UX Design - przewodnik dla programistów

Podczas pracy nad produktem cyfrowym powinniśmy myśleć o osobach, które będą z projektowanego rozwiązania korzystać. Nie jest to łatwe, bo tworząc nowy produkt możemy się jedynie domyślać kto to będzie i jakie ma oczekiwania wobec tego co tworzymy. Jest jednak kilka kwestii, na które możemy zwrócić uwagę aby poprawić UX naszego produktu i nauczyć się dobrych praktyk stosowanych w procesie projektowania wrażeń użytkowników.

1. Unikaj niezrozumiałych komunikatów

Użytkownik musi czuć się pewnie korzystając z naszego produktu. Dlatego ważne jest zaprojektowanie tekstów w taki sposób żeby nie było wątpliwości w jaki sposób korzystać z danej funkcjonalności. Każdy zawiły komunikat czy niefortunnie zadane pytanie sprawią, że użytkownik traci czas na zastanawianie się, co właściwie powinien zrobić. Poza tym traci też pewność siebie i zaufanie do aplikacji.

anulowanie subskrypcji zły i dobry UX

Po lewej przykład złego komunikatu – użytkownik może przez przypadek anulować subskrypcję myśląc, że Cancel zamknie modal, a nie usunie subskrypcję. Po prawej wersja poprawiona – teraz nie ma wątpliwości, za co każdy z przycisków odpowiada.

Mając na co dzień do czynienia z produktem, który tworzymy bardzo łatwo zapomnieć o tym, że osoba korzystająca z naszego produktu może nie zrozumieć wyświetlonego komunikatu. Gdy użytkownik nie będzie wiedział jak poprawić błąd w formularzu albo dlaczego nie udało mu się zalogować jest duża szansa, że nie będzie więcej chciał korzystać z naszej aplikacji.

Nieprawidłowa data zły dobry UX

Dla użytkownika komunikat Specified date is incorrect jest niezrozumiały, zwłaszcza że format daty wydaje się poprawny. Nie ma informacji na czym polega błąd. Zmiana tekstu na Date occurs in the past sprawia, że użytkownik od razu wie co powinien poprawić.

2. Intuicyjne przyciski

Każdy przycisk w aplikacji powinien być zaprojektowany w taki sposób, aby od razu było wiadomo czy da się w niego kliknąć czy nie. O ile na desktopie można posiłkować się zmianą kursora na pointer, to w aplikacjach mobilnych nie jest to możliwe.

Przycisk dodaj o karty zły i dobry UX

Na lewym designie użytkownik może nie mieć pewności czy Add to cart jest klikalne i może próbować znaleźć inny sposób na dodanie produktu do koszyka. Zmiana styli przycisku sprawia, że nie powinno już być wątpliwości.

usuwanie pliku ostrzeżenie zły i dobry UX

Przycisk „back” na lewym designie sprawia wrażenie wyłączonego, niemożliwego do kliknięcia – szarość kojarzy się z buttonami disabled. Lekka zmiana styli a design od razu staje się czytelniejszy.

3. Uprość design

Projektuj tak, aby jak najbardziej ułatwić użytkownikowi korzystanie z aplikacji. Pamiętaj, że nie projektujesz dla siebie a dla użytkownika, który będzie miał kontakt z twoim produktem po raz pierwszy (i miejmy nadzieję że nie ostatni).

Wybór jasnego lub ciemnego motywu zły i dobry UX

Zamień select na radio buttony gdy do wyboru jest niewiele opcji (2-4) – bowiem jest to wygodniejsze dla użytkownika. Poza tym pozwala na szybsze podjęcie decyzji gdy od razu wiadomo co mamy do wyboru.

Wprowadzanie danych do formularza zły i dobry UX

Zrezygnuj z placeholderów, bo przestają być użyteczne w momencie gdy użytkownik zaczyna pisać. Zamiast nich dodaj informacje wyświetlające się pod inputem, dostępne dla usera cały czas.

Niejasne komunikaty, źle zaprojektowane przyciski i skomplikowane layouty to doskonały przepis na produkt, którego nikt nie będzie chciał używać. Ludzie śmieją się ze stron Web 1.0, bo tam UX po prostu nie istnieje. W Web 2.0 zaczął się pojawiać, a obecnie staje się standardem w projektach. Programiści, którzy pomijają UX w swoich projektach, zostaną po prostu w tyle.

kliknij aby przejść o formularza kontaktowego

Content

Got a project?

Let's talk!

__wf_zastrzeżone_dziedziczyć
Technologies
Technologies
HTML - co to?
arrow icon
3.20.2024
2 min czytania
Technologies
What is HTML?
arrow icon
3.21.2024
2 min read
Technologies
Technologies
TypeScript? - co to?
arrow icon
3.20.2024
3 min czytania
Technologies
What is TypeScript?
arrow icon
3.20.2024
3 min read
Technologies
Technologies
PHP - co to?
arrow icon
3.19.2024
1 min czytania
Technologies
What is PHP?
arrow icon
3.19.2024
1 min read
Technologies
Technologies
Swift - co to?
arrow icon
3.18.2024
5 min czytania
Technologies
What is Swift?
arrow icon
3.18.2024
5 min read
Technologies
Technologies
Kotlin - co to?
arrow icon
3.16.2024
4 min czytania
Technologies
What is Kotlin?
arrow icon
3.16.2024
4 min read
Technologies
Technologies
Vue.js - co to?
arrow icon
3.15.2024
3 min czytania
Technologies
Technologies
What is Vue.js?
arrow icon
3.15.2024
3 min read
Technologies
Technologies
JAVA - Co to?
arrow icon
3.14.2024
4 min czytania
Technologies
What is JAVA?
arrow icon
3.13.2024
2 min read
Technologies
Technologies
React Native - co to?
arrow icon
3.13.2024
3 min czytania
Technologies
What is React Native?
arrow icon
3.13.2024
3 min read
Technologies
Technologies
React.js - co to?
arrow icon
3.13.2024
2 min czytania
Technologies
What is React.js?
arrow icon
3.13.2024
2 min read
Technologies
Node.js - co to?
arrow icon
3.13.2024
1 min czytania
Technologies
What is Node.js?
arrow icon
3.13.2024
1 min read
Technologies
Technologies
JavaScript - co to?
arrow icon
3.13.2024
1 min czytania
Technologies
What is JavaScript?
arrow icon
3.13.2024
1 min read
Knowledge hub
Knowledge hub
Kim jest fullstack developer?
arrow icon
3.13.2024
1 min czytania
Knowledge hub
What is a fullstack developer?
arrow icon
3.13.2024
1 min read
Knowledge hub
Knowledge hub
Co to jest frontend?
arrow icon
3.13.2024
2 min czytania
Knowledge hub
What is frontend?
arrow icon
3.13.2024
2 min read
Knowledge hub
Knowledge hub
Co to jest backend?
arrow icon
3.13.2024
2 min czytania
Knowledge hub
What is backend?
arrow icon
3.13.2024
2 min read
Business
Business
Profesjonalna aplikacja dla firmy - 10 wskazówek
arrow icon
5.12.2023
7 min czytania
Business
Business
Doradztwo IT - korzyści dla Twojej firmy
arrow icon
3.21.2023
6 mi czytania
IT
How to get started in IT?
arrow icon
3.6.2023
7 min read
IT
WEB3 - What is it? Introduction
arrow icon
2.21.2023
4 min read
Code
Code
Czy MobX to dobra alternatywa dla Redux?
arrow icon
2.1.2023
3 min czytania
Code
Code
Podstawy React’a - stan i hook useState
arrow icon
1.26.2023
5 min czytania
Startup
Startup
Startup - z jaką firmą IT współpracować?
arrow icon
12.20.2022
11 min czytania
Business
Business
Najlepszy kraj do outsourcingu IT
arrow icon
12.12.2022
4 min czytania
Business
Business
Jak zmienić firmę programistyczną?
arrow icon
12.2.2022
4 min czytania
Business
Business
Outsourcing IT- kompletny PRZEWODNIK!
arrow icon
11.28.2022
3 min czytania
Business
Business
Team Augmentation - Korzyści!
arrow icon
11.23.2022
9 min czytania
Business
Business
W co inwestować pieniądze w 2021 roku?
arrow icon
11.21.2022
3 min czytania
Business
Business
Praca w różnych strefach czasowych. Jak to działa?
arrow icon
11.18.2022
7 min czytania
Startup
Startup
Co to jest startup? (Nowoczesne Przedsiębiorstwo)
arrow icon
11.17.2022
6 min czytania
Business
Business
Co to jest outsourcing pracowników IT i ILE kosztuje
arrow icon
11.14.2022
5 min czytania
IT
IT
Jak stworzyć aplikację mobilną?
arrow icon
11.11.2022
5 min czytania
IT
IT
Jak testują programiści?
arrow icon
11.10.2022
2 min czytania