Idealny projekt www – czy to możliwe?

Projektując stronę internetową należy pamiętać przede wszystkim o użytkowniku. Warto zwrócić szczególną uwagę na te aspekty, które znacząco mogą wpłynąć na konwersję, takie jak formularz kontaktowy czy CTA (Call-to-Action). Z artykułu dowiecie się jak zaprojektować te elementy by były efektywne oraz które techniki i badania są niezbędne do stworzenia idealnego projektu www.

1. Jakie są 3 typowe, a jednocześnie kluczowe błędy w projektowaniu WWW/serwisów transakcyjnych/aplikacji mobilnych?

Jednym z kluczowych błędów jest projektowanie tylko idealnej ścieżki danego procesu i brak przemyślenia pozostałych scenariuszy. Kompletnie przygotowany proces to taki, który uwzględnia realne przypadki użyć (m.in. ewentualne błędy). Warto zastanowić się nad tym na etapie projektowania, by nie łatać dziur w pośpiechu podczas realizacji wdrożenia. To często owocuje rozwiązaniami, które znacznie obniżają jakość doświadczenia użytkownika z produktem.

Kolejnym problemem jest niewłaściwa komunikacja z użytkownikiem, czyli zaniedbanie jakości treści na stronie i stosowanie niezrozumiałego dla odbiorcy nazewnictwa. Prosty język to niezmiernie istotna kwestia podczas projektowania serwisu, choć często bywa pomijana na etapie prac projektowych. Forma i sposób komunikacji powinien być dopasowany do grupy docelowej serwisu. Jednakże zakładanie, że użytkownicy z wąskiej grupy (np. księgowe) doskonale rozumieją branżowe słownictwo jest ryzykowne, dlatego warto to weryfikować.

Brak spójności serwisu zarówno pod względem grafiki, jak i sposobów nawigacji to jeden z większych problemów. Podchodząc do projektowania serwisu potrzebne jest globalne spojrzenie na  serwis czy aplikację jako całość. Przyjęcie pewnych założeń podczas tworzenia pierwszych ekranów i konsekwentne ich używanie to kluczowa kwestia, by użytkownik swobodnie poruszał się po serwisie czy aplikacji i mógł się jej „nauczyć”. W przypadku bardziej rozbudowanych produktów dobrym rozwiązaniem jest stosowanie design systemu, który porządkuje i ułatwia pracę.

2. Jak tworzyć skuteczne CTA (Call-to-Action) by zwiększać konwersję? O czym pamiętać, czego unikać?

Skuteczne CTA musi być dla użytkownika zauważalne, czyli ma odpowiedni kontrast kolorystyczny względem tła i jest otoczone wolną, jasną przestrzenią. Musi również sugerować swoją klikalność, np. poprzez podkreślenie czy zwiększenie rozmiaru fontu. Równie ważne jest copy – powinno informować odbiorcę, czego może spodziewać się po kliknięciu. Odbiór etykiety powinien być prosty i jednoznaczny, aby użytkownik mógł szybko i bez zastanowienia podjąć akcję.

3. Mój przepis na idealny formularz/wniosek online to…

Wcale nie skracanie go za wszelką cenę! Jeżeli nie da się zmniejszyć ilości pól w formularzu (np. ze względu na wymagania biznesowe) nie musimy z tego powodu płakać. Często słyszy się, że najlepszy formularz to krótki formularz. Moim zdaniem nawet dłuższe mogą być przyjemne w obsłudze, jeśli zadbamy o kilka rzeczy.

1. Przede wszystkim indywidualne podejście – przed zaprojektowaniem zastanówmy się m.in.: nad celem formularza, grupą docelową, czy wymaganiami biznesowymi/technicznymi. Wszystko po to, by podczas projektowania jak najmniej rzeczy nas zaskoczyło.
2. Ogólna czytelność formularza – odpowiednie odległości pomiędzy polami i etykietami, logiczne rozmieszczenie pól, przyjemna w odbiorze warstwa graficzna, czyli wszystko to, co użytkownik widzi na pierwszy rzut oka i co powoduje określoną reakcję. Jeśli formularz od pierwszego wejrzenia przytłacza swoją formą, możemy wystraszyć odbiorcę.
3. Zrozumiałe etykiety – im mniej użytkownik musi się zastanawiać, tym lepiej. Jeśli nie jesteśmy pewni, czy nasza propozycja jest właściwa, warto to zweryfikować. W przypadku ograniczonego budżetu zrealizuj mniejsze badania – informacja zwrotna od kilku użytkowników i tak będzie bardzo wartościowa. Do tego celu świetnie sprawdza się RespoTeam, o którym możecie dowiedzieć się więcej tutaj: https://respoteam.com/.
4. Wszelkiego rodzaju pomoc kontekstowa, jeśli  może być potrzebna. Zwykły tooltip z wyjaśnieniem może załatwić sprawę, a przy tym nie narzuca się tym, którzy pomocy nie potrzebują. Użytkownik, który utknie przy danym polu, prawdopodobnie zacznie szukać pomocy w Google i, jeśli szybko jej nie znajdzie, porzuci formularz. Pamiętajmy też o jasnym formułowaniu komunikatów, by ta pomoc niosła użytkownikowi realną korzyść.
5. Walidacja – jeden z ważniejszych punktów. Nie chodzi tylko o wskazanie, że użytkownik popełnił błąd, ale przede wszystkim ważna jest przyczyna tego błędu. Jak użytkownik ma przejść przez formularz, jeśli nie wie, co poprawić? Dobrze zatem poinformować użytkownika, co może zrobić w danej chwili.

Przykład? Kupuję bilet lotniczy i wpisuję w formularzu swoje nazwisko. Wyskakuje błąd, ale nie ma żadnych podpowiedzi, co zrobić. Po dłuższym googlowaniu okazuje się, że nie powinnam wpisywać polskich znaków. Dużo łatwiej dla mnie byłoby, gdyby ta informacja pojawiła się w komunikacie walidacyjnym.

4. 3 kluczowe badania i techniki UX, bez których trudno jest stworzyć idealny projekt WWW + dlaczego?

Podstawową rzeczą umożliwiającą stworzenie wartościowego projektu jest jego zrozumienie. Z tego względu dobrze zorganizować warsztaty koncepcyjne z interesariuszami. Podczas warsztatów mamy możliwość zebrania wymagań dotyczących projektu oraz wszelkich dostępnych informacji, które mogą być przydatne podczas projektowania (np. o danych zastanych, grupie docelowej). Minimalizujemy ryzyko niezrozumienia, a dodatkowo angażujemy klienta w projekt i dajemy szansę się poznać, co pozytywnie buduje relacje.

Przed rozpoczęciem projektowania  serwisu czy aplikacji dobrze jest zorientować się, jak wygląda to u konkurencji. W zależności od możliwości można pokusić się o mniej lub bardziej zaawansowany benchmark, który z pewnością przyda się podczas realizacji projektu. Nie zawsze musimy ograniczać się do konkretnej branży, dla której projektujemy. Czasem wyjście poza ramy pozwala na zaczerpnięcie świeżych pomysłów i stworzenie ciekawych rozwiązań.

Badania użyteczności przygotowanego prototypu serwisu czy aplikacji dają możliwość zweryfikowania pomysłów zespołu projektowego. Uczestnicy badań podczas wykonywania zadań przechodzą konkretne ścieżki, co pozwala wykryć punkty wymagające poprawy. Wprowadzenie poprawek na makietach jest stosunkowo łatwe i tanie, dlatego warto zrobić to zanim trafią do wdrożenia i ich naprawa będzie dużo bardziej kosztowna.