Psychologia projektowania i neuronauka niesamowitego UX

Posłuchaj wersji audio tego artykułu

Istnieje nauka wyjaśniająca, dlaczego poszczególne projekty przyciągają wzrok i pobudzają krążenie krwi.

Ludzki mózg jest leniwy, stronniczy i skłonny do skrótów.

Badanie doświadczeń użytkowników w zakresie ludzkiego poznania może być bzdurne, nienaukowe i wypełnione fałszywymi założeniami — być może jest to wina leniwego mózgu.

Poznanie jest złożone, a wiele czynników wpływa na reakcje jelitowe lub natychmiastowe wrażenie. Kiedy pytasz kogoś: „Dlaczego to zrobiłeś?” istnieje duża szansa, że ​​nie będą w stanie odpowiedzieć lub że źle zinterpretujesz ich odpowiedź.

Wejdź do neuronauki.

Podczas gdy metody badawcze, takie jak obserwacja i wywiady, często wymagają od badacza UX i uczestnika domysłów, nowoczesna technologia, taka jak śledzenie oczu, pozwala naukowcom badać prawie niezauważalne reakcje i preferencje .

W przypadku produktów o dużym natężeniu ruchu, pozornie drobne szczegóły, takie jak szerokość przycisku lub kontrast kolorów tekstu, mogą sprawić, że różnica będzie sięgać milionów dolarów. Właśnie dlatego giganci technologiczni, tacy jak Facebook i Google, zaczynają stosować techniki oparte na neuronauce, aby badać, w jaki sposób ludzie korzystają z ich produktów.

Zacznijmy od wprowadzenia do reaktywnego, „szybkiego myślenia” i podaj kilka wskazówek dla projektantów, które pomogą wykorzystać moc neuronauki w celu stworzenia wspaniałych doświadczeń użytkowników.

Psychologia projektowania: szybkie myślenie, wolne myślenie

Nie jest tajemnicą, że wiele z tego, co kieruje ludzkim zachowaniem, jest podświadome. W ciągu milisekund po tym, jak dana osoba napotka nową aplikację lub stronę internetową, miliony neuronów zostają uruchomione, a mózg podejmuje setki podświadomych decyzji.

Czy jestem we „właściwym” miejscu? Czy powinienem ufać tej stronie?

Badacz YouTube UX, Javier Bargas-Avila, ustalił w badaniu z 2012 r., że ludzie reagują estetycznie na stronę internetową w ciągu pierwszych 17-50 milisekund po jej wyświetleniu .

Aby spojrzeć na to z innej perspektywy, mrugnięcie oka zajmuje 300-400 milisekund. Twój produkt może otrzymać proces, osąd i wyrok w mniej niż mgnieniu oka.

Te wrażenia mogą się nie rejestrować, ale mają wpływ na zachowanie. Na przykład, jeśli witryna ładuje się powoli, a mózg odczytuje pierwsze elementy, które ładują się jako „nie na temat”, użytkownik może natychmiast opuścić witrynę, zamiast czekać na załadowanie witryny.

Firmy takie jak Facebook inwestują znaczne środki w badanie kolejności obciążenia elementów. Jeśli ktoś zaloguje się do Facebooka i nie zobaczy żadnych plakietek z powiadomieniami, może natychmiast odejść. Jeśli plakietki załadują się jako pierwsze, mogą poczekać, aż załaduje się pełen treści kanał aktualności.

Książka laureata Nagrody Nobla Daniela Kahnemana Thinking, Fast and Slow dzieli ludzkie myślenie i podejmowanie decyzji na dwa systemy, aby pomóc zilustrować różnicę.

System 1: szybki, automatyczny, częsty, emocjonalny, stereotypowy, podświadomy.

Myślenie Systemu 1 jest reaktywne — odpowiada za złożone, ale instynktowne poznanie, takie jak określanie odległości między obiektami lub określanie reakcji emocjonalnych. Twój leniwy mózg na ogół domyślnie przyjmuje myślenie Systemu 1.

System 2: powolny, wymagający wysiłku, logiczny, wyrachowany, świadomy, nieczęsty.

Myślenie Systemem 2 ma charakter analityczny i jest stosowane do bardziej złożonych scenariuszy, takich jak określanie odpowiednich zachowań społecznych lub porównywanie dwóch produktów o różnych cenach i cechach.

Ponieważ mózg nie chce ponownie przetwarzać informacji ani podejmować nowych decyzji za każdym razem, gdy staje w obliczu nowego scenariusza, wiele ludzkich decyzji należy do Systemu 1, czyli „szybkiego myślenia”.

Podczas szybkiego podejmowania decyzji mózg może nadmiernie polegać na schematach lub modelach umysłowych — znanych wzorcach informacji i interakcji. Kiedy włączone jest myślenie Systemu 1, System 2 nigdy nie zaczyna działać. Ludzie mogą nie zdawać sobie sprawy ze skrótowości podejmowania decyzji w ich mózgu, ale ma to silny wpływ na ich zachowania i postrzeganie produktu.

Nauka o psychologii w projektowaniu

Ludzki mózg zużywa aż 25% tlenu, mimo że stanowi tylko około 2% jego masy. Mózg jest leniwy jako mechanizm przetrwania — rozpoznawanie wzorców i skróty oznaczają mniej energii zużywanej na świadome przetwarzanie sytuacji . Mózg identyfikuje rzeczy, oznacza je i ignoruje, dopóki nie będą ponownie istotne.

Preferowanie przez mózg wzorców i leniwe podejmowanie decyzji może ułatwić przetrwanie, ale utrudnia projektowanie UX. Jak studiujesz coś, czego Twój przedmiot badań nie może nawet dostrzec?

Kilka technik neurologicznych niedawno wkroczyło do badań nad UX, pomagając naukowcom rzucić światło na rzeczy, które stymulują „szybkie myślenie”.

Uwagę i percepcję można badać za pomocą kamer śledzących wzrok. Reakcję emocjonalną i pobudzenie można określić za pomocą czujników skóry lub analizy twarzy. Odpowiedź elektryczną w mózgu można zmierzyć za pomocą elektroencefalografii.

Dla projektantów uchwycenie czyjegoś zainteresowania i przekazanie ważnych informacji w mniej niż mgnieniu oka może wydawać się zadaniem niewykonalnym. Na szczęście, tak jak neuronauka może pomóc nam w diagnozowaniu problemów, może również ujawnić ogólne rozwiązania i najlepsze praktyki.

Oto kilka ogólnych wniosków wyciągniętych z badań doświadczeń użytkowników w neuronauce, które projektanci mogą wykorzystać podczas projektowania produktów cyfrowych.

Wskazówka 1: Psychologia Projektowania: Ułatw identyfikację

Każdy trafia na stronę internetową lub aplikację z pewnymi oczekiwaniami, jak powinna wyglądać. Trzymanie się blisko tych oczekiwań pomaga projektantom czerpać korzyści z natychmiastowego, podświadomego podejmowania decyzji.

Osoba, która otwiera Twoją aplikację lub witrynę, chce wiedzieć a) czy ma to, czego szukam; oraz b) czy to jest wysokiej jakości? Utrzymywanie prostych projektów i utrzymywanie marki, usług i produktów na pierwszym miejscu i w centrum pomaga ludziom orientować się w nich.

Umieszczenie niektórych informacji z przodu i na środku oznacza zapobieganie wypychaniu innych informacji. Uporządkowanie projektu jest tak samo ważne, jak przearanżowanie elementów.

Zauważysz przejście w firmach technologicznych w kierunku prostszych, mniej zatłoczonych interfejsów. Te minimalistyczne projekty przewyższają bardziej złożone projekty pod względem realizacji zadań, a przejrzystość wizualna ma wpływ na decyzje dotyczące zakupów w trybie offline i offline.

Udowodniono naukowo, że wizualnie proste i przejrzyste projekty działają lepiej. Leniwy mózg może natychmiast pojąć cel witryny i zrozumieć, jakie działania należy podjąć.

Wskazówka nr 2 z psychologii projektowania: wskaż, co nadchodzi

Przygotowanie lub przygotowanie kogoś na nadchodzące informacje lub interakcję może poprawić zdolność użytkownika do rozumienia nowych informacji i reagowania na nie. Możesz przygotować kogoś do oczekiwania takich rzeczy, jak elementy interfejsu użytkownika, określone interakcje lub czas w procesie.

Na przykład Yelp używa dodatkowego ekranu, aby ostrzec użytkowników, że opuszczają Yelp w celu odwiedzenia witryny innej firmy. Dodatkowy kontekst pomaga zasygnalizować użytkownikowi, że oczekuje nowego projektu i architektury informacji.

Priming to miecz obosieczny. Informacje, których nie chcesz przekazać, mogą nadal wpływać na podejmowanie decyzji . Na przykład, jeśli Twoja firma fotograficzna udostępnia tylko zdjęcia niemowląt, dana osoba może błędnie przyjąć założenie, że obsługujesz tylko niemowlęta.

Wskazówka nr 3: z psychologii projektowania: Zorganizuj dla leniwych czytelników

Badania eyetrackingowe są w stanie śledzić wzrok osoby, która wchodzi w interakcję z produktem. Mogą tworzyć mapy cieplne, które pokazują czas spędzony skupiony na jednej części ekranu, lub mapy tego, jak oko skacze po stronie.

Wiemy, że w różnych branżach i typach aplikacji mózg często skanuje w poszukiwaniu informacji we wzorcu F (lub E). Osoba patrzy na informacje u góry, czyta po prawej, a następnie skanuje stronę w poszukiwaniu odpowiednich informacji lub ikon.

Łamanie wzoru F — na przykład umieszczenie ważnych informacji w prawym dolnym rogu — utrudni znalezienie.

Oswój swój tekst

Według badania Nielsena Normana obejmującego 45 237 odsłon, ludzie czytają tylko około 20% tekstu na stronie. Co gorsza, w witrynach o większej zawartości ludzie poświęcali tylko około 4 dodatkowych sekund na każde dodatkowe 100 słów tekstu.

W świecie, w którym ludzie nie czytają słowo w słowo, Nielsen Norman stosuje następujące wytyczne dotyczące tekstu możliwego do zeskanowania .

• Wyróżnione słowa kluczowe
• Znaczące podtytuły
• Listy punktowane
• Jeden pomysł na akapit
• Styl odwróconej piramidy — zacznij od konkluzji
• Połowa liczby słów (lub mniej) w konwencjonalnym piśmie

Pracuj z wyostrzeniem kolorów i kontrastem

Organizacja tekstu i lokalizacja nie są jedynymi ważnymi czynnikami w projektowaniu. Teoria kolorów, wagi i kontrast mogą być wykorzystane do skierowania uwagi użytkownika.

Zespół projektowy kokpitu NASA wykorzystuje luminancję — lub postrzeganą jasność projektu — do pomocy w zarządzaniu uwagą pilota w obszarze zatłoczonym konkurencyjnymi informacjami. Zespół projektowy kokpitu używa koloru i kontrastu, aby nadać wizualne wyeksponowanie najważniejszym elementom.

Luminancja i kontrast mogą być używane w całym produkcie, aby podkreślić lub zbagatelizować określone informacje, ale najczęściej są one wymieniane w projekcie przycisku lub wezwania do działania. Jak widać na przykładowych czerwonych przyciskach poniżej, chociaż przycisk w lewym górnym rogu jest najbardziej nasycony, „wydaje się” najjaśniejszy, ponieważ kontrast jest najwyższy.

Kontrast i luminancja to tylko pierwszy krok. Teoria kolorów sugeruje zrównoważenie kolorów produktu poprzez użycie dominującego koloru w 60% przypadków, drugorzędnego 30% i akcentu 10%. To załamanie jest zgodne z neurologią stojącą za tym, co przyciąga wzrok. Ponieważ kolor akcentujący jest używany najmniej, najbardziej przyciąga wzrok.

Podobnie jak użycie jasnych kolorów może przyciągać wzrok, użycie bardziej stonowanych kolorów może pomóc użytkownikowi określić, które informacje są drugorzędne lub mniej ważne. Na przykład większość witryn korzysta z obszarów stopek o bardziej neutralnym kolorze, aby oddzielić je od reszty informacji na stronie.

Wszelkie funkcje lub projektanci informacji usuwają priorytety, pomagając użytkownikowi skupić się bezpośrednio na najbardziej importowanych interakcjach lub informacjach.

Wskazówka 4: Psychologia Projektowania: Sprawdzenie Przeczucia

Na szczęście nie potrzebujesz tysięcy dolarów oprogramowania do śledzenia wzroku ani elektroencefalogramu, aby stwierdzić, czy projekt działa.

5-sekundowe testy to potężne narzędzie do określenia, czy Twoje projekty są natychmiast zrozumiałe.

W 5-sekundowym teście uczestnik przegląda witrynę lub aplikację przez 5 sekund, a następnie odpowiada na pytania dotyczące przedmiotu i projektu. Nie mogąc odwołać się do obrazu, uczestnik daje swoje „wrażenia” – to, co uczestnicy zakładali, było celem i funkcją produktu oraz co zrobiliby lub gdzie szukaliby dalszych kroków.

Twój produkt może mieć wszystkie funkcje, których pragnie Twój użytkownik, ale jeśli leniwy, kochający wzory mózg nie może od razu tego pojąć, pójdzie dalej .

Projektanci jako „czytelnicy w myślach”

W miarę jak dowiadujemy się więcej o psychologii projektowania, mózgu i percepcji, normy projektowania będą się zmieniać w całej branży. Wątkiem łączącym są dane — w miarę ulepszania metod badania neuronauki i poznania, wraz z rozwojem rodzaju i jakości danych dostępnych do projektowania UX.

Projektowanie doskonałych wrażeń użytkownika to nie magia — to nauka. Neuronauka.

Ten artykuł został napisany we współpracy z badaczką UX Caitria O'Neill , wcześniej na Facebooku, obecnie w Airbnb i stypendystką w Stanford's d.school .

• • •

Dalsza lektura na blogu Toptal Design:

• eCommerce UX – przegląd najlepszych praktyk (z infografiką)
• Znaczenie projektowania zorientowanego na człowieka w projektowaniu produktu
• Najlepsze portfolio projektantów UX – inspirujące studia przypadków i przykłady
• Zasady heurystyczne dla interfejsów mobilnych
• Projekt przewidujący: jak tworzyć magiczne doświadczenia użytkownika