Tytu: Smashing Book #2 Tumaczenie: Julia Szajkowska ISBN: 978-83-246-3549-8 Translation copyright Helion 2012 All rights reserved 2011 Smashing Media GmbH All Rights Reserved. Authorised translation from the English language edition published by John Wiley & Sons Limited. Responsibility for the accuracy of the translation rests solely with Helion S. A. and is not the responsibility of John Wiley & Sons Limited. No part of this book may be reproduced in any form without the written permission of the original copyright holder, John Wiley & Sons Limited. Wiley and the Wiley Publishing logo are trademarks or registered trademarks of John Wiley and Sons, Inc. and/or its affiliates in the United States and/or other countries, and may not be used without written permission. iPhone, iPad, and iPod are trademarks of Apple Computer, Inc. All other trademarks are the property of their respective owners. Wiley Publishing, Inc. is not associated with any product or vendor mentioned in the book. This book is not endorsed by Apple Computer, Inc. Wszelkie prawa zastrzeone. Nieautoryzowane rozpowszechnianie caoci lub fragmentu niniejszej publikacji w jakiejkolwiek postaci jest zabronione. Wykonywanie kopii metod kserograficzn, fotograficzn, a take kopiowanie ksiki na noniku filmowym, magnetycznym lub innym powoduje naruszenie praw autorskich niniejszej publikacji. Wszystkie znaki wystpujce w tekcie s zastrzeonymi znakami firmowymi bd towarowymi ich wacicieli. Autor oraz Wydawnictwo HELION dooyli wszelkich stara, by zawarte w tej ksice informacje byy kompletne i rzetelne. Nie bior jednak adnej odpowiedzialnoci ani za ich wykorzystanie, ani za zwizane z tym ewentualne naruszenie praw patentowych lub autorskich. Autor oraz Wydawnictwo HELION nie ponosz rwnie adnej odpowiedzialnoci za ewentualne szkody wynike z wykorzystania informacji zawartych w ksice. Wydawnictwo HELION ul. Kociuszki 1c, 44-100 GLIWICE tel. 32 231 22 19, 32 230 98 63 e-mail: helion@helion.pl WWW: http://helion.pl (ksigarnia internetowa, katalog ksiek) Drogi Czytelniku! Jeeli chcesz oceni t ksik, zajrzyj pod adres http://helion.pl/user/opinie/smash2 Moesz tam wpisa swoje uwagi, spostrzeenia, recenzj. Printed in Poland.

Kup ksik Pole ksik Oce ksik

Ksigarnia internetowa Lubi to! Nasza spoeczno

Spis treciZasady projektowania grafiki doskonaej Znaczenie projektu. Rnice midzy dobrymi izymi projektami. Projekty ponadczasowe. Minimalizm relacyjny. Kontrast, pustka, napicie. Typografia. Jzyk obrazu. Widoczne kontra niewidoczne Dostrzeganie wprojektach tego, co niewidoczne. Projektowanie zgodne zprzebiegiem myli uytkownika. Modele mylenia. Toczno czy przejrzycie? Wzory projektw iwskazwki dotyczce interfejsu. Projektowanie zmyl ourzdzeniach przenonych Programy dedykowane kontra aplikacje internetowe. Projektowanie isprzedawanie aplikacji. Waciwoci oprogramowania na urzdzenia przenone. Zasady tworzenia dobrych programw. Interfejs uytkownika waplikacjach na urzdzenia przenone. Wygld aplikacji dla urzdze przenonych. Szkice, szablony iprototypy Proces projektowania. Wizualizacja we wstpnym szkicu. Zapis stosowany wszkicach. Rozrysowywanie kadrw. Techniki inarzdzia. Szablony mao szczegowe ibardzo szczegowe. Prototypy. Testy iostatnie poprawki. Znaki ostrzegawcze wprojektowaniu aplikacji internetowych Projektowanie zmyl odalszym rozwoju, nie na potrzeby chwili. Nie projektuj dla siebie. Dlaczego HTML iCSS schodz na psy? Malowanie wHTML izawioci skadni CSS. Problemy ze skryptami JavaScript idziaaniem aplikacji po stronie serwera. Przyszo typografii wsieci Rozwj typografii winternecie. Regua @font-face. WOFF. Ruch na rzecz uwolnienia krojw pisma. Licencjonowanie fontw. Usugi zwizane zinternetowymi krojami pisma. Palce problemy sieciowej typografii. Funkcje OpenType izaawansowane zagadnienia typografii internetowej. Modu fontw wCSS3. Nasi rozmwcy. 13

47

71

103

131

171

Kup ksik

Pole ksik

Reguy projektowania gier wplanowaniu interakcji iuytecznoci aplikacji czenie psychologii spoecznej, teorii projektowania gier iekonomii. Podgldacze. Ograniczony altruizm. Oczekiwana wzajemno. Wet za wet. Malejca uyteczno. Mechanika gier wiat, gracze izasady. Zwyciskie strategie dla uytkownikw iprzedsibiorstw. Podrcznik projektanta istrategie projektowania. Techniki projektowania gier poparte przykadami zycia. Co sprawia, e klikaj? Psychologia zachowa uytkownikw iprojektowania aplikacji internetowych Rne spojrzenia na zagadnienie projektowania. Znaczenie oddziaywa spoecznych. Niewiadome podejmowanie decyzji. Weryfikacja spoeczna. Efekt przyspieszenia ucelu. Rozpraszanie sposobem zwracania uwagi. Zaspokorczanie. Wzorce mylowe. Obsuga bdw. Niezamierzona nieuwaga. Wzorce projektowe wykorzystywane na stronach e-commerce (studia przypadkw) Ukad. Architektura informacji. Nawigacja. Kolorystyka. Towary, dokonywanie zakupw istrony koszyka. Nazewnictwo stosowane na przyciskach iwzory projektw. Projektowanie stron pomocy ikontaktu. Bezporednie dziaania marketingowe. Jak wyda ksik (tak jak ta)? Wydawa na wasn rk czy szuka wydawnictwa? Pisanie, redagowanie iprzygotowywanie do druku. Ceny, dziaania marketingowe ikolporta. Ksiki wwersji elektronicznej: PDF, EPUB, Mobipocket. Druk na yczenie. Skorowidz

219

253

273

317

353

Kup ksik

Pole ksik

Kup ksik

Pole ksik

Tematy poruszane w tym rozdziale: Rne spojrzenia na zagadnienie projektowania. Znaczenie oddziaywa spoecznych. Niewiadome podejmowanie decyzji. Weryfikacja spoeczna. Efekt przyspieszenia ucelu. Rozpraszanie sposobem zwracania uwagi. Zaspokorczanie. Wzorce mylowe. Obsuga bdw. Niezamierzona nieuwaga. Znacie moe opowie osoniu? rl wezwa do siebie najbardziej zaufanych doradcw, kaza zawiza im oczy ipoprowadzi ich do ciemnego pokoju. Opaski imrok panujcy wok sprawiy, e doradcy nie widzieli niczego. Wtem usyszeli swojego wadc: Powrciem zpodry do odlegej krainy iprzywiozem ze sob co niepodobne do niczego, co mielicie okazj widzie. To so. So? zdumieli si doradcy. Co to jest so? Dotknijcie isprbujcie opisa mi, czym jest so odpar krl. Pierwszy zdoradcw wycign rk iwymaca nog zwierzcia, natychmiast te odpar: So jest wielkim filarem. Drugi zdoradcw powtrzy gest pierwszego ichwyci ogon sonia. Pochwili ogosi: So to rodzaj liny. Nastpny doradca wyczu brzuch sonia, zastanowi si istwierdzi: So to taki mur. Ostatni zdoradcw chwyci sonia za trb, po czym orzek: So to nowy projekt rury. Mimo e wszyscy macie nieco racji, kady zwas jest wbdzie odpar krl dotykalicie bowiem jedynie fragmentw sonia.

K

Zawsze, gdy zastanawiam si nad tym, jak ludzie wywodzcy si zrnych rodowisk, majcy rne wyksztacenie iodmienne dowiadczenia postrzegaj prac projektanta, przypomina mi si ta historyjka. Inaczej do tego zagadnienia podejdzie grafik, inaczej projektant interakcji, ajeszcze inaczej programista. Poza nimi mamy jeszcze waciciela firmy, architekta informacji i cay sztab innych ludzi. Kady z nich dorasta winnym rodowisku, dowiadcza czego innego iodebra inne wyksztacenie, dlatego te obiektem jego uwagi stanie si jeden, wski aspekt projektu. Warto jednak pamita, e dostrzeenie innego ni zwykle fragmentu budowy projektu moe by niezwykle pomocne. Zwyksztacenia jestem psychologiem, pracuj te czynnie wswoim zawodzie, co sprawia, e postrzegam kwesti projektowania przez pryzmat wzorcw mylowych, jakie funkcjonuj wumyle uytkownika. Niewane, czy mam do czynienia zopro-

254

Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych

Kup ksik

Pole ksik

gramowaniem, stron internetow, aparatur medyczn, instrukcj obsugi, czy opakowaniem towaru, zawsze postrzegam je zpunktu widzenia psychologa. Przyznam, e lubi stosowa t wiedz, by bada, wjaki sposb mylimy, uczymy si, bawimy ipracujemy. Wiedza wypywajca zwynikw bada iznajomoci ludzkiego umysu, informacje dotyczce sposobw zapamitywania czy dziaania zmysu wzroku oraz wiadomo kierujcych nami motywacji pozwalaj mi wysnuwa wnioski dotyczce zasad projektowania. Wrozdziale znajdziesz krtkie przedstawienie pogldw psychologa na kwestie zwizane ztym zagadnieniem.

Ludzie s zwierztami stadnymiWszyscy dziwimy si strasznie za kadym razem, gdy na horyzoncie pojawiaj si nowe narzdzia porozumiewania si za porednictwem internetu. Uruchomienie serwisw MySpace iFacebook byo ogromnym zaskoczeniem, to samo powtrzyo si wprzypadku serwisu Twitter. Zastanawialimy si, po co nam to, dlaczego ktokolwiek miaby uywa czego takiego. Byy to zupenie nowe rozwizania, ich pojawienie si wywoao fal zdumienia, lecz bardzo szybko przyzwyczailimy si do korzystania znich. Okazao si, e uywa ich kilka milionw ludzi na caym wiecie, mimo e od ich uruchomienia min stosunkowo krtki czas. Nie doceniamy tego, jak wane dla kadego znas jest poczucie bycia czci jakiej spoecznoci. Zapominamy, e jestemy zwierztami stadnymi. Ludzie wykorzystaj wszystkie narzdzia, rwnie technologi, byle tylko mc porozumie si zreszt grupy. Jeeli wymylie nowy sposb porozumiewania si za pomoc osigni techniki, nie wahaj si izrealizuj ten pomys, bo niewykluczone, e bdzie to kolejne przeomowe rozwizanie istaniesz si wacicielem fortuny liczcej miliony dolarw.

Wszystkie interakcje wsieci zaliczaj si do grupy interakcji spoecznychGdy ludzie usiuj nawiza ze sob kontakt, stosuj si do zasad iwytycznych waciwych dla interakcji spoecznych wdanej grupie. Wszyscy mamy oczekiwania dotyczce sposobu, wjaki bdzie przebiega takie zdarzenie, igdy kto pogwaci niepisane zasady, czujemy si niekomfortowo. Ten sam mechanizm dziaa wprzypadku utrzymywania interakcji poprzez sie. Otwierajc witryn internetow czy wypeniajc interaktywny formularz, zgry spodziewamy si okrelonych reakcji na podejmowane dziaania. Wiele spord tych oczekiwa jest odzwierciedleniem przyzwyczaje nabytych przez nas przez lata utrzymywania stosunkw zinnymi ludmi. Jeeli strona nie reaguje na nasze dziaania lub otwiera si zbyt dugo, czujemy si, jakbymy mwili do czowieka, ktry na nas nie patrzy lub nas ignoruje. Jeeli autorzy serwisu zbyt szybko poprosz odane osobiste, wikszo znas poczuje si,

Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych

255

Kup ksik

Pole ksik

jakby rozmwca zbyt szybko przeszed wrozmowie wsfer tematw bardzo osobistych. Gdy natkniemy si na serwis niezachowujcy informacji pomidzy sesjami, poczujemy si jak wczasie spotkania zkim, kto nie pamita, e si znamy.

Cukiernia Godiva ma szczcie oferowa towary prezentujce si na zdjciach wyjtkowo smakowicie (http://www.godiva.com)

Dlatego projektujc interfejs, powiniene pamita o rodzaju kontaktu, jaki chcesz nawiza, iwraeniu, jakie chcesz wywrze. Miej na uwadze, e kady etap pracy zaplikacj odzwierciedla zachowania interpersonalne, wic staraj si nie wykracza poza ramy dobrego wychowania iprzyjtych norm spoecznych.

Wikszo decyzji podejmujemy niewiadomieLubimy myle, e ludzki umys dziaa racjonalnie, awszelkie decyzje, jakie podejmujemy (na przykad dotyczce wyboru witryny, ktr chcemy odwiedzi, czy dokonania zakupu), opieraj si na logicznym toku rozumowania. Niestety, najnowsze badania dowodz czego przeciwnego wikszo decyzji podejmujemy w duej mierze niewiadomie. Wcigu minionej dekady przeprowadzono wiele dowiadcze majcych zgbi procesy zwizane zniewiadomym przetwarzaniem danych przez ludzki mzg. Badania przeprowadzane metod czynnociowego rezonansu magnetycznego (fMRI) pozwoliy nawet wskaza, ktre obszary mzgu bior czynny udzia wprocesach niewiadomego podejmowania decyzji. Gatunek ludzki wyksztaci na drodze ewolucji bardzo skuteczny mechanizm radzenia sobie zmilionami informacji spywajcych wcigu sekundy do mzgu. Oczy,256

Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych

Kup ksik

Pole ksik

uszy, nos, skra ikubki smakowe zbieraj dane wniewyobraalnie wielkich ilociach obecnie szacuje si, e mzg odbiera wcigu sekundy czterdzieci milionw sygnaw napywajcych poprzez nasze zmysy. Wiadomo te, e wiadomie potrafimy uwzgldni wrozwaaniach okoo czterdziestu znich jednoczenie. Zatem wikszo przyswajanych informacji zostaje przetworzona sprawnie iszybko, ale zupenie bez wiedzy czowieka. Mzg potrafi przetwarza dane i podejmowa decyzje, pozostawiajc swojego waciciela wniewiadomoci. To dobrze czy le? Mam si czu bezpiecznie czy wrcz przeciwnie? Da si to zje? Mona z tym uprawia seks? Czy to znajoma twarz? Czy ten czowiek mi grozi? Czy to w? Nie kontrolujemy tych procesw, ato one wpywaj ostatecznie na podjcie decyzji oklikniciu przycisku Kup teraz, otwarciu nowego odnonika, przeczytaniu akapitu tekstu czy zerwaniu negocjacji handlowych. Jeeli zaley Ci na zbudowaniu serwisu, ktry bdzie zajmujcy, przykuje uwag odwiedzajcych, zachci ich do dalszych dziaa iprzekona do podjcia okrelonych krokw, to poza odwoaniem si do czci mzgu odpowiedzialnej za logiczne mylenie (pat przedczoowy) musisz pobudzi do dziaania rdmzgowie (tak zwany umys emocjonalny) oraz gadzi mzg (zwany te pniem mzgu) orodki odpowiedzialne za przetwarzanie emocji oraz informacji dotyczcych niebezpieczestwa, kopulacji ipoywienia. Oto ciga, ktra pomoe Ci podj waciwe decyzje.

Pie mzgu analizuje wszystkie dane spywajce zotoczenia wposzukiwaniuinformacji dotyczcych poywienia, moliwoci kopulacji i rde zagroenia, dlatego nasz uwag przycigaj wszystkie obrazy, na ktrych pojawia si jedzenie, atrakcyjni ludzie lub sceny mroce krew w yach. Podobnie reagujemy na animacj oraz ruch wotoczeniu.

Aby utrzyma uwag odwiedzajcego na duej ni kilka sekund, musisz pobudzi do pracy jego rdmzgowie. Efekt ten osiga si, prezentujc rnego rodzaju historie lub wizerunki ludzkich twarzy (szczeglnie te, na ktrych maluj si jakie emocje).

Ludzie przyswajaj najlepiej te informacje, ktre podasz im wpostaci historii,postaraj si zatem korzysta moliwie czsto ztego rodka przekazu nawet jeli miayby to by wyjtkowo krtkie opowieci.

Uwag czowieka przycigaj inni ludzie, rwnie ich zdjcia. Na zdjciachpowinny pojawia si osoby atrakcyjne dla okrelonej grupy odbiorcw, wodpowiednim wieku, wzbudzajce sympati wygldem (strojem iinnymi elementami).

Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych

257

Kup ksik

Pole ksik

Na stronie domu mody Louis Vuitton znajdziemy zdjcia atrakcyjnych modelek patrzcych prosto wobiektyw (http://www.louisvuitton.com/fr)

Najlepiej wykorzystywa zdjcia osb patrzcych prosto wobiektyw, wystarczajco due, by byo wida na nich twarze.

Wprawdzie ludzie podejmuj decyzje niewiadomie, ale lubi uzasadnia jew logiczny sposb, by w razie potrzeby mc wyjani swoje postpowanie sobie iinnym. Wyjanienia te nie bd miay zapewne zbyt wiele wsplnego zrzeczywistymi pobudkami dziaa, jednak s ludziom potrzebne. Upewnij si zatem, e dajesz im odpowiedni wymwk, by mogli skorzysta zTwoich usug, narzdzi czy zasobw.

Ludzie szukaj wsparcia uinnych, gdy nie wiedz, co robiSkonno do podejmowania decyzji zuwzgldnieniem reakcji otoczenia okrela si mianem weryfikacji spoecznej. Zjawisko to jest od lat przedmiotem intensywnych bada. Latane iDarley przeprowadzili seri eksperymentw155 badajcych zachowanie ludzi wniejednoznacznych sytuacjach; celem byo sprawdzenie wpywu zachowa innych osb na zachowanie badanego. Badani byli proszeni na przykad owypenienie ankiety majcej rzekomo ocenia ich kreatywno. Osob poddawan eksperymentowi prowadzono do osobnego po155 B. Latane, J.M. Darley, The Unresponsive Bystander, Upper Saddle River, NJ, Prentice Hall 1970.258

Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych

Kup ksik

Pole ksik

Na stronie FIFA.com znajdziemy zdjcie przedstawiajce emocje towarzyszce wygranej (http://www.fifa.com)

mieszczenia, wktrym odpowiednio poinstruowani aktorzy udawali, e take wypeniaj testy. Badanym towarzyszyo od jednej do kilku osb. Gdy wszyscy wypeniali swoje testy, z otworw wentylacyjnych w pomieszczeniu zaczyna wydobywa si dym. Naukowcy chcieli dowiedzie si, czy badany zdecyduje si opuci pomieszczenie ipoinformowa kogo opotencjalnym zagroeniu, czy te pozostanie na miejscu, ignorujc niepokojce sygnay. Uczestnik badania nie wiedzia, czy wbudynku wybuch poar, wic znajdowa si wniejednoznacznej sytuacji.

Osoby oceniajce towary wwitrynie JR mog uzupeni ocen szerszym opisem (http://www.jr.com)Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych259

Kup ksik

Pole ksik

Aflac to firma ubezpieczeniowa, ktra na stronie internetowej zamieszcza zdjcia ihistorie swoich klientw (http://www.aflac.com)

Okazao si, e zachowanie uczestnikw eksperymentu zmieniao si w zalenoci od liczby osb znajdujcych si wpomieszczeniu. Im wicej osb wjego otoczeniu ignorowao zdarzenie, tym bardziej byo prawdopodobne, e badany postpi podobnie. Jeeli siedzia sam, szybko wychodzi, by powiadomi kogo owydobywajcym si zwentylacji dymie. Jeeli wpokoju znajdoway si inne osoby, ktre nie reagoway na dym, badany take nie podejmowa adnych dziaa. W sieci zjawisko weryfikacji spoecznej daje si obserwowa w dziaach ocen produktw. Jeeli nie wiemy, na co si zdecydowa, chtnie uciekamy si do opinii wygaszanych przez inne osoby. Opinie wywierajce najwikszy wpyw na uytkownika maj kilka cech wsplnych.

Zawieraj poza wartoci podan na skali kilkuzdaniowy opis towaru. Imwicej bdzie wnim informacji, tym chtniej ludzie uwierz wtre.

S podawane wpostaci opowieci. Wszelkie historie silniej przemawiaj donaszej wyobrani, poniewa s lepiej przyswajane przez rdmzgowie. Jeli chcesz zachci ludzi do dziaania, nie zapomnij o umieszczaniu na stronach serwisu ocen, recenzji iwyzna uytkownikw.

Zaufanie ludzi zdobywa si (lub traci) wuamku sekundyKady, kto odwiedza Twoj stron internetow, musi podj pewne decyzje jej dotyczce ocenia, jakim zagadnieniom jest ona powicona, czy mu si podoba, czy pozostanie na niej duej iczy powinien zaufa zamieszczonym na niej informacjom. Tego rodzaju decyzje zapadaj bardzo szybko, wniektrych przypadkach nie trwa to

260

Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych

Kup ksik

Pole ksik

nawet sekundy. Zazwyczaj te s to decyzje zupenie niewiadome. Teoria B.J. Fogga156 dotyczca zaufania, jakim obdarzamy serwisy internetowe, zakada, e wszelkie decyzje dotyczce naszej oceny stron podejmowane s na podstawie pobienej oceny wygldu interfejsu. Oto niektre z czynnikw powodujcych spadek zaufania do zawartoci witryny:

Brak wyrwnania iuporzdkowania tekstu. Wyrodkowanie zamiast wyrwnania do lewego marginesu oraz kilka rnych szerokoci marginesw wobrbie jednej strony.

Wykorzystywanie zbyt wielu krojw pisma izbyt wielu rozmiarw fontw.Zbyt wiele fragmentw tekstu wyrnionych kolorem.

Zbyt wiele informacji stoczonych na jednej stronie. Zbyt wiele animacji, szczeglnie tych utrzymanych wstarym stylu. Zbyt wiele kolorw na stronie ibrak ustalonego motywu kolorystycznego.

Strona powicona finansom, The Mint, pozwala wybra cel gromadzenia oszczdnoci, anastpnie prezentuje wizualnie, na mierniku stylizowanym natermometr, jak blisko masz do tego celu (https://www.mint.com)

Podsumowujc, jeli chcesz, by strona budzia zaufanie, nie am podstawowych zasad projektowania interfejsu iunikaj niespjnoci, ktre mogyby sprawi, e uytkownik poczuje si niepewnie lub nie potraktuje Twojej oferty powanie. Nie bdziesz mie zbyt wielu okazji, by ponownie zdoby zaufanie odwiedzajcego, wic nie zmarnuj pierwszej szansy.

156 B.J. Fogg, Prominence-Interpretation Theory: Explaining How People Assess Credibility Online, Conference on Human Factors in Computing Systems, CHI: 2003.Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych261

Kup ksik

Pole ksik

Ludzi motywuje pierwszestwoDaniel Pink w ksice Drive. Kompletnie nowe spojrzenie na motywacj wyjania, jak bardzo motywujcym czynnikiem wyciu czowieka jest osignicie pierwszestwa157. Ludzie lubi mie przekonanie, e si rozwijaj izdobywaj nowe wiadomoci lub opanowuj jak umiejtno. Przekonanie to rodzi si wnich wraz zwraeniem, e wykonuj postpy wdanej dziedzinie. Ran Kivetz, Oleg Urminsky iYuhuang Zheng158 przeprowadzili badania dotyczce motywacji, koncentrujc si w nich na zagadnieniach zwizanych z obsug aplikacji internetowych. Jedno z dowiadcze przewidywao odwiedzanie witryny pozwalajcej ocenia utwory muzyczne. Okazao si, e ludzie chtniej wracaj na jej strony iczciej oceniaj utwory, gdy zaczynaj zblia si do progu uprawniajcego do odbioru nagrody. To tak zwany efekt przyspieszenia ucelu. Efekt ten zosta opisany po raz pierwszy przez Clarka Hulla w1934 roku. Hull prowadzi badania na szczurach, polegajce na przeprowadzaniu zwierzt przez labirynt, na ktrego kocu czekaa je nagroda wpostaci jedzenia. Analizujc wyniki, Hull odkry, e szczury zaczynaj biec szybciej, gdy zbliaj si do wyjcia zlabiryntu. Efekt przyspieszenia u celu odpowiada take za nasze zachowanie, nakazujce zwiksza poziom aktywnoci, gdy widzimy nagrod wzasigu rki. Dziaanie pod jego wpywem charakteryzuje si kilkoma cechami.

Im bliej celu, tym wiksz motywacj bd odczuwa ludzie dcy do niego. Efekt pojawia si nawet wtedy, gdy progres jest jedynie iluzoryczny. Motywacja spada natychmiast po odebraniu nagrody.To wanie moliwo zajcia pierwszej pozycji napdza tak bardzo popularno gier. Wczasie prb osignicia wyszego poziomu umiejtnoci ludzie popadaj wuzalenienie. Wprawdzie witryna internetowa to nie gra, ale zawsze moesz prbowa wple wjej projekt elementy sugerujce moliwo osignicia wyszego poziomu wjakiej dziedzinie. Jak dugo uytkownicy bd mogli stawia sobie nowe cele iobserwowa postp wdrodze do celu, tak dugo bd angaowa si dziaanie serwisu iczu motywacj, by do niego wraca.

157 D. Pink, Drive. Kompletnie nowe spojrzenie na motywacj, Studio EMKA 2011. 158 R. Kivetz, O. Urminsky, Y. Zheng, The Goal-Gradient Hypothesis Resurected: Purchase Acceleration, Illusionary Goal Progress, and Customer Retention, Journal of Marketing Research, marzec 2006, vol. XLIII, nr 39, s. 39 58.262

Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych

Kup ksik

Pole ksik

Uwaga ludzi atwo si rozpraszaNawet gdy zajmujemy si powanymi sprawami, bardzo atwo przychodzi nam porzucanie ich na rzecz pustego klikania kolejnych odnonikw iprzegldania losowo wybieranych stron internetowych, mimo e do pierwotnego celu prowadzia bardzo prosta droga. Mona stwierdzi, e za rozpraszanie uwagi wczasie przegldania zawartoci stron internetowych odpowiadaj trzy czynniki. Pie mzgu. Najstarsza ewolucyjnie cz mzgu skupia si na badaniu otoczenia wposzukiwaniu poywienia, moliwoci kopulacji oraz ewentualnych rde zagroenia, wic pojawienie si wzasigu wzroku ktregokolwiek ztych czynnikw natychmiast odwrci nasz uwag. Widzenie obwodowe. Budowa ludzkiego oka umoliwia dwa rodzaje widzenia centralne iobwodowe. Widzenie centralne pozwala nam patrze bezporednio na przedmioty idostrzega szczegy ich budowy. Widzenie obwodowe zachodzi wpozostaym obszarze pola widzenia, pozwala dostrzega wszystko, na co nie spogldamy bezporednio. Teoria ewolucji wyjania ten fenomen nastpujco to dziedzictwo genetyczne naszych przodkw, gdy zdoali przetrwa tylko ci, ktrzy potrafili dostrzec lwa, ostrzc krzemie lub spogldajc wniebo. Oznacza to, e widzenie obwodowe zawsze odgrywao du rol wnaszym yciu. Wielozadaniowo czowieka to mit. Wielu ludzi jest przekonanych, e potrafi wykonywa kilka zada jednoczenie, ale wyniki bada pozbawiaj nas zudze nie potrafimy tego robi. Prowadzone od wielu lat testy psychologiczne potwierdzaj, e nie umiemy podejmowa kilku dziaa wjednej chwili. Potrafimy mwi, czyta, pisa isucha, anawet cakiem szybko przecza swoj uwag pomidzy tymi czynnociami, wic wydaje si nam, e mylimy wielozadaniowo, jednak rzeczywisto jest inna. Badania prowadzone przez Ir Hyman ijego wsppracownikw159 dowodz, e osoby rozmawiajce przez telefony komrkowe wczasie spacerw czciej wpadaj na innych ludzi idostrzegaj mniej szczegw wok siebie. Wdowiadczeniu bra udzia akrobata, ktry wstroju klowna jedzi wpewnym oddaleniu od badanego na jednokoowym rowerze. Okazao si, e osoby rozmawiajce przez telefon komrkowy rzadziej zauwaay niecodzienn posta wotoczeniu bd szybko oniej zapominay. Skutki tak atwego rozpraszania uwagi mog by dobre albo ze. Nie bdziesz mia problemw z przycigniciem uytkownika do wybranego obszaru strony, bo jego uwaga atwo si rozprasza. Natomiast zmuszenie ludzi do skupienia si na konkretnym elemencie strony jest zadaniem skomplikowanym. Rwnie zachcenie ludzi do odwiedzenia strony nie jest trudne, ale skierowanie159 I.E. Hyman Jr., S.M. Boss, B.M. Wise, K.E. McKenzie, J.M. Caggiano, Did You See the Unicycling Clown? Inattentional Blindness While Walking and Talking on aCell Phone, Applied Cognitive Psychology, 2009.Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych263

Kup ksik

Pole ksik

ich uwagi na wybrany fragment serwisu izatrzymanie ich tam na duej jest ju bardziej zoone, poniewa uwaga ta rozprasza si bardzo atwo. Dlatego warto pamita okilku sprawach.

Uwag przyciga kada forma ruchu, wideo, animacje ibanery nie namawiam bynajmniej do wstawiania wszdzie ruchomych reklam (aszczeglnie nie do uruchamiania ich bez wiedzy uytkownika), ale uwaam, e powiniene otym wiedzie.

Uwag rozpraszaj wszelkiego rodzaju zdjcia, na ktrych pojawiaj si ludzie, poywienie bd jakiekolwiek aluzje do seksu czy niebezpieczestwa.

Wszystkie migajce elementy bardzo irytuj, poniewa s stale wychwytywane przez mechanizm widzenia obwodowego. Wszystkie czynniki rozpraszajce uwag pozwol Ci przenie zainteresowanie uytkownika wwybrane miejsce, lecz gdy ju tego dokonasz, postaraj si je wyeliminowa.

Ludzie s leniwi znaturyLudzie zawsze staraj si wykona swoj prac najmniejszym moliwym nakadem rodkw. Dziesitki tysicy lat ewolucji nauczyy nas, e nasze szanse przetrwania wzrastaj, aycie jest przyjemniejsze, gdy oszczdzamy energi. Wiemy, e musimy powici pewn jej ilo, by zdoby rodki niezbdne do ycia, ale zbyt dugie uganianie si za nimi bdzie zwyk strat energii.

Zaspokojenie + wystarczanie = zaspokorczaniePrzecitny czowiek wwikszoci przypadkw dziaa na zasadzie wystarczajcego zaspokojenia. Wliteraturze spotyka si czsto angielskie okrelenie ukute przez Herberta Simona satisficing. Simon uy go do opisania mechanizmu podejmowania decyzji polegajcego na tym, e ludzie chtniej wybieraj rozwizania wystarczajce ni optymalne. Powodami takiego postpowania maj by przede wszystkim zbyt wysokie koszty prowadzenia penej analizy problemu wstosunku do spodziewanych zyskw oraz, co jest nie mniej istotne, czsto brak moliwoci jej przeprowadzenia. Zustale Simona wynika, e podejmujcy decyzje bardzo czsto nie maj wystarczajcych moliwoci poznawczych, by rozway wszystkie dostpne opcje. Std wniosek, e lepiej wybra opcj, ktra bdzie wystarczajco dobra, ni szuka najlepszego wdanej sytuacji rozwizania. Ajak wpywa to na zasady, ktrymi powinni kierowa si projektanci stron internetowych, programw komputerowych, towarw czy chociaby osoby ukadajce ankiety? Zaspokorczanie pozwala wycign kilka zaskakujcych wnioskw.264

Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych

Kup ksik

Pole ksik

Projektuj strony tak, by dao si je przebiec wzrokiem inie trzeba byo ich czyta. Steve Krug wNie ka mi myle! stosuje wanie ide wystarczajcego zaspokojenia, opisujc zachowania uytkownikw stron internetowych160. Waciciel witryny ma nadziej, e odwiedzajcy zapozna si zjej zawartoci wcaoci, ale wie, e zazwyczaj uytkownicy obrzucaj stron zdawkowym spojrzeniem (jeeli mamy nieco szczcia), szybko przebiegaj wzrokiem podane na niej informacje iklikaj pierwszy odnonik, ktry przykuje ich uwag icho troch przypomina to, czego szukaj. Za, e kady bdzie chcia i na skrty. Ludzie zawsze staraj si zrobi wszystko szybciej iwmniejszej liczbie krokw, szczeglnie jeli ich zadanie ma si powtarza. Jeeli odkrycie skrtu bdzie zbyt skomplikowane, pozostan przy starej metodzie. Czynnikiem decydujcym jest tu niespodziewanie przewidywany wysiek, jaki przyszoby im podj, by osign cel. Jeeli znalezienie skrtu wydaje si zbyt pracochonne, czowiek bdzie wola pozosta przy swoich przyzwyczajeniach (zaspokajajc swoje potrzeby jedynie wstopniu wystarczajcym). Korzystaj zwartoci domylnych. Uywanie wartoci domylnych minimalizuje wysiek, jaki musi podj odwiedzajcy stron, by osign zamierzone cele. Moesz na przykad wypeni za uytkownika pola nazwiska iadresu formularza interaktywnego dziki temu oszczdzisz mu pracy. Niestety, wie si ztym pewne ryzyko. Ludzie bardzo czsto nie zwaaj na ustawienia domylne, przez co zdarza si im zaakceptowa bdne dane. Zachowanie to take wie si zpotrzeb podejmowania wysiku. Jeeli zmiana ustawie domylnych wyda Ci si zbyt uciliwa, lepiej zrezygnuj zopcji podpowiadania. Ludzie ze wszelkich si staraj si wykona kade zadanie jak najmniejszym nakadem pracy ijednoczenie nie chc si przy tym zbytnio nudzi. Jeeli Twj projekt uwzgldni obydwa te aspekty ludzkiej natury, zdoasz stworzy witryn interesujc dla odwiedzajcych.

Ludzie posuguj si wzorcami mylowymiWyobra sobie, e nigdy nie widziae czytnika Kindle, aja wrczam Ci taki, mwic, e to urzdzenie do czytania ksiek. Jeszcze zanim go wczysz, bdziesz mia wgowie gotow ide tego, jak powinien dziaa. Wyobrazisz sobie, wjaki sposb ksika bdzie prezentowa si na ekranie, co ijak bdziesz mg zni zrobi. Wgowie zrodzi Ci si model przewracania kartek izakadania miejsca, wktrym skoczysz lektur. Wten sposb, mimo e nigdy nie

160 S. Krug, Nie ka mi myle! Oyciowym podejciu do funkcjonalnoci stron internetowych (wydanie II), Helion 2006.Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych265

Kup ksik

Pole ksik

czytae ksiki wczytniku Kindle, bdziesz mie gotowy wzorzec mylowy dziaania tego urzdzenia. Ksztat wzorca zaley od wielu czynnikw. Kto, kto mia ju kontakt z tego rodzaju urzdzeniami, wytworzy wasny wzorzec, inny od wzorcw ludzi, ktrzy syszeli oczytnikach, ale nigdy ich nie uywali, izupenie odmienny od wyobrae osb niewiedzcych nawet, czym jest Kindle. Jeeli w ostatnich latach czytae ksiki za pomoc iPada, bdziesz oczekiwa czego innego ni osoba, ktra nie miaa dotd do czynienia ze-bookami. Agdy ju dostaniesz czytnik Kindle do rk iprzeczytasz przy jego wykorzystaniu kilka ksiek, wzorzec mylowy samoczynnie ulegnie zmianie.

Wzorce mylowe to nic nowegoOwzorcach mylowych (winformatyce okrelanych te modelami mentalnymi) syszy si nieprzerwanie od przynajmniej dwudziestu piciu lat. Susan Carey definiowaa je wswojej publikacji z1986161 wnastpujcy sposb: Wzorzec mylowy opisuje ludzkie wyobraenia dotyczce zachodzenia pewnych procesw (to jest ludzkie wyobraenie otaczajcego nas wiata). Wzorce mylowe powstaj na bazie niepenej znajomoci faktw, minionych dowiadcze, a nawet przeczu. Pomagaj nam podejmowa dziaania i zachowywa si wdany sposb wnowych sytuacjach, atake wpywaj na nasze podejcie do kadego problemu iokrelaj sposb jego rozwizywania. Z punktu widzenia uytkownika interfejsu aplikacji internetowej wzorzec mylowy bdzie modelem przedstawiajcym wyobraenie tego uytkownika oprodukcie, zktrym ma wanie do czynienia. Oto kilka faktw na temat wzorcw mylowych.

Wzorce mylowe powstaj bardzo szybko, czasami jeszcze przed uyciem produktu lub usugi.

Wzorce ulegaj zmianom. Uytkownicy tworz wzorce mylowe na bazie swoich przeszych dowiadcze zpodobnymi towarami, na podstawie podejrze, opinii iobserwacji innych ludzi oraz wasnych dowiadcze zdanym produktem.

Wzorce mylowe pozwalaj nam przewidywa, jak zadziaa dane urzdzenie(bd aplikacja) ijak naley znim postpowa.

161 S. Carey, Cognitive Science and Science Education, American Psychologist, 1986, vol. 41, nr 10, s. 1123 1130.266

Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych

Kup ksik

Pole ksik

Wzorce mylowe kontra modele koncepcyjneAby zrozumie, jak wane wprocesie projektowania interfejsu s wzorce mylowe, musimy zrozumie, czym s modele koncepcyjne. Model koncepcyjny jest rzeczywistym modelem interfejsu uytkownika. Wrmy na chwil do przykadu iPada. Zamy, e masz pewne wyobraenie otym, wjaki sposb odbywa si lektura ksiki na takim urzdzeniu, domylasz si, jak bdzie ono dziaa ico moesz znim zrobi. Kiedy jednak usidziesz na kanapie ziPadem wrku, spotkasz si zmodelem koncepcyjnym czytnika ksiek. Bdzie ekran iprzyciski, awywietlane na ekranie elementy bd si przemieszcza. Model koncepcyjny to interfejs, zktrym masz do czynienia wtrakcie korzystania zproduktu162. Dlaczego zatem wprowadza wogle rozrnienie midzy tymi ideami? Powd jest prosty kada decyzja zwizana z uytecznoci aplikacji i dowiadczeniami uytkownika kci si lub pozostaje wzgodzie zjego wzorcem mylowym imodelem koncepcyjnym aplikacji. Oto kilka przykadw.

Jeeli model koncepcyjny nie bdzie zgodny zwzorcem mylowym, uytkownik uzna, e aplikacja jest skomplikowana wobsudze itrudno j opanowa.

Jeeli projektant nie uwzgldni wczasie pracy wymaga wzorca mylowego,aplikacja zapewne bdzie skomplikowana wobsudze itrudna do opanowania.

Jeeli zdanego towaru lub usugi korzysta kilka grup uytkownikw (na przykad ludzie, ktrzy wczeniej uywali czytnika Kindle, iludzie, ktrzy nigdy wczeniej nie czytali ksiek wwersji elektronicznej), amodel koncepcyjny zosta dostosowany do wzorca mylowego jednej znich, pozostae uznaj, e urzdzenie jest trudne wobsudze.

Jeeli model koncepcyjny nie zosta poprawnie opracowany iogranicza si doumoliwienia uytkownikowi korzystania ze sprztu, programw bd baz danych, prawdopodobnie nie bdzie zgadza si zwzorcem mylowym uytkownika, przez co uytkownik uzna, e urzdzenie jest trudne wobsudze.

Co si dzieje, gdy musisz zmieni wzorzec mylowy?Nie zawsze mona dostosowa si do wyobrae uytkownika. By moe wanie pracujesz nad czym zupenie nowym, co okae si punktem przeomowym wdanej dziedzinie. Wtakim przypadku uznasz zapewne, e musisz zmieni sposb mylenia uytkownika, dostosowa jego wzorzec mylowy do modelu koncepcyjnego, mimo e zazwyczaj postpuje si odwrotnie. Powody s banalne na przykad nikt, kto dotd czyta jedynie na papierze, nie bdzie wiedzia, jak dokadnie dziaa czytnik Kindle.162 Ide t przedstawi take Francisco Inchauste wrozdziale Widoczne kontra niewidoczne przyp. red.Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych267

Kup ksik

Pole ksik

To oczywicie nie zwalnia Ci zobowizku poznania wzorca mylowego, poniewa tylko wten sposb bdziesz mg zdecydowa, wktrych miejscach chcesz od niego odej iwjaki sposb nauczy uytkownika pracy zmodelem koncepcyjnym (anie tylko zsamym urzdzeniem). Etap nauki jest niezbdny, poniewa tylko tak moesz zbudowa nowy wzorzec mylowy lub przemodelowa stary, by uytkownik mg zastosowa go, zanim jeszcze zacznie obsugiwa urzdzenie. Nie mam tu wcale na myli uciliwych, wielodniowych szkole. Wzorzec mylowy mona zmieni wzaledwie kilka minut. Wystarczy zaprezentowa potencjalnemu nabywcy film demonstrujcy dziaanie czytnika, zanim urzdzenie trafi do jego rk. Chodzi przecie wycznie ozmian wzorca mylowego wsposb, ktry by pasowa do modelu koncepcyjnego urzdzenia.

Wszystko owzorcach mylowych imodelach koncepcyjnychWzorce mylowe imodele koncepcyjne odgrywaj wan rol wpracy projektanta interfejsu. Mona nawet zaryzykowa stwierdzenie, e wszystkie dziaania zwizane zosob uytkownika dotycz: 1. zrozumienia wzorca mylowego uytkownika (poprzez analiz zada, prowadzenie obserwacji, przeprowadzanie rozmw itd.), 2. projektowania modelu koncepcyjnego zgodnie z wzorcem mylowym (poprzez odpowiednie zaplanowanie funkcji interfejsu, wielokrotne wprowadzanie zmian, przeprowadzanie testw weryfikacyjnych). Sekret projektowania intuicyjnych interfejsw i tworzenia w ten sposb pozytywnych dozna uytkownika tkwi wdopasowaniu modelu koncepcyjnego do wzorca mylowego ludzi, ktrzy bd pracowa zdan aplikacj. Zrb to, awywoasz niezapomniane doznania uytkownika.

Ludzie popeniaj bdyLudzie myl si czsto, ale nie lubi popenia bdw. Sposb, wjaki strona internetowa reaguje na bdy, ma ogromny wpyw na to, czy ludzie chtnie do niej wracaj iczy j lubi. Miej na uwadze, e ludzie si myl, staraj si przewidzie ich bdy izastanw si, jak sobie znimi radzi. Unikaj bezsensownych powiadomie obdach. Opracowywanie powiadomie obdach zajmuje zapewne najmniej czasu iuwagi kadego projektanta aplikacji iby moe tak wanie powinno by. Ostatecznie najlepszym komunikatem obdach jest brak takowego (zakadam, e jest to rwnoznaczne zzaprojektowaniem systemu, wktrym nie da si popeni pomyki). Ale

268

Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych

Kup ksik

Pole ksik

jeeli pomyka jednak si zdarzy, naley poinformowa uytkownika otym, co nie zadziaao. Wyciu zawsze co musi si popsu. Wszyscy popeniamy bdy uytkownicy myl si, wprowadzajc dane, firmy popeniaj bdy, oferujc nie do koca sprawne oprogramowanie, aprojektanci tworz bezuyteczne aplikacje tylko dlatego, e nie rozumiej potrzeb uytkownikw. Jeeli jednak bdziesz przestrzega kilku zasad, uda Ci si ograniczy bdy do minimum.

Zastanw si, jakie bdy mog wystpi wczasie pracy zaplikacj. Postarajsi przewidzie wikszo znajczciej popenianych przez ludzi pomyek izaprojektuj witryn tak, by od razu reagowaa odpowiednio.

Nie pomijaj etapu tworzenia prototypu idaj go do przetestowania ludziom.Tylko wten sposb zdoasz pozna typowe sposoby pracy izorientujesz si, jakie bdy popeniaj uytkownicy. Krtko mwic, przeprowad test uytecznoci aplikacji.

Unikaj argonu wpowiadomieniach obdach. Komunikat powinien zawiera nastpujce informacje: (1.) e wystpi bd, (2.) jakiego rodzaju jest to bd, (3.) co uytkownik powinien zrobi, by go poprawi, (4.) gdzie moe znale obszerniejsze wyjanienia.

Uywaj strony czynnej istawiaj na bezporednio. Komunikat: Opaceniefaktury nie bdzie moliwe, jeeli data jej wystawienia nie przypadnie przed dat zapaty, jest mao czytelny. Zdecydowanie lepiej sprawdziaby si informacja: Ustaw dat patnoci faktury tak, by przypadaa przed dat jej wystawienia. Zaprojektowanie systemu, wktrym nie da si popeni bdw, jest bardzo trudne Powiedziaabym nawet, e niemoliwe. Wystarczy przypomnie sobie awarie reaktorw elektrowni atomowych na Three Mile Island, w Czarnobylu czy katastrof ekologiczn, ktrej sprawc byo British Petroleum. Pomyek naley unika tym bardziej, im wysze mog by koszty ich wystpienia. Jeeli masz do czynienia zsystemem, wktrym bdw naley unika za wszelk cen (dziaajcym na przykad welektrowni atomowej, wzakadach przemysu naftowego czy wplacwkach zaparatur medyczn), przygotuj si na przeprowadzanie dwu- lub nawet trzykrotnie wikszej liczby testw ni normalnie iznacznie intensywniejsze szkolenie osb pracujcych ztym systemem. Prby projektowania systemw niezawodnych s drogie inigdy nie kocz si zupenym powodzeniem. To wrodzona cecha ludzkiego umysu. Wszyscy popeniamy bdy.

Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych

269

Kup ksik

Pole ksik

Nie twrz bezsensownych komunikatw obdach, jak ten ze strony biblioteki (http://www.mcpl.us)

Patrze nie znaczy widzieProjektujc stron internetow, skupiamy si przede wszystkim na tym, na co bd patrze odwiedzajcy. Internet przecie oddziauje przede wszystkim na wzrok. Zakadamy, e odwiedzajcy powic czas na przygldanie si rnym elementom witryny ina tym zaoeniu budujemy mnstwo teorii. Jeden znajczciej wysuwanych wnioskw jest zupenie bezpodstawny zakada si, e czowiek widzi to, na co patrzy. Dwa oddzielnie prowadzone nurty bada dowiody, e ludzie nie widz tego, na co spogldaj. Pierwszy znich koncentruje si na porwnywaniu widzenia centralnego zwidzeniem obwodowym, drugi bada zjawisko niezamierzonej nieuwagi.

Widzenie centralne kontra widzenie obwodoweWiemy ju, e czowiek postrzega wiat za pomoc dwch odrbnych mechanizmw widzenia centralnego iwidzenia obwodowego. Badania prowadzone na Uniwersytecie Stanowym wKansas dowodz, e bodce dostarczane do mzgu za porednictwem widzenia obwodowego maj wiksze znaczenie, ni dotd sdzilimy163. Okazuje si, e istot scen rozgrywajcych si przed naszymi oczyma okrelamy wanie poprzez widzenie obwodowe. W czasie bada zaprezentowano uczestnikom seri fotografii przedstawiajcych obrazy znane zcodziennego ycia zdjcia kuchni czy pokojw. Na czci zdj obrzea byy nieostre, na pozostaych nieostry by rodek. Zdjcia prezentowano bardzo szybko, a nastpnie proszono uczestnikw badania, by opisali, co widzieli. Naukowcy odkryli, e ludzie potrafili rozpozna otoczenie prezentowane na zdjciach znieostrym rodkiem, lecz gdy to obrzea fotografii byy zamazane, uczestnicy nie mogli odrni kuchni od pokoju.163 A.L. Larson, L.C. Loschky, The Contributions od Central Versus Peripheral Vision to Scene Gist Recognition, Journal of Vision, 2009, nr 9 (10).270

Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych

Kup ksik

Pole ksik

Niezamierzona nieuwagaWswojej ksice The Invisible Gorilla panowie Chabis iSimons przedstawili wyniki bada powiconych zagadnieniu niezamierzonej nieuwagi. Wserii dowiadcze wykazali, e bardzo czsto nie dostrzegamy przedmiotw znajdujcych si dokadnie przed naszymi oczyma. Otoczenie bombarduje nas tak intensywnie bodcami wzrokowymi, e mzg wyksztaci mechanizm automatycznego izupenie niewiadomego decydowania, na ktre znich powinnimy zwraca uwag. Oko wychwytuje znacznie wicej, ni trafia do wiadomej czci naszego mzgu. Skoro, jak si okazao, widzenie obwodowe jest wpewnym sensie znacznie waniejsze ni widzenie centralne iskoro zdarza si nam patrze na pewne przedmioty iwogle nie rejestrowa ich obecnoci, to jak uwzgldni to wprojektowaniu aplikacji internetowych? Oto kilka konsekwencji wynikajcych zpowyszych teorii.

To, e kto spojrza na witryn, nie znaczy, e zwrci na ni uwag. To, e umiecisz co na stronie, nie znaczy, e wszyscy to zobacz. Wprawdzie ledzenie ruchu gaek ocznych dostarczyo bardzo interesujcychdanych, ale nie zapominajmy, e dotycz one przede wszystkim widzenia centralnego. Badania tego rodzaju nie ledz widzenia obwodowego, aponiewa patrzenie nie jest tosame zwidzeniem, nie podejmuj najwaniejszych decyzji wycznie woparciu odane dotyczce ruchu oka.

PodsumowanieNiezalenie od charakteru witryny, nad jak pracujesz, musisz pamita, e prdzej czy pniej trafi na ni osoba o zupenie innym sposobie mylenia. Pamitaj, e masz wasny obraz sonia. Jeeli chcesz zbudowa funkcjonaln, interesujc icenn zpunktu widzenia uytkownikw stron, postaraj si poszerzy t wizj iuwzgldni wniej wiedz zzakresu psychologii. Oto dziesi rzeczy, ktre warto wiedzie oludzkich charakterach.

Ludzie s zwierztami stadnymi. Czowiek podejmuje wikszo decyzji niewiadomie. Gdy ludzie nie wiedz, co zrobi, powtarzaj reakcje otoczenia. Ludzie decyduj si zaufa (bd nie) Twojej stronie wuamku sekundy. Ludzi motywuje ch osignicia jak najlepszej pozycji wrankingu. Uwaga czowieka rozprasza si wmgnieniu oka. Ludzie s znatury leniwi. Kady znas tworzy wzorce mentalne dziaania rnych rzeczy.Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych271

Kup ksik

Pole ksik

Ludzie popeniaj bdy. Patrze nie znaczy widzie.Bibliografia[1] S. Carey, Cognitive Science and Science Education, American Psychologist, 1986, vol. 41, nr 10, s. 1123 1130. [2] B.J. Fogg, Prominence-Interpretation Theory: Explaining How People Assess Credibility Online, Conference on Human Factors in Computing Systems, CHI: 2003. [3] I.E. Hyman Jr., S.M. Boss, B.M. Wise, K.E. McKenzie, J.M. Caggiano, Did You See the Unicycling Clown? Inattentional Blindness While Walking and Talking on aCell Phone, Applied Cognitive Psychology, 2009. [4] R. Kivetz, O. Urminsky, Y. Zheng, The Goal-Gradient Hypothesis Resurrected: Purchase Acceleration, Illusionary Goal Progress, and Customer Retention, Journal of Marketing Research, marzec 2006, vol. XLIII, nr 39, s. 39 58. [5] S. Krug, Nie ka mi myle! Oyciowym podejciu do funkcjonalnoci stron internetowych, Helion 2006. [6] A.M. Larson, L.C. Loschky, The Contributions of Central Versus Peripheral Vision to Scene Gist Recognition, Journal of Vision, 2009, nr 9 (10). [7] B. Latane, J.M. Darley, The Unresponsive Bystander, Upper Saddle River, NJ, Prentice Hall 1970.

oautorceRb to, co kochasz ico Ci porywa. Nie unikaj wyzwa intelektualnych. Znajd prac, ktr bdziesz kocha tak bardzo, e nie bdziesz mg doczeka si rano wyjcia zdomu. Susan Weinschenk ukoczya studia licencjackie na wydziale psychologii na Northeastern University wBostonie, anastpnie obronia prac magistersk idoktorat ztej samej dziedziny na uniwersytecie Penn State University wPensylwanii. Susan pracuje jako gwny specjalista do spraw ustalania strategii uytecznoci aplikacji wHuman Factors International. Od przeszo trzydziestu lat udziela si zawodowo, stosujc swoj wiedz do opisywania dowiadcze uytkownika, zagadnie uytecznoci oraz uwzgldniania czynnika ludzkiego wpracy urzdze iaplikacji. Wwolnym czasie chadza na przedstawienia teatralne, czyta, piewa wzespole jazzowym i piecze wasnorcznie chleb. Utrzymuje przy tym, e zakwas jest jak zwierztko trzeba go karmi codziennie. Susan zachca Czytelnikw do cigego poszerzania swojej wiedzy inieustannego projektowania im wicej zrobicie, tym lepsze osigniecie wyniki.

272

Co sprawia, e klikaj? Psychologia zachowa uytkownikw i projektowania aplikacji internetowych

Kup ksik

Pole ksik

SkorowidzA Academy, 28 Adobe, 22, 174, 214, 343, 344, Adobe Photoshop, 333 afordancja, 67 altruizm, 224 Anayian Vivien, 171, 218 animacja, 90 Anthologize, 346 Apple Pages, 345 architektura informacji, 280 Arden Paul, 22 Armitage, 39 B Bam Creative, 34 bezpieczestwo, 296 biblioteka IDE, 134 jQuery, 139, 154, 159 Boardley John, 176, 194, 215, 217 Boing Boing, 250 Bos Bert, 173 Bradley Steven, 273, 315 brainwriting, 110 Bezina David, 212 BrightBulb, 31 Bringhurst Robert, 33, 34, 172 Bringnull Harry, 111 Brodovitch Alexy, 18 Brooklyn Fare, 54 Brousseau Jon, 26 Brown Dan, 79 Brown Tim, 175, 177, 179, 185, 211, 217 budowanie wizi, 231 Buivenga Jos, 172, 183, 188, 196, 208, 217 Burkert Thomas, 352 Burton Snowboards, 50 burza mzgw, 110, 275 Buxton Bill, 128 C Carey Susan, 266, 267 Charchar Alexander, 45, 13 cie, 99 Coles Stephen, 172, 191, 193, 207, 208, 213, 214, 217 Convertbot, 91 cross-selling, 350 crowdsourcing, 248 CSS, 139, 140, 145, 148, 173, 176, 183, 184, 187, 197, 198, 199, czynnociowy rezonans magnetyczny, Patrz: fMRI D Dagget John, 174, 197, Dannaway Adham, 27, 32, Darley J.M., 258 de Len Inayaili, 188 Dewey John, 17, 18 diagram opisujcy stron, 79 Dobler Michael, 352 dostosowywanie, 230 DRM, 343, 346 spoeczne, 346 Drowned Studio, 32 druk na yczenie, 350 dziedziczenie, 67Skorowidz353

Kup ksik

Pole ksik

E e-book, 341 Edison Tomasz, 104 edytor WYSIWYG, 134 efekt przyspieszenia u celu, 262 Einstein Albert, 52 ekonomia, 222 ekran rozdzielczo, 278 szeroko, 278 EPUB, 341, 342, 343, 345, 351, etykieta, 84 EULA, 180, 181, 183, F filtr, 286 Flipboard, 65 fMRI, 256 Fogg B.J., 261 font, 34, 35, 36, TrueType, 174, 175, 178, Fontdeck, 176, 181, 189, 191, FontShop, 190 font-size-adjust, 204 font-stretch, 201 font-variant, 202 font-weight, 200 format Embedded OpenType Format, Patrz: format OpenType OpenType, 174, 175, 185, 188, 192, 197, 198, 199, PDF, Patrz: PDF TrueDoc, 174 TrueType, Patrz: font TrueType WOFF, 174, 175, 179, 181, 189, formularz zoony, 87

Foursquare, 247 Friedman Vitaly, 352 G Gill Bob, 20 gos, 19, 39, 42, 43 Google Chrome, 244 Google Font API, 191 Google Font Directory, 191 Goudy Frederic, 209 gra, 221, 227, 228, 246 ekonomiczna, 229 gracz, 230, 238 gradient, 98 grafik, 14, 20, 22, 23, 33, 43, 53, 109, 118, 133, 175, 220, 254, 333, 338 grafika internetowa, 14 ponadczasowa, 19 uytkowa, 14, 15, 17, 18, 30, 45, 52 grupowanie, 95 H Haas Nick, 14 Hadilaksono Caroline, 181, 182, 192, 206, 217 Heilmann Christian, 131, 170 Heller Steven, 18 heroiczno czynw, 231 Herrmann Ralf, 177, 179, 192, 198, 217 hinting, 180, 188, 196, 207 Hoffman Armin, 18 HTML, 138, 141, 143, 144, 147, 159, 176 klasa, 139 znacznik, 143

354

Skorowidz

Kup ksik

Pole ksik

Hugs for Monsters, 41 Hull Clark, 262 Hyman Ira E., 263 I IBM, 20 IKEA, 242 Inchauste Francisco, 69, 47, 267 InDesign, 331, 332, 335, 345 Interactive Sketching Notation, 113 interakcja, 220 interfejs uytkownika, 15, 51, 54, 59, 61, 67, 73, 256, 110, 133, 261, 267 API, 73 wiele w jednym, 88 interlinia, 34, 35 Irish Paul, 177, 185, 188 J Jgermeister, 245 JavaScript, 154, 155, 160 Jovanovic Janko, 103, 130 Jutoh, 345 K kanon Van de Graafa, 16 Kean Richmond , 40 Kew Jonatjan, 174 Kim Amy Jo , 228 Kivetz Ran, 262 Klee Paul, 18 Kolb Christoph, 219, 250 kolor, 20, 21, 289 kolporta, 338 komfort pracy uytkownika, 15, 134 kompatybilno wsteczna, 346 komunikat, 15

kontakt, 306 kontrast, 14, 21, 25, 28, 53, 92 koszty stae, 337 wydruku, 337 wysyki, 340 Kouwenhoven John, 62 krawd, 99 Krug Steve, 265 ksika, 318, 325, 330 cena, 347 elektroniczna, Patrz: e-book ukad, 331 L Latane B., 258 Le Cobusier, 18 Leming Tal, 174 Lennartz Sven, 352 Lifrieri Joe, 41, 42 Liga Przenonych Czcionek, 181, 192 Linowski Jakub, 113 Lubalin Herb, 18 M MacHeist, 231, 233 mapowanie myli, 110 Matter Herbert, 18 McCoy Katherine, 15 McGonigal Jane , 230 Meyers Kyle, 177, 189, 193, 195, 207, 209, 211, 217 Microsoft, 164, 174 Microsoft Word, 194, 331, 332 Miner Wilson, 209 minimalizm, 24, 29, 43 minimax, 249 Mobipocket, 341, 342, 343, 345

Kup ksik

Pole ksik

Skorowidz

355

model implementacji, 57 koncepcyjny, 267, 268 mentalny, 57, 266, Patrz te: wzorzec mylowy MVC, 162 projektanta, Patrz: model przedstawiany przedstawiany, 57 systemowy, Patrz: model implementacji Moholy-Nagy Lszl, 17, 18 moodboarding, 112 Mller Manuela, 352 Mller-Brockmann Josef, 18 myto projektowe, 58 N napicie, 27, 28 nawigacja, 284 breadcrumbs, 284, 288 Netscape, 173, 174 niebiaski wzrost, 231, 248 Nine Inch Nails, 239 O obraz, 15, 30 Old Spice, 245 OnA, 31 OpenIDEO, 248 OpenOffice, 33, 331, 332, 345 owietlenie, 98 OTTO, 239 ozdobnik, 21 P palcy optymizm, 231, 248 PayPal, 296

PDF, 332, 335, 343, 344, 345 Peters Yves, 183, 184, 189, 193, 207, 210, 217 Pink Daniel, 262 plik zamknity, 332 podgldacz, 222, 230, 248 poysk, 99 poprawno kodu, 279 portret, 30 powtarzalno, 93 prawo Hicka, 280 prepress, 333 program dedykowany, 72, 73, 77 partnerski, 348 programista, 54, 73, 74, 75, 83, 84, 85, 254, 109, 118, 132, 133 projekt, 16, 37, 48, 49, 58, 72, 104, 128, 129 jednego dnia, 19 jzyk, 16 zasady, 16 projektant grafiki, Patrz: grafik interakcji, 220, 237, 254 prototyp, 121, 128 przepyw, 59 przestrze, 27 negatywna, 14, 27, 41 przycisk opcji, 85, 86, 94, 291, 294 psychologia spoeczna, 222 QuarkXPress, 198, 332 R Ram Dieter, 49 Rand Paul, 17, 18, 20, 25, 29 reakcja, 228, 229, 247 recenzent merytoryczny, 325

356

Skorowidz

Kup ksik

Pole ksik

redaktor, 320, 338 regua, 151, 233, 250 trjpodziau, 21 wzorca F, 28 zotego podziau, 21 Reichenstein Oliver, 33, 175, 189, 194, 196, 216, 217 Rich Micah, 181, 192, 209, 210, 217 Richmond Kean, 40 rozdzielczo ekranu, 278, 333 rwnowaga, 21, 27 Rundle Mike, 71, 101 Rutheford Sue, 30 Rutter Richard, 176, 177, 179, 193, 196, 199, 205, 217 S satisficing, Patrz: zaspokorczanie siatka, 14, 16, 17, 21 Simon Herbert, 264 skala, 27 sklep internetowy, 274 Spool Jared, 50 SSL, 296 StackExchange, 64 Superbrothers, 250 szablon, 104, 116, 117, 118, 128, 327 szeroko ekranu, 276 szkic, 106, 108, 113 szyfrowanie danych, 297 rodki przekazu, 14 wiato, 21, 98 Tan Jon, 172, 177, 180, 191, 195, 196, 197, 199, 217 technika rkawic bokserskich, 111 sIFR, 173

technologia Cufn, 174 DirectWrite, 184, 195, 196 tekst, 136 tekstura, 97 teoria gier, 225, 235, 249 projektowania gier, 222 teoria barw, 14 testowanie, 125, 129 text-rendering, 205 Thomson Bradbury, 18 Tschichold Jan, 18 Typekit, 175, 176, 181, 189, 208, 215, typografia, 15, 19, 21, 33, 34, 38, 42, 172, 198, 206, 211, 213, 216 Typotheque, 190 U UI, Patrz: interfejs uytkownika Underworld Magazines, 22 Unicode, 181, 198, 199 UNIQLO, 242 upselling, 350 Urminsky Oleg, 262 urzdzenia mobilne, 72, 77, 78, 92, 99 UX, Patrz: komfort pracy uytkownika V Valuyskaya Lisa, 352 van Blokland Erik, 174 Van de Graaf, 16 Veer, 55 Vignelli Massimo, 194 W Walton Trent, 179, 206, 212, 217 Ward Matt, 45, 13

Kup ksik

Pole ksik

Skorowidz

357

Warde Beatrice, 36 Weingart Wolfgang, 18 Weinschenk Susan, 253, 272 weryfikacja spoeczna, 258 Widget, 251 widet, 73, 94, 242 Wood Alan, 198 Wowpedia, 232 Writer, 66 wspczynnik CR, 223 wydawnictwo, 319, 322 wygrana, 235 wymiana, 228, 229, 247

wyrwnanie, 94 wyszukiwanie, 286 wzorzec mylowy, 266, 267, 268 Y Y3K, 28 Z zakadka, 85, 87 zarabianie, 228, 229, 247 zaspokorczanie, 264 zbieranie, 228, 247 Zheng Yuhuang, 262

358

Skorowidz

Kup ksik

Pole ksik