Face: syndrom uśmiechniętych twarzy

Oceń tę pracę

Twarze ludzkie są interesujące z wielorakiej perspektywy:

  • psychologii emocji (słynne prace Paula Ekmana, o których też nieco niżej),
  • neuropsychologii (chociażby kwestia mózgowych podstaw rozpoznawania twarzy, jako przykład swoistego pattern recognition, oraz badań nad poznawczymi dysfunkcjami w tym zakresie – świetnie opisane w książce Olivera Sacksa, Mężczyzna, który pomylił żonę z kapeluszem),
  • czy w końcu psychologii komunikacji (szerzej – społecznej), której dokonania stały się także inspiracją dla rozwoju osobnego działu w robotyce – socjorobotyki (czołowa pozycja w tej dziedzinie: C. L. Breazeal, Designing Sociable Robots) czy też pozwoliły się rozwinąć części koncepcji interfejsów opartych na twarzy ludzkiej – tzw. avatary (zob. chociażby Bruce Damer, Avatars! czy, w szerszym kontekście: Peter Plantec, Virtual Humans).

Zresztą moje zainteresowanie tematyką interfejsów swoje źródło ma w (neuro)psychologicznych koncepcjach komunikacji człowiek-komputer. Jeśli ktoś miałby ochotę, to może się zapoznać z moimi publikacjami:

  • „Twarzą w twarz. O mózgowych podstawach rozpoznawania ludzkich twarzy” (org. w: „Charaktery”, Nr 8/103) – część 1 i część 2, który dotyka kwestii neuropsychologicznych
  • oraz „Ludzkie emocje maszyn” (org. w: „Charaktery”, Nr specjalny 1/2006: Neuropsychologia), tekst omawiający m.in. podejście w socjorobotyce oraz prace badawcze Byrona Reeves i Clifforda Nass, a stojące u podstaw idei MS Agenta.

Temat ten jednak poruszam tutaj z dwu zgoła innych powodów.

  1. Uczestniczyłem ostatnio w dwu niezależnych od siebie przedsięwzięciach Webowych, w których pojawiły się pomysły umieszczenia zdjęć przedstawiających ludzkie twarze na stronie WWW. Dla pierwszego pomysłu wyjściowym argumentem było podwyższenie zauważalności komunikacji marketingowej na banerach, zważywszy iż zjawisko ślepoty na banery (banner blindness) skutecznie obniża tę wartość.
  2. Dla drugiego zaś przesłanką było budowanie zaufania na poziomie wizualnym, a oparte właśnie o umieszczenie zdjęć uśmiechniętych twarzy.

Ciekawe w tym sensie są wyniki badań z użyciem eyetrackera, jakie można otrzymać z badania stron WWW z umieszczonymi zdjęciami ludzkich twarzy. Także co nieco pisałem o tym (z Olą Słomińską) w tekście dla „Charakterów”: „O czym mówią oczy” (wspominałem o tym, a pełny tekst niebawem postaram się umieścić w sieci).

C.D.N.

Usability: pytania o użyteczność

Oceń tę pracę

Jakiś czas temu Grzegorz Miłkowski, przy okazji prac nad raportem interaktywnie.com nt. użyteczności, poprosił mnie o kilka wypowiedzi. W raporcie znalazło się co prawda kilka z nich, aczkolwiek Grzegorz swoimi pytaniami poruszył kilka kwestii, które są dość interesujące, a o których na blogu jeszcze nie pisałem (i pewnie w innej sytuacji bym nie napisał). Stąd postanowiłem – za zgodą Grześka – zamieścić cały tekst na blogu.

***

GM: Czy użyteczność musi stać w opozycji do rozwiniętej interakcji? Zdarza się, że aby niejako zmusić użytkownika do pożądanych przez nas czynności na stronie www, należy zrezygnować z części użyteczności, utrudniając mu życia. Czy jest możliwość pogodzenia tych sprzecznych potrzeb?

MK: Termin 'użyteczne’, nie jest tylko cechą stron łatwych w obsłudze, wtedy zapewne dużo lepszym terminem byłby 'używalne’; użyteczne, to także potrzebne i przydatne (a nie wszystkie przydatne narzędzia są łatwe w obsłudze i odwrotnie – nie wszystkie łatwe w obsłudze narzędzia są przydatne). Czasem efekt końcowy wymaga zastosowania pewnych właściwości (funkcjonalności, sposobu rozwiązania nawigacji), które zdają się „utrudniać” posługiwanie się aplikacją, ale za cenę zwiększenia na przykład bogactwa płynącego z doświadczenia interakcji.

Nie zawsze pożądaną cechą systemu jest łatwość jego obsługi – a przynajmniej nie pierwszoplanową. Jednak aplikacja dalej może być potrzebna i przydatna, a w tym sensie i użyteczna.

Klasyczne pojmowanie użyteczności już się skończyło bądź, gdy chcieć je stosować, jest mocno ograniczone. Głównym ograniczeniem może być fakt prób wyjścia poza standardowe składowe interakcji oraz standardowe interfejsy oparte o myszkę i klawiaturę po stronie użytkownika oraz elementy klikalne po stronie medium.

„Gonitwa” za zwiększeniem doświadczeń użytkowników z marką (user experience) wymusza na projektantach rozwiązania niestandardowe, jeszcze kilka lat temu nie funkcjonujące w świecie interakcji internetowej. By nie poruszać się tylko w sferze teorii – mój ulubiony przykład: jeśli zależy mi na tym, by użytkownicy przychodzący na stronę WWW odczuli pozytywne cechy marki – np. gazowanego napoju orzeźwiającego – zamiast klasycznego kliku powodującego wejście na stronę, mogę zastosować interfejs oparty o kamerę internetową (dostępną już w prawie każdym modelu laptopa) oraz system rozpoznawania mimiki twarzy. Uśmiech osoby siedzącej przed ekranem komputera może być tym samym, czym do niedawna było kliknięcie w przycisk WEJŚCIE (bądź SKIP INTRO).

Użyteczność, jako łatwość obsługi stron, też nie zawsze jest główną cechą jaką chcemy uzyskać w ramach klasycznych stron WWW. Na przykład coraz większa ilość użytkowników skarży się, że jednym z utrudnień dla korzystania ze stron, jest system zakładania na nich kont i konieczność logowania. Gdzieś niedawno czytałem wyniki badań, które wskazywały, że jest to bodajże druga cecha klasyfikowana przez respondentów biorących udział w badaniu, utrudniająca im korzystanie z zasobów. Ale z drugiej strony mamy serwisy internetowe, które niejako w strategię mają wpisane tworzenie kont użytkowników – i co wtedy? Poza tym, rejestracja w serwisach wywołuje pewne cechy u użytkowników, które z punktu widzenia marki mogą być istotne – jak np. poczucie elitarności i przynależności do pewnej grupy. Stąd nie zawsze jest tak prosto stwierdzić, który z aspektów użyteczności należy wybrać przy danym projekcie.

Krótko mówiąc – poszerza się sfera możliwości interakcji (np. dzieki interfejsom dotykowym czy wykorzystaniu kamery internetowej), stąd i użyteczność jako dyscyplina również ewoluuje.

GM: Z jakimi tarciami na linii specjalista od usability / projektant najczęściej można się spotkać? Które elementy serwisu są najczęściej punktem spornym?

MK: Nie wiem. Jestem projektantem, wykorzystującym w swej pracy m.in. wiedzę z zakresu usability. Nie czuję wewnętrznego konfliktu 😉

GM: Czy można wyróżnić elementy, które wpływają na użyteczność i jednocześnie się różnią w zależności od tego, jaką funkcję ma pełnić serwis, np. strona korporacyjna, sklep itp. Na jakie najważniejsze różnice należy zwrócić uwagę w takim przypadku? Oczywiście bezdyskusyjne jest to, że są to zupełnie różne kreacje, jednakże być może są jakieś elementy, które nie odgrywają ważnej roli w jednym przypadku, a w drugim warunkują powodzenia?

MK: Jedno wiem na pewno i staram się o tym mówić tam, gdzie mogę. Tak jak alchemikom nie udało się znaleźć kamienia filozoficznego – bo go nie ma – tak nie ma złotych reguł z zakresu użyteczności zapewniających sukces serwisom.

Mało tego, sam często powtarzam, że czasem, dla dobra sprawy, należy niektóre sprawy skomplikować – jak mawiał Einstein: „rzeczy powinny być tak proste jak to możliwe, ale nie prostsze”.

Strony internetowe są tylko środkami to uzyskania pewnych celów klienta – w żadnej mierze nie są celami samymi w sobie.

Podam przykład: Ostatnio na jednej z konferencji wywołałem oburzenie części ekspertów (których osobiście szanuję), że są przypadki, gdy nie należy doprowadzać proces wypełniania formularza do zbytniego uproszczenia. Że trudność w kwestii wypełnienia formularza,  na przykład wymuszenie podania jakieś danej, której normalnie użytkownicy nie posiadają przy sobie, a tylko klienci faktycznie zainteresowani danym produktem bądź usługą, ma tę pozytywną cechę, że już na starcie pozwala nam wyselekcjonować tylko te osoby, które faktycznie są zainteresowane produktem/usługą. W innym wypadku, gdy formularz będzie prosty w wypełnieniu, w tym sensie, że będzie mógł go wypełnić każdy, narażamy firmę – naszego klienta – na dodatkowe koszta wynikające ze zwiększenia ilości obsługi przy odpowiadaniu na zapytania ofertowe, przy jednoczesnym spadku procentowej ilości transakcji. W ten sposób, widząc tylko krótkowzroczny cel naszej pracy – umożliwienie użytkownikom łatwego wypełniania formularzy – czasem łatwiej wyrządzić krzywdę klientowi, przy jednoczesnej radości z tego, że nasze działania zwiększyły konwersję.

GM: Często można spotkać się z zarzutami, że serwisom flashowym nie po drodze z usability. Gdzie więc tkwi klucz do użyteczności takich stron?

MK: Trudno tak jednoznacznie stwierdzić, że Flash jest be, a HTML jest cacy.

W 2000 roku Jakob Nielsen napisał swój głośny artykuł „Flash: 99% Bad”. Zaraz potem firma Macromedia zatrudniała go w roli eksperta mającego za zadanie przyczynić się do zwiększenia użyteczności tej technologii.

Dwa lata później wyszła książka o przewrotnym tytule „Flash 99% Good. A Guide to Macromedia Flash Usability”, autorstwa Kevina Airgida i Stephenie Reindel. W tym samy roku ukazała się blisko 500-stronicowa „The Flash Usability Guide. Interacting with Flash MX”,  którą napisało aż sześciu ekspertów. To pokazuje jak firma – jeszcze wtedy Macromedia – zaczęła szybko działać w kwestii podwyższenia użyteczności swoich produktów, a z drugiej strony jak dużo czasu upłynęło, a mit nieużytecznego Flash wciąż się utrzymuje.

Z tego co wiem, to w narzędziach programów do obróbki Flash znajdują się opcje związane z użytecznością, czy raczej dostępnością (nie używam tej aplikacji, więc trudno mi to potwierdzić). Nie wszyscy jednak je wykorzystują. Chociaż, nie powiem, brak obsługi kliknięcia z prawego przycisku w przypadku technologii Flash bywa uciążliwy… przynajmniej dla mnie.

GM: Czy można wymienić jakieś elementy, które świetnie sprawdzają się w serwisach html-owych, natomiast we flashowych stanowią ich przysłowiowy gwóźdź do trumny. I na odwrót, flashowe rozwiązania dotyczące użyteczności, które nie pasują do zwykłych serwisów?

MK: Nie wiem. Mam wrażenie, że jeśli nawet, to dzięki coraz ciekawszym zastosowaniom technologii AJAX przy jednocześnie powiększającej się ilości dostępnych gotowych skryptów, ta przepaść się zmniejsza.

GM: Czy jest w ogóle sens badać serwisy flashowe pod kątem usability?

MK: Tak. Łatwość obsługi stron nie jest w żaden sposób zależna od użytej technologii. Tak samo jak badamy pod kątem usability również obsługę pilotów do TV. Użyteczność nie jest tylko zarezerwowana dla stron WWW, czy dla stron WWW wykonanych w HTML-u.

GM: Naukowcy z Research Center Xeroxa w Palo Alto Stuart Card, Ed Chi i Peter Pirolli badając na początku lat 90-tych zachowania ludzi szukających informacji w Internecie stwierdzili, że ich postępowanie podobne jest do polowania zwierząt. Jednym słowem, podążają za tropem, który wydaje im się silny oraz jednocześnie budujący nadzieję na obfity łup. Jak więc powinna wyglądać dobrze zbudowana ścieżka (trop), która doprowadzi użytkownika do pożądanego przez nas miejsca w serwisie WWW?

MK: Nie ma złotych reguł, jak wspominałem już powyżej. Ale… dobra ścieżka to: 1) możliwość szybkiej identyfikacji przez użytkownika, że element, który widzi jest tym, który szuka (na przykład dobrze dopasowane słowo – szybsze są czasy reakcji osób aplikujących do jakieś firmy, gdy w ramach łącza prowadzącego do informacji z działu personalnego widzą słowo ‘Praca’, niż ‘Twoja kariera’); 2) łatwa w obsłudze ścieżka dotarcia do finalizacji ścieżki – widoczne i dobrze opisane elementy tworzące łańcuch kliknięć, pozwalające w miarę szybkim czasie dotrzeć do realizacji danego scenariusza użycia; czasem też w takich przypadkach, gdy na przykład naszym flow jest zestaw formularzy (wizard), możliwość umieszczenia opcji „Pomiń”, pozwalającej skrócić pewne kroki.

Generalnie, sieć wywołuje wśród użytkowników jakiś rodzaj zniecierpliwienia i gonitwy. Dużo trudniej jest im się skupić przez dłuższy czas na jakimś elemencie treści, zaś dużo częściej oddają się klikaniu, jako czynności mającej ich przybliżyć do czegoś bardziej ciekawego niż to, co widza w danej chwili.

Ta gonitwa kliknięć ku ‘jeszcze fajniejszym rzeczom’, ku ‘nowym odkryciom’, staje się coraz powszechniejsza. W sieci zamieniamy się w myśliwego i szukamy coraz atrakcyjniejszej zdobyczy. Natomiast z czasem, coraz trudniej zaspokoić nasz apetyt. Jak w czasach studiów mawiał mój profesor od estetyki – gdy człowiek nauczy się pić drogie wina, nagle przestają mu smakować tanie, którymi jeszcze do niedawna się delektował.

GM: Czy można rozróżnić jakieś elementy, które będą bardziej użyteczne dla jednych grup wiekowych, a mniej dla innych? Tj. czy można pokusić się o stwierdzenie, że serwisy przeznaczone np. dla starszych internautów powinny być nieco inaczej zbudowane pod kątem usability?

MK: Tak. Od wieku grupy docelowej zależą na przykład takie elementy jak: wielkość dobranego fontu, kolorystyka (poziom kontrastu), w tym kolorystyka łącz (widzenie koloru niebieskiego z wiekiem jest coraz gorsze, stąd stosowanie niebieskich łączy przy jednoczesnym stosowaniu opcji ukrywania ich podkreślenia, może spowodować, że starsi użytkownicy nie będą mogli w prosty sposób zidentyfikować co jest donośnikiem, a co tekstem zasadniczym); w końcu też wielkość elementów klikalnych.

GM: Czy o podobnym rozróżnieniu można mówić w przypadku podziału na płeć? Czy mężczyźni oczekują innych – zapewniających funkcjonalność – elementów niż kobiety? Czy może na tej płaszczyźnie mamy do czynienia z równouprawnieniem i w przypadku obydwu płci sprawdzają się podobne rozwiązania dotyczące użyteczności?

MK: Nie znam żadnych sensownych i zarazem wiarygodnych badań w zakresie różnic w płci co do oczekiwań funkcjonalnych, czy użytecznościowych.

GM: Budując serwis na jego wygląd duży wpływ chcą mieć marketerzy. Jakie elementy najczęściej chcą oni wdrażać i zmieniać?

MK: Czerwone przyciski z wielkim napisem KUP 🙂 Tak, marketerzy uwielbiają myśleć, że czerwony sprzedaje i pragną myśleć, że umieszczenie jak największej ilości dużych czerwonych przycisków z napisami Kup, Kup, Kup, przyczyni się do zwiększenia konwersji.

Oczywiście kolor czerwony faktycznie powoduje zwiększenie uwagi na te elementy, ale jest to zwykła reakcja mająca podstawy psychofizjologiczne i nie przekładająca się w żaden sposób na zwiększenie sprzedaży. Po prostu w świecie przyrody kolor czerwony jest nośnikiem informacji na temat potencjalnego zagrożenia, stąd niektóre zwierzęta wykorzystują go także na zasadzie mimikry, a w ramach budowy interfejsu uzasadnione jest wykorzystywanie go wszędzie tam, gdzie mamy do czynienia z zawodnością systemu, jak np. komunikatach o błędach. Ale niektórzy są bardzo przywiązani do swoich przekonań. 🙂

GM: Jakie pomysły marketerów są nie do przyjęcia z punktu widzenia usability?

MK: Nie spotkałem jeszcze takiego marketera 🙂 Na razie wszystkie były do przyjęcia.

Mysz: 40 lat minęło…

Oceń tę pracę

Pierwszy raz mi się zdarza, bym na blogu zamieścił czyjś news (za PAP). Proszę mi wybaczyć, ale okoliczność zbyt ważna by jej nie odnotować, a czasu zbyt mało, by spłodzić swój tekst.

„Mysz komputerowa kończy dziś 40 lat. 9 grudnia 1968 roku amerykański wynalazca Douglas Engelbart po raz pierwszy skorzystał z myszy, by zaprezentować nową metodę pracy z komputerami.

Mysz, której Engelbart użył do demonstracji na konferencji komputerowej w San Francisco, była z drewna i miała tylko jeden przycisk. Prototyp wykonał inżynier Bill English z zespołu Engelbarta.

Dzięki swojemu wynalazkowi Engelbart mógł pokazać, w jaki sposób przenosić, kopiować i przyklejać pliki tekstowe, a także jak wykorzystywać sieci komputerowe np. przy wspólnym edytowaniu dokumentów.

Marzeniem Douglasa Engelbarta było uczynić z komputera pomocnika człowieka, który zwiększałby możliwości ludzkiej inteligencji; byłoby to o wiele trudniejsze i mniej efektywne bez zaproponowanych przez niego narzędzi.

Zaprezentowany na tej samej konferencji system NLS nadawał tym marzeniom realne kształty. System ten jako pierwszy wdrażał praktycznie łącza hipertekstowe, monitor, okna i właśnie mysz komputerową.

Z okazji jubileuszu w Kalifornii odbędą się uroczystości, w których udział weźmie wielu naukowców zaangażowanych w powstanie myszy.”

Na koniec – warto zapoznać się z prezentacją wideo jednej z pierwszych myszy (poniżej). Jest to fragment ze 100 minutowego (!) filmu, który stanowi dokument z prezentacji Engelbarta.

Aktualizacja: I ciekawy artykuł – „Myszka komputerowa i narodziny nowego świata” – uzupełniający powyższą notkę.

PS: A zainteresowanych zapraszam na nową wersję mojej strony firmowej ThinkLab, gdzie postarałem się zebrać najważniejsze informacje o firmie, w tym – ofercie.

Elementy nawigacji: Mega Drop-Down Menu

Oceń tę pracę

Przy okazji panelu dyskusyjnego w ramach ostatniego World of Usability Day we Wrocławiu padło pytanie z publiczności odnośnie menu, jakie zastosował Amazon.com w ramach swojej ostatniej odsłony (jak pamiętamy, wcześniej menu Amazona opierało się na słynnych zakładkach). Główny zarzut był taki, że to rodzaj menu kaskadowego, a przecież te doczekało się już wielu sowitych krytyk w ramach usability (chociaż ja znam też badania, które nie są aż tak krytyczne jak uwagi Nielsena z przed kilku lat). Zgodnie wówczas odrzekliśmy, że trudno teraz o jakiekolwiek spekulacje – czas pokaże.

Z projektu na projekt przekonywałem się, że menu jako takie coraz częściej ignorowane jest przez użytkowników i ma dość niski poziom używalności – użytkownicy serwisów, które badałem (np. metodą clikctrackingową) większość kliknięć oddawali w te rejony strony, gdzie była rozlokowana główna treść (content). W sumie jak pomyśleć, to dość oczywista obserwacja biorąc pod uwagę, że odwiedzając rozmaite strony WWW jesteśmy zainteresowani treścią, a nie jej umiejscowieniem w ramach serwisu. Skomplikowane strony, o dość niejasnej strukturze bądź mocno rozbudowanej, mają z tym problem. Ale wynika to raczej ze słabej architektury informacji na poziomie grupowania informacji, a nie z tego, że ludzie lubią menu.

Kolejny problem z menu wiąże się z faktem, że te nie powinny być zanadto rozbudowywane – stoi za tym niepodważalny argument o pojemności pamięci krótkoterminowej.

Przy serwisach o bardziej skomplikowanej strukturze, gdzie mamy do czynienia z kilkoma poziomami zagłębienia oraz zmieniającym się sposobem konsumowania internetu – coraz bardziej zwiększająca się liczba przekierowań z Google na podstrony w stosunku do odwiedzin bezpośrednich – dochodziły jeszcze kwestie związane z informowaniem użytkowników gdzie są w ramach całości witryny. Rozwiązaniem okazały się okruszki (breadcrumbs), które niejako tworzyły kolejne piętro nawigacji, w dodatku ich konstrukcja nie dla wszystkich użytkowników jest jasna (czy pokazują strukturę serwisu, czy ścieżkę nawigowania użytkownika w danym serwisie).

Powracając do Mega Drop-Down Menu – w pewnym sensie zostały też one wprowadzone do oprogramowania desktop, przy okazji Office 2007. Wspomina o tym m.in. Nielsen, który w artykule „Mega Drop-Down Navigation Menus Work Well” chwali skuteczność tego rozwiązania – także w zastosowaniu dla Weba.

Sam także przy kilku prowadzonych aktualnie projektach przekonuję [bądź udało już mi się przekonać] swoich klientów do tego typu rozwiązania, którego podstawową zaletą jest szybka dostępność do listy wyboru, na której powinny się znajdować zgrupowane opcje (niczym na mapie serwisu) oraz fakt, że znajdują się w jednym miejscu (pod jednym przyciskiem), a nie na wielu osobnych listach, bądź fatalnych rozwiązaniach zakładkowych stosujących menu drugiego poziomu (jeszcze w grono.net widziałem jak lichą ma to skuteczność, a przy źle odrobionej lekcji z grupowania, to jeśli nie jest to najgorsze rozwiązanie, to przynajmniej jedno z najgorszych – „do cholery, gdzie to jest”, myślę penetrując kolejne zakładki).

Mega drop-down menu nadaje się też świetnie przy rozbudowanych strukturach witryn. Można wtedy zastosować rozwiązanie, które przy okazji daje użytkownikowi wartość, jaką by uzyskał z bredcrambs. Poniżej trzy przykłady (w tym jeden już z rodzimego podwórka) takiego zastosowania, gdzie menu budowane jest na zasadzie okruszków – opcje widoczne – zaś pod głównym przyciskiem dostępne sa opcje pierwszego poziomu – rzecz jasna w ramach mega drop-down menu.

Oczywiście, jak pisał Lem, wszystko ma awers korzyści i rewers niepoznanych dotąd bied. Mega drop-down menu może także być nieużyteczny. Najczęstsze powody to:

  • zbyt rozbudowana wielkość samego menu, niemieszcząca się w jednym oknie przeglądarki i przez to wymagająca przewijania (na przykład element „Wszystkie kategorie” w serwisie Grrr, albo „Style” w SmartHistory);
  • źle oprogramowane warstwy, przez co menu po rozwinięciu zamiast znajdować się na wierzchu, to przykryte jest treścią strony;
  • w końcu – nie przemyślany dobór linków, a także zbyt duża liczba opcji, przy jednoczesnym braku jasnego ich zgrupowania.

Za około moesiącc w jednym z krajowych serwisów turystycznych zamiast aktualnie rozbudowanego menu znajdzie się jeden przycisk, a pod nim mega drop-down menu. W dalszej kolejności… ale na to jeszcze za wcześnie, by zdradzać. W każdym razie dwa kolejne serwisy z mega drop-down menu są już w kolejce. 🙂

Feng GUI: symulacja eyetrackingu?

Oceń tę pracę

Co pewien czas na rynku pojawia się nowe narzędzie wspomagające prace projektantów i badaczy zarówno z zakresu usability, jak User Centered Design. Praca z jednymi staje się standardem (vide Axure), inne odchodzą do lamusa (tak się trochę stało w przypadku programu IBM do cardsortingu – EZSort, które obecnie zastąpiły dużo sprawniejsze aplikacje).

Wciąż niektóre badania i sprzęt potrafią być bardzo drogie. Jednym z droższych (o ile nie najdroższym) urządzeniem wykorzystywanym w badaniach User Experience jest eyetracker (o samych badaniach ET pisaliśmy m.in. z Olą niedawno).

Niedawno ukazał się serwis online, w który umożliwia symulację procesów uwagi wzrokowej – Feng-GUI. Zasady funkcjonowania algorytmów Feng GUI zostały podane na stronie i przypominają z grubsza zasady pewnego modelu teoretycznego selektywnej uwagi typu bottom-up, autorstwa dwu wybitnych naukowców – Christofa Kocha oraz Shimona Ullmana. Pytanie, jak wiarygodne rezultaty daje program? By odpowiedzieć na to pytanie, w ramach prac działu MRM Experience wraz ze współpracownikami (Olą Słomińską i Anią Boguską-Torbicz), przeprowadziliśmy badanie kontrolne.

Szczegóły badania

W badaniu posłużono się eyetrackerem Tobii model T60 wraz z dedykowanym do niego oprogramowaniem Tobii Studio.

W badaniu uczestniczył operator i cztery osoby w roli respondentów. Wybrano 9 stron internetowych, które prezentowano każdej z osób w czasie 8 sekund dla jednej ekspozycji. Uzyskane wyniki podczas badania z użyciem eyetrackera porównano z wynikami uzyskanymi dla symulacji uwagi percepcyjnej, wg programu Feng GUI. Wyniki zaprezentowano poniżej.

***

Amazon.com

Król światowego e-commerce poszedł na pierwszy ogień. Widać, że w przypadku elementów o dużym kontraście, wyniki symulatora Feng GUI potrafią byś dość zbieżne z tymi, uzyskanymi podczas badania z żywymi użytkownikami – trafienia w produkty w części środkowej (robot Wall-E) oraz zdjęcie mężczyzny. Ale symulator nie pokazał bardzo istotnych elementów, wychwyconych już w badaniu z ludźmi: 1)nagłówke koło książki – produktu dnia – jest żywiej penetrowany faktycznie, niżby to wychodziło z symulacji (zresztą jest najgorętszym punktem); 2) w przypadku zdjęcia z mężczyzną, osoby patrzyły na jego twarz, a nie elementy graniczne zdjęcia, kontrastujące z białym tłem strony; 3) w końcu podczas żywej ekspozycji zarówno menu jak i logo, były penetrowane przez wzrok użytkowników – symulator tego nie pokazał.

CoJestGrane.pl

Serwis eventowy o negatywnym kontraście (ciemne tło, jasna czcionka). Na pierwszy rzut oka zadziwiająca dwa trafienia – pierwsze w lewej części górnego banera, drugie w prawej części strony, gdzie występuje pomarańczowy nagłówek. Trafienia staną się mniej zadziwiające, gdy spojrzeć na stronę – górna lewa część banera no mocno kontrastujący jasnozielony prostokąt, świetnie wyróżniający się zarówno na czarnym tle, jak i na ciemnym granatowym tle banera; żółcienie mają lepszy kontrast na czarnym tle, niż biel, stąd pomarańczowy nagłówek (a więc i większy rozmiar fontu) jest bardziej kontrastowy, niż blok białych napisów z nazwami miast.

Rozkład fiksacji na zdjęcia jest inny w przypadku symulacji oraz faktycznej percepcji strony przez ludzi. Żywe osoby spostrzegają także część identyfikacyjną z adresem strony.

Fotka.pl

Grupa Fotka, to blisko 30% zasięg w Polsce i stałe miejsce w czołówce Megapanelu. Fotki widoczne – ale jakby na obu zrzutach nie te same i nie z tą samą uwagą. I znowu: w przypadku żywych osób penetrowane są regiony menu i identyfikacji strony – logo.

GoldenLine.pl

Jeden z czołowych serwisów społecznościowych w naszym kraju. Żywi użytkownicy dużo większą rolą przykuwali do części wyjaśniającej czym jest GoldenLine i do czego służy, niżby to wynikało z przeprowadzonej symulacji programu Feng GUI. Menu i elementy logowania także są dużo ważniejsze. I percepcja zdjęć potrafi się nie pokrywać.

MRM.pl

Strona agencji, w której przeprowadzono badania. Tu – w przypadku osób uczestniczących w badaniu – istotne stało się menu strony – czego symulacja w ogóle nie pokazała. Porównanie najbardziej gorących miejsc z badania i symulacji, pokazuje spore różnice.

Onet.pl

Trudno w Polsce robić badanie nie odnosząc się do Onetu 🙂 Z powyższych heatmap można wyciągnąć jednoznaczne wnioski – człowiek wie co dobre. Duże zdjęcie z artykułu dnia oraz część z wiadomościami bieżącymi, to czołowe miejsca na stronie wg prawdziwych oglądających stronę użytkowników. W przypadku symulacji, cała niemalże uwaga została przypisana banerowi.

Travian.pl

Chyba najbardziej popularna przeglądarkowa gra w naszym kraju, a wg Megapanelu na pewno najbardziej. Dla osób oglądających stronę z mapą gry, po zalogowaniu, dużo ważniejsze jest centrum mapy, niźli jej obrzeża, na co wskazuje symulacja. Nie wspominając o opcjach menu, które penetrowane przez użytkowników, w ogóle nie znajdują odzwierciedlenia w komputerowej symulacji Feng GUI.

Wyborcza.pl

Niedawny redesign strony i już przeprowadzone badanie… No, no 🙂

Prócz tego, że na obydwu heatmapach stwierdzono zwiększoną uwagę na zdjęciu głównym (chociaż w innych regionach!) oraz banerze reklamowym w prawej części strony, to pozostałe elementy w ogóle się nie zgadzają.

YouTube.com

YouTube wg statystyk ruchu w sieci, to obecnie 80% ruchu w Internecie. Ale mapy uwagi są tak rozbieżne w stosunku do siebie, że nawet nie ma potrzeby komentowania tego – wystarczy rzucić okiem.

Wnioski

Twierdzenie, że aplikacja w serwisie Feng GUI jest symulatorem uwagi percepcji wzrokowej, jest grubym nadużyciem. Wyniki otrzymane podczas badania są tak rozbieżne w stosunku do tych otrzymanych z użycia Feng GUI, że ich interpretacja nie jest w stanie dać projektantom wiedzy na temat faktycznego zachowania żywych użytkowników na stronie WWW. W przypadku prezentowania i badania zdjęć, dane wyszły tak samo rozbieżne.

Choć osobiście mocno wierzę w stochastyczne podłoże naszych procesów percepcyjnych, to zastosowane w symulatorze algorytmy, nie pozwalają uzyskać żadnej miarodajnej wiedzy i pozostawiają program Feng GUI tylko w sferze ciekawostki.

Feng GUI to narzędzie służące do analizy interfejsów użytkownika (UI) w kontekście symulacji procesu śledzenia ruchu oczu, znanego jako eyetracking. Używane głównie w badaniach nad użytecznością i projektowaniu interfejsów, Feng GUI pozwala na ocenę, jak użytkownicy będą postrzegać i wchodzić w interakcję z różnymi elementami interfejsu na ekranie, opierając się na założeniach dotyczących śledzenia wzroku.

Symulacja eyetrackingu w Feng GUI jest procesem modelowania, w jaki sposób użytkownicy będą patrzeć na różne obszary ekranu w zależności od ich układu oraz typowych wzorców ruchu oczu podczas interakcji z aplikacją. Narzędzie wykorzystuje algorytmy do przewidywania, które elementy UI będą najczęściej przyciągały uwagę użytkowników, bazując na rozmieszczeniu elementów, ich rozmiarze, kolorze i innych cechach wizualnych. Dzięki tej funkcji projektanci mogą testować swoje interfejsy bez potrzeby przeprowadzania kosztownych i czasochłonnych badań z wykorzystaniem rzeczywistego sprzętu do eyetrackingu.

Feng GUI oferuje także możliwość generowania map cieplnych (heatmaps), które wizualizują miejsca na ekranie, które najbardziej przyciągają wzrok użytkowników. Takie mapy mogą być wykorzystywane do optymalizacji interfejsów, np. poprzez poprawienie rozmieszczenia przycisków, zwiększenie kontrastu lub dostosowanie elementów do bardziej naturalnych ścieżek patrzenia użytkowników. Dzięki temu projektanci mogą lepiej zrozumieć, które elementy interfejsu są zauważane najpierw, a które mogą zostać przeoczone.

Symulacja eyetrackingu w Feng GUI ma również duże znaczenie w testowaniu efektywności interfejsu w kontekście jego ergonomii i użyteczności. Pozwala to na dostosowanie elementów do rzeczywistych oczekiwań użytkowników, eliminując potencjalne problemy związane z niską intuicyjnością czy układem interfejsu. Narzędzie to, mimo że symuluje proces śledzenia ruchu oczu, nie jest w stanie zastąpić prawdziwego eyetrackingu w przypadku bardziej szczegółowych badań. Jest to jednak wygodna opcja dla projektantów, którzy chcą szybko iterować swoje projekty i uzyskać ogólne wskazówki dotyczące percepcji wizualnej użytkowników.

Feng GUI stanowi skuteczne narzędzie do wstępnej analizy efektywności interfejsu użytkownika w kontekście śledzenia ruchu oczu. Dzięki temu projektanci mogą optymalizować rozmieszczenie elementów, testować różne warianty układów i szybciej poprawiać design, zanim przejdą do bardziej zaawansowanych, kosztownych testów z wykorzystaniem prawdziwego sprzętu do eyetrackingu.