Cyfroteka.pl

klikaj i czytaj online

Cyfro
Czytomierz
00151 005582 14269044 na godz. na dobę w sumie
The Smashing Book #2 - książka
The Smashing Book #2 - książka
Autor: Liczba stron: 360
Wydawca: Helion Język publikacji: polski
ISBN: 978-83-246-3549-8 Data wydania:
Lektor:
Kategoria: ebooki >> komputery i informatyka >> webmasterstwo >> funkcjonalność stron
Porównaj ceny (książka, ebook, audiobook).


Smashing Magazine
to marka znana w branży webowej na całym świecie. Profesjonalny blog o technologiach i projektowaniu stron, oferujący setki merytorycznych i aktualnych artykułów opartych na realnych przykładach, podbił serca milionów użytkowników. Pierwsza część 'Smashing Book' zdobyła wyjątkowe uznanie i popularność, a druga na 100% pobije tamten rekord!





Ta książka to zbiór praktycznych projektów, prześwietlonych pod względem użyteczności, designu i programowania.

Dziewięć genialnych rozdziałów zawiera wiedzę ważną dla każdego projektanta stron internetowych i aplikacji na urządzenia mobilne.



Poznasz zasady, jakich powinni przestrzegać graficy, najlepsze sposoby na przygotowanie prototypów stron WWW oraz możliwości CSS3 w zakresie typografii. Dowiesz się, jak powinien wyglądać porządny sklep internetowy, aby osiągnąć murowany sukces w sieci, oraz jak zachęcić użytkowników do klikania we właściwych (z Twojego punktu widzenia!) miejscach. Zrozumiesz swoich użytkowników, a wygodne rozwiązania, o których wcześniej nawet nie pomyślałeś, nagle staną się dla Ciebie oczywiste! Sięgnij po niekwestionowany autorytet w dziedzinie praktycznego i nowoczesnego podejścia do web designu.



Smashing Book #2. Kultowy podręcznik dla projektantów i twórców stron internetowych!


Patroni medialni:

Znajdź podobne książki Ostatnio czytane w tej kategorii

Darmowy fragment publikacji:

Tytuł: Smashing Book #2 Tłumaczenie: 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 zastrzeżone. Nieautoryzowane rozpowszechnianie całości lub fragmentu niniejszej publikacji w jakiejkolwiek postaci jest zabronione. Wykonywanie kopii metodą kserograficzną, fotograficzną, a także kopiowanie książki na nośniku filmowym, magnetycznym lub innym powoduje naruszenie praw autorskich niniejszej publikacji. Wszystkie znaki występujące w tekście są zastrzeżonymi znakami firmowymi bądź towarowymi ich właścicieli. Autor oraz Wydawnictwo HELION dołożyli wszelkich starań, by zawarte w tej książce informacje były kompletne i rzetelne. Nie biorą jednak żadnej odpowiedzialności ani za ich wykorzystanie, ani za związane z tym ewentualne naruszenie praw patentowych lub autorskich. Autor oraz Wydawnictwo HELION nie ponoszą również żadnej odpowiedzialności za ewentualne szkody wynikłe z wykorzystania informacji zawartych w książce. Wydawnictwo HELION ul. Kościuszki 1c, 44-100 GLIWICE tel. 32 231 22 19, 32 230 98 63 e-mail: helion@helion.pl WWW: http://helion.pl (księgarnia internetowa, katalog książek) Drogi Czytelniku! Jeżeli chcesz ocenić tę książkę, zajrzyj pod adres http://helion.pl/user/opinie/smash2 Możesz tam wpisać swoje uwagi, spostrzeżenia, recenzję. Printed in Poland. • Kup książkę • Poleć książkę • Oceń książkę • Księgarnia internetowa • Lubię to! » Nasza społeczność Spis treści Zasady projektowania grafiki doskonałej Znaczenie projektu. Różnice między dobrymi i złymi projektami. Projekty ponadczasowe. Minimalizm relacyjny. Kontrast, pustka, napięcie. Typografia. Język obrazu. Widoczne kontra niewidoczne Dostrzeganie w projektach tego, co niewidoczne. Projektowanie zgodne z przebiegiem myśli użytkownika. Modele myślenia. Tłoczno czy przejrzyście? Wzory projektów i wskazówki dotyczące interfejsu. Projektowanie z myślą o urządzeniach przenośnych Programy dedykowane kontra aplikacje internetowe. Projektowanie i sprzedawanie aplikacji. Właściwości oprogramowania na urządzenia przenośne. Zasady tworzenia dobrych programów. Interfejs użytkownika w aplikacjach na urządzenia przenośne. Wygląd aplikacji dla urządzeń przenośnych. Szkice, szablony i prototypy Proces projektowania. Wizualizacja we wstępnym szkicu. Zapis stosowany w szkicach. Rozrysowywanie kadrów. Techniki i narzędzia. Szablony mało szczegółowe i bardzo szczegółowe. Prototypy. Testy i ostatnie poprawki. Znaki ostrzegawcze w projektowaniu aplikacji internetowych Projektowanie z myślą o dalszym rozwoju, nie na potrzeby chwili. Nie projektuj dla siebie. Dlaczego HTML i CSS schodzą na psy? Malowanie w HTML i zawiłości składni CSS. Problemy ze skryptami JavaScript i działaniem aplikacji po stronie serwera. Przyszłość typografii w sieci Rozwój typografii w internecie. Reguła @font-face. WOFF. Ruch na rzecz uwolnienia krojów pisma. Licencjonowanie fontów. Usługi związane z internetowymi krojami pisma. Palące problemy sieciowej typografii. Funkcje OpenType i zaawansowane zagadnienia typografii internetowej. Moduł fontów w CSS3. Nasi rozmówcy. 13 47 71 103 131 171 Smashing Book.indd 8 2011-11-29 12:40:12 Reguły projektowania gier w planowaniu interakcji i użyteczności aplikacji Łączenie psychologii społecznej, teorii projektowania gier i ekonomii. Podglądacze. Ograniczony altruizm. Oczekiwana wzajemność. Wet za wet. Malejąca użyteczność. Mechanika gier — świat, gracze i zasady. Zwycięskie strategie dla użytkowników i przedsiębiorstw. Podręcznik projektanta i strategie projektowania. Techniki projektowania gier poparte przykładami z życia. Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych Różne spojrzenia na zagadnienie projektowania. Znaczenie oddziaływań społecznych. Nieświadome podejmowanie decyzji. Weryfikacja społeczna. Efekt przyspieszenia u celu. Rozpraszanie sposobem zwracania uwagi. Zaspokorczanie. Wzorce myślowe. Obsługa błędów. Niezamierzona nieuwaga. Wzorce projektowe wykorzystywane na stronach e-commerce (studia przypadków) Układ. Architektura informacji. Nawigacja. Kolorystyka. Towary, dokonywanie zakupów i strony koszyka. Nazewnictwo stosowane na przyciskach i wzory projektów. Projektowanie stron pomocy i kontaktu. Bezpośrednie działania marketingowe. Jak wydać książkę (taką jak ta)? Wydawać na własną rękę czy szukać wydawnictwa? Pisanie, redagowanie i przygotowywanie do druku. Ceny, działania marketingowe i kolportaż. Książki w wersji elektronicznej: PDF, EPUB, Mobipocket. Druk na życzenie. Skorowidz 219 253 273 317 353 Smashing Book.indd 9 2011-11-29 12:40:12 Smashing Book.indd 253 2011-11-29 12:40:42 Tematy poruszane w  tym rozdziale: Różne spojrzenia na zagadnienie projektowania. Znaczenie oddziaływań społecznych. Nieświadome podejmowanie decyzji. Weryfikacja społeczna. Efekt przyspieszenia u celu. Rozpraszanie sposobem zwracania uwagi. Zaspo- korczanie. Wzorce myślowe. Obsługa błędów. Niezamierzona nieuwaga. Znacie może opowieść o słoniu? Król wezwał do siebie najbardziej zaufanych doradców, kazał zawiązać im oczy i poprowadził ich do ciemnego pokoju. Opaski i mrok panujący wo- kół sprawiły, że doradcy nie widzieli niczego. Wtem usłyszeli swojego władcę: — Powróciłem z podróży do odległej krainy i przywiozłem ze sobą coś niepodobne do niczego, co mieliście okazję widzieć. To słoń. — Słoń? — zdumieli się doradcy. — Co to jest słoń? — Dotknijcie i spróbujcie opisać mi, czym jest słoń — odparł król. Pierwszy z doradców wyciągnął rękę i wymacał nogę zwierzęcia, natych- miast też odparł: — Słoń jest wielkim filarem. Drugi z doradców powtórzył gest pierwszego i chwycił ogon słonia. Po chwili ogłosił: — Słoń to rodzaj liny. Następny doradca wyczuł brzuch słonia, zastanowił się i stwierdził: — Słoń to taki mur. Ostatni z doradców chwycił słonia za trąbę, po czym orzekł: — Słoń to nowy projekt rury. — Mimo że wszyscy macie nieco racji, każdy z was jest w błędzie — odparł król — dotykaliście bowiem jedynie fragmentów słonia. Zawsze, gdy zastanawiam się nad tym, jak ludzie wywodzący się z różnych środowisk, mający różne wykształcenie i odmienne doświadczenia postrzegają pracę projektanta, przypomina mi się ta historyjka. Inaczej do tego zagadnienia podejdzie grafik, inaczej projektant interakcji, a jeszcze inaczej programista. Poza nimi mamy jeszcze właści- ciela firmy, architekta informacji i cały sztab innych ludzi. Każdy z nich dorastał w innym środowisku, doświadczał czegoś innego i odebrał inne wykształcenie, dla- tego też obiektem jego uwagi stanie się jeden, wąski aspekt projektu. Warto jednak pamiętać, że dostrzeżenie innego niż zwykle fragmentu budowy projektu może być niezwykle pomocne. Z wykształcenia jestem psychologiem, pracuję też czynnie w swoim zawodzie, co sprawia, że postrzegam kwestię projektowania przez pryzmat wzorców myślowych, jakie funkcjonują w umyśle użytkownika. Nieważne, czy mam do czynienia z opro- 254 Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych Smashing Book.indd 254 2011-11-29 12:40:42 gramowaniem, stroną internetową, aparaturą medyczną, instrukcją obsługi, czy opa- kowaniem towaru, zawsze postrzegam je z punktu widzenia psychologa. Przyznam, że lubię stosować tę wiedzę, by badać, w jaki sposób myślimy, uczymy się, bawimy i pracujemy. Wiedza wypływająca z wyników badań i znajomości ludzkiego umysłu, informacje dotyczące sposobów zapamiętywania czy działania zmysłu wzroku oraz świadomość kierujących nami motywacji pozwalają mi wysnuwać wnioski dotyczące zasad projektowania. W rozdziale znajdziesz krótkie przedstawienie poglądów psy- chologa na kwestie związane z tym zagadnieniem. Ludzie są zwierzętami stadnymi Wszyscy dziwimy się strasznie za każdym razem, gdy na horyzoncie pojawiają się nowe narzędzia porozumiewania się za pośrednictwem internetu. Uruchomienie serwisów MySpace i Facebook było ogromnym zaskoczeniem, to samo powtórzyło się w przypadku serwisu Twitter. Zastanawialiśmy się, po co nam to, dlaczego ktokolwiek miałby używać czegoś takiego. Były to zupełnie nowe roz- wiązania, ich pojawienie się wywołało falę zdumienia, lecz bardzo szybko przyzwy- czailiśmy się do korzystania z nich. Okazało się, że używa ich kilka milionów ludzi na całym świecie, mimo że od ich uruchomienia minął stosunkowo krótki czas. Nie doceniamy tego, jak ważne dla każdego z nas jest poczucie bycia częścią ja- kiejś społeczności. Zapominamy, że jesteśmy zwierzętami stadnymi. Ludzie wykorzy- stają wszystkie narzędzia, również technologię, byle tylko móc porozumieć się z resz- tą grupy. Jeżeli wymyśliłeś nowy sposób porozumiewania się za pomocą osiągnięć techniki, nie wahaj się i zrealizuj ten pomysł, bo niewykluczone, że będzie to kolejne przełomowe rozwiązanie i staniesz się właścicielem fortuny liczącej miliony dolarów. Wszystkie interakcje w sieci zaliczają się do grupy interakcji społecznych Gdy ludzie usiłują nawiązać ze sobą kontakt, stosują się do zasad i wytycznych wła- ściwych dla interakcji społecznych w danej grupie. Wszyscy mamy oczekiwania doty- czące sposobu, w jaki będzie przebiegać takie zdarzenie, i gdy ktoś pogwałci niepisane zasady, czujemy się niekomfortowo. Ten sam mechanizm działa w przypadku utrzy- mywania interakcji poprzez sieć. Otwierając witrynę internetową czy wypełniając interaktywny formularz, z góry spodziewamy się określonych reakcji na podejmo- wane działania. Wiele spośród tych oczekiwań jest odzwierciedleniem przyzwyczajeń nabytych przez nas przez lata utrzymywania stosunków z innymi ludźmi. Jeżeli strona nie reaguje na nasze działania lub otwiera się zbyt długo, czujemy się, jakbyśmy mówili do człowieka, który na nas nie patrzy lub nas ignoruje. Jeżeli autorzy serwisu zbyt szybko poproszą o dane osobiste, większość z nas poczuje się, Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych 255 Smashing Book.indd 255 2011-11-29 12:40:42 jakby rozmówca zbyt szybko przeszedł w rozmowie w sferę tematów bardzo osobi- stych. Gdy natkniemy się na serwis niezachowujący informacji pomiędzy sesjami, poczujemy się jak w czasie spotkania z kimś, kto nie pamięta, że się znamy. Cukiernia Godiva ma szczęście oferować towary prezentujące się na zdjęciach wyjątkowo smakowicie (http://www.godiva.com) Dlatego projektując interfejs, powinieneś pamiętać o  rodzaju kontaktu, jaki chcesz nawiązać, i wrażeniu, jakie chcesz wywrzeć. Miej na uwadze, że każdy etap pracy z aplikacją odzwierciedla zachowania interpersonalne, więc staraj się nie wykra- czać poza ramy dobrego wychowania i przyjętych norm społecznych. Większość decyzji podejmujemy nieświadomie Lubimy myśleć, że ludzki umysł działa racjonalnie, a wszelkie decyzje, jakie podej- mujemy (na przykład dotyczące wyboru witryny, którą chcemy odwiedzić, czy do- konania zakupu), opierają się na logicznym toku rozumowania. Niestety, najnowsze badania dowodzą czegoś przeciwnego — większość decyzji podejmujemy w dużej mierze nieświadomie. W ciągu minionej dekady przeprowadzono wiele doświadczeń mających zgłębić procesy związane z nieświadomym przetwarzaniem danych przez ludzki mózg. Badania przeprowadzane metodą czynnościowego rezonansu magne- tycznego (fMRI) pozwoliły nawet wskazać, które obszary mózgu biorą czynny udział w procesach nieświadomego podejmowania decyzji. Gatunek ludzki wykształcił na drodze ewolucji bardzo skuteczny mechanizm ra- dzenia sobie z milionami informacji spływających w ciągu sekundy do mózgu. Oczy, 256 Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych Smashing Book.indd 256 2011-11-29 12:40:42 uszy, nos, skóra i kubki smakowe zbierają dane w niewyobrażalnie wielkich ilościach — obecnie szacuje się, że mózg odbiera w ciągu sekundy czterdzieści milionów sy- gnałów napływających poprzez nasze zmysły. Wiadomo też, że świadomie potrafimy uwzględnić w rozważaniach około czterdziestu z nich jednocześnie. Zatem większość przyswajanych informacji zostaje przetworzona sprawnie i szybko, ale zupełnie bez wiedzy człowieka. Mózg potrafi przetwarzać dane i podejmować decyzje, pozosta- wiając swojego właściciela w nieświadomości. To dobrze czy źle? Mam się czuć bez- piecznie czy wręcz przeciwnie? Da się to zjeść? Można z tym uprawiać seks? Czy to znajoma twarz? Czy ten człowiek mi grozi? Czy to wąż? Nie kontrolujemy tych procesów, a to one wpływają ostatecznie na podjęcie decyzji o kliknięciu przycisku „Kup teraz”, otwarciu nowego odnośnika, przeczytaniu akapitu tekstu czy zerwaniu negocjacji handlowych. Jeżeli zależy Ci na zbudowaniu serwisu, który będzie zajmujący, przykuje uwagę odwiedzających, zachęci ich do dalszych działań i przekona do podjęcia określonych kroków, to poza odwołaniem się do części mózgu odpowiedzialnej za logiczne my- ślenie (płat przedczołowy) musisz pobudzić do działania śródmózgowie (tak zwany umysł emocjonalny) oraz gadzi mózg (zwany też pniem mózgu) — ośrodki odpo- wiedzialne za przetwarzanie emocji oraz informacji dotyczących niebezpieczeństwa, kopulacji i pożywienia. Oto ściąga, która pomoże Ci podjąć właściwe decyzje. • Pień mózgu analizuje wszystkie dane spływające z otoczenia w poszukiwaniu informacji dotyczących pożywienia, możliwości kopulacji i źródeł zagroże- nia, dlatego naszą uwagę przyciągają wszystkie obrazy, na których pojawia się jedzenie, atrakcyjni ludzie lub sceny mrożące krew w żyłach. Podobnie reagujemy na animację oraz ruch w otoczeniu. • Aby utrzymać uwagę odwiedzającego na dłużej niż kilka sekund, musisz po- budzić do pracy jego śródmózgowie. Efekt ten osiąga się, prezentując różnego rodzaju historie lub wizerunki ludzkich twarzy (szczególnie te, na których malują się jakieś emocje). • Ludzie przyswajają najlepiej te informacje, które podasz im w postaci historii, postaraj się zatem korzystać możliwie często z tego środka przekazu — nawet jeśli miałyby to być wyjątkowo krótkie opowieści. • Uwagę człowieka przyciągają inni ludzie, również ich zdjęcia. Na zdjęciach powinny pojawiać się osoby atrakcyjne dla określonej grupy odbiorców, w odpowiednim wieku, wzbudzające sympatię wyglądem (strojem i innymi elementami). Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych 257 Smashing Book.indd 257 2011-11-29 12:40:42 Na stronie domu mody Louis Vuitton znajdziemy zdjęcia atrakcyjnych modelek patrzących prosto w obiektyw (http://www.louisvuitton.com/fr) • Najlepiej wykorzystywać zdjęcia osób patrzących prosto w obiektyw, wystar- czająco duże, by było widać na nich twarze. • Wprawdzie ludzie podejmują decyzje nieświadomie, ale lubią uzasadniać je w logiczny sposób, by w razie potrzeby móc wyjaśnić swoje postępowanie sobie i innym. Wyjaśnienia te nie będą miały zapewne zbyt wiele wspólnego z rzeczywistymi pobudkami działań, jednak są ludziom potrzebne. Upewnij się zatem, że dajesz im odpowiednią wymówkę, by mogli skorzystać z Twoich usług, narzędzi czy zasobów. Ludzie szukają wsparcia u innych, gdy nie wiedzą, co robić Skłonność do podejmowania decyzji z uwzględnieniem reakcji otoczenia określa się mianem weryfikacji społecznej. Zjawisko to jest od lat przedmiotem intensywnych badań. Latane i Darley przeprowadzili serię eksperymentów155 badających zachowa- nie ludzi w niejednoznacznych sytuacjach; celem było sprawdzenie wpływu zacho- wań innych osób na zachowanie badanego. Badani byli proszeni na przykład o wypełnienie ankiety mającej rzekomo oceniać ich kreatywność. Osobę poddawaną eksperymentowi prowadzono do osobnego po- 155 B. Latane, J.M. Darley, The Unresponsive Bystander, Upper Saddle River, NJ, Prentice Hall 1970. 258 Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych Smashing Book.indd 258 2011-11-29 12:40:42 Na stronie FIFA.com znajdziemy zdjęcie przedstawiające emocje towarzyszące wygranej (http://www.fifa.com) mieszczenia, w którym odpowiednio poinstruowani aktorzy udawali, że także wypeł- niają testy. Badanym towarzyszyło od jednej do kilku osób. Gdy wszyscy wypełniali swoje testy, z  otworów wentylacyjnych w  pomieszczeniu zaczynał wydobywać się dym. Naukowcy chcieli dowiedzieć się, czy badany zdecyduje się opuścić pomiesz- czenie i poinformować kogoś o potencjalnym zagrożeniu, czy też pozostanie na miej- scu, ignorując niepokojące sygnały. Uczestnik badania nie wiedział, czy w budynku wybuchł pożar, więc znajdował się w niejednoznacznej sytuacji. Osoby oceniające towary w witrynie JR mogą uzupełnić ocenę szerszym opisem (http://www.jr.com) Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych 259 Smashing Book.indd 259 2011-11-29 12:40:42 Aflac to firma ubezpieczeniowa, która na stronie internetowej zamieszcza zdjęcia i historie swoich klientów (http://www.aflac.com) Okazało się, że zachowanie uczestników eksperymentu zmieniało się w  zależ- ności od liczby osób znajdujących się w pomieszczeniu. Im więcej osób w jego oto- czeniu ignorowało zdarzenie, tym bardziej było prawdopodobne, że badany postąpi podobnie. Jeżeli siedział sam, szybko wychodził, by powiadomić kogoś o wydobywa- jącym się z wentylacji dymie. Jeżeli w pokoju znajdowały się inne osoby, które nie reagowały na dym, badany także nie podejmował żadnych działań. W  sieci zjawisko weryfikacji społecznej daje się obserwować w  działach ocen produktów. Jeżeli nie wiemy, na co się zdecydować, chętnie uciekamy się do opinii wygłaszanych przez inne osoby. Opinie wywierające największy wpływ na użytkow- nika mają kilka cech wspólnych. • Zawierają poza wartością podaną na skali kilkuzdaniowy opis towaru. Im więcej będzie w nim informacji, tym chętniej ludzie uwierzą w treść. • Są podawane w postaci opowieści. Wszelkie historie silniej przemawiają do naszej wyobraźni, ponieważ są lepiej przyswajane przez śródmózgowie. Jeśli chcesz zachęcić ludzi do działania, nie zapomnij o umieszczaniu na stronach serwisu ocen, recenzji i wyznań użytkowników. Zaufanie ludzi zdobywa się (lub traci) w ułamku sekundy Każdy, kto odwiedza Twoją stronę internetową, musi podjąć pewne decyzje jej do- tyczące — ocenia, jakim zagadnieniom jest ona poświęcona, czy mu się podoba, czy pozostanie na niej dłużej i czy powinien zaufać zamieszczonym na niej informacjom. Tego rodzaju decyzje zapadają bardzo szybko, w niektórych przypadkach nie trwa to 260 Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych Smashing Book.indd 260 2011-11-29 12:40:42 nawet sekundy. Zazwyczaj też są to decyzje zupełnie nieświadome. Teoria B.J. Fog- ga156 dotycząca zaufania, jakim obdarzamy serwisy internetowe, zakłada, że wszelkie decyzje dotyczące naszej oceny stron podejmowane są na podstawie pobieżnej oceny wyglądu interfejsu. Oto niektóre z  czynników powodujących spadek zaufania do zawartości witryny: • Brak wyrównania i uporządkowania tekstu. Wyśrodkowanie zamiast wyrów- nania do lewego marginesu oraz kilka różnych szerokości marginesów w ob- rębie jednej strony. • Wykorzystywanie zbyt wielu krojów pisma i zbyt wielu rozmiarów fontów. Zbyt wiele fragmentów tekstu wyróżnionych kolorem. • Zbyt wiele informacji stłoczonych na jednej stronie. • Zbyt wiele animacji, szczególnie tych utrzymanych w starym stylu. • Zbyt wiele kolorów na stronie i brak ustalonego motywu kolorystycznego. Strona poświęcona finansom, The Mint, pozwala wybrać cel gromadzenia oszczędności, a następnie prezentuje wizualnie, na mierniku stylizowanym na termometr, jak blisko masz do tego celu (https://www.mint.com) Podsumowując, jeśli chcesz, by strona budziła zaufanie, nie łam podstawowych zasad projektowania interfejsu i unikaj niespójności, które mogłyby sprawić, że użytkow- nik poczuje się niepewnie lub nie potraktuje Twojej oferty poważnie. Nie będziesz mieć zbyt wielu okazji, by ponownie zdobyć zaufanie odwiedzającego, więc nie zmar- nuj 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ń użytkowników i projektowania aplikacji internetowych 261 Smashing Book.indd 261 2011-11-29 12:40:42 Ludzi motywuje pierwszeństwo Daniel Pink w  książce Drive. Kompletnie nowe spojrzenie na motywację wyjaśnia, jak bardzo motywującym czynnikiem w życiu człowieka jest osiągnięcie pierwszeń- stwa157. Ludzie lubią mieć przekonanie, że się rozwijają i zdobywają nowe wiadomo- ści lub opanowują jakąś umiejętność. Przekonanie to rodzi się w nich wraz z wraże- niem, że wykonują postępy w danej dziedzinie. Ran Kivetz, Oleg Urminsky i Yuhuang Zheng158 przeprowadzili badania doty- czące motywacji, koncentrując się w nich na zagadnieniach związanych z obsługą aplikacji internetowych. Jedno z  doświadczeń przewidywało odwiedzanie witryny pozwalającej oceniać utwory muzyczne. Okazało się, że ludzie chętniej wracają na jej strony i częściej oceniają utwory, gdy zaczynają zbliżać się do progu uprawniającego do odbioru nagrody. To tak zwany efekt przyspieszenia u celu. Efekt ten został opisany po raz pierwszy przez Clarka Hulla w 1934 roku. Hull prowadził badania na szczurach, polegające na przeprowadzaniu zwierząt przez la- birynt, na którego końcu czekała je nagroda w postaci jedzenia. Analizując wyniki, Hull odkrył, że szczury zaczynają biec szybciej, gdy zbliżają się do wyjścia z labiryntu. Efekt przyspieszenia u celu odpowiada także za nasze zachowanie, nakazujące zwiększać poziom aktywności, gdy widzimy nagrodę w zasięgu ręki. Działanie pod jego wpływem charakteryzuje się kilkoma cechami. • Im bliżej celu, tym większą motywację będą odczuwać ludzie dążący do niego. • Efekt pojawia się nawet wtedy, gdy progres jest jedynie iluzoryczny. • Motywacja spada natychmiast po odebraniu nagrody. To właśnie możliwość zajęcia pierwszej pozycji napędza tak bardzo popularność gier. W czasie prób osiągnięcia wyższego poziomu umiejętności ludzie popadają w uza- leżnienie. Wprawdzie witryna internetowa to nie gra, ale zawsze możesz próbować wpleść w jej projekt elementy sugerujące możliwość osiągnięcia wyższego poziomu w jakiejś dziedzinie. Jak długo użytkownicy będą mogli stawiać sobie nowe cele i ob- serwować postęp w drodze do celu, tak długo będą angażować się działanie serwisu i czuć 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ń użytkowników i projektowania aplikacji internetowych Smashing Book.indd 262 2011-11-29 12:40:42 Uwaga ludzi łatwo się rozprasza Nawet gdy zajmujemy się poważnymi sprawami, bardzo łatwo przychodzi nam po- rzucanie ich na rzecz pustego klikania kolejnych odnośników i przeglądania losowo wybieranych stron internetowych, mimo że do pierwotnego celu prowadziła bardzo prosta droga. Można stwierdzić, że za rozpraszanie uwagi w czasie przeglądania za- wartości stron internetowych odpowiadają trzy czynniki. Pień mózgu. Najstarsza ewolucyjnie część mózgu skupia się na badaniu oto- czenia w poszukiwaniu pożywienia, możliwości kopulacji oraz ewentualnych źródeł zagrożenia, więc pojawienie się w zasięgu wzroku któregokolwiek z tych czynników natychmiast odwróci naszą uwagę. Widzenie obwodowe. Budowa ludzkiego oka umożliwia dwa rodzaje widzenia — centralne i obwodowe. Widzenie centralne pozwala nam patrzeć bezpośrednio na przedmioty i dostrzegać szczegóły ich budowy. Widzenie obwodowe zachodzi w po- zostałym obszarze pola widzenia, pozwala dostrzegać wszystko, na co nie spoglądamy bezpośrednio. Teoria ewolucji wyjaśnia ten fenomen następująco — to dziedzictwo genetyczne naszych przodków, gdyż zdołali przetrwać tylko ci, którzy potrafili do- strzec lwa, ostrząc krzemień lub spoglądając w niebo. Oznacza to, że widzenie obwo- dowe zawsze odgrywało dużą rolę w naszym życiu. Wielozadaniowość człowieka to mit. Wielu ludzi jest przekonanych, że potrafi wykonywać kilka zadań jednocześnie, ale wyniki badań pozbawiają nas złudzeń — nie potrafimy tego robić. Prowadzone od wielu lat testy psychologiczne potwierdzają, że nie umiemy podejmować kilku działań w jednej chwili. Potrafimy mówić, czytać, pisać i słuchać, a nawet całkiem szybko przełączać swoją uwagę pomiędzy tymi czynnościa- mi, więc wydaje się nam, że myślimy wielozadaniowo, jednak rzeczywistość jest inna. Badania prowadzone przez Irę Hymanę i jego współpracowników159 dowodzą, że osoby rozmawiające przez telefony komórkowe w czasie spacerów częściej wpadają na innych ludzi i dostrzegają mniej szczegółów wokół siebie. W doświadczeniu brał udział akrobata, który w stroju klowna jeździł w pewnym oddaleniu od badanego na jednokołowym rowerze. Okazało się, że osoby rozmawiające przez telefon komórko- wy rzadziej zauważały niecodzienną postać w otoczeniu bądź szybko o niej zapomi- nały. Skutki tak łatwego rozpraszania uwagi mogą być dobre albo złe. Nie będziesz miał problemów z  przyciągnięciem użytkownika do wybranego obszaru strony, bo jego uwaga łatwo się rozprasza. Natomiast zmuszenie ludzi do skupienia się na konkretnym elemencie strony jest zadaniem skomplikowanym. Również zachęcenie ludzi do odwiedzenia strony nie jest trudne, ale skierowanie 159 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 a Cell Phone, „Applied Cognitive Psychology”, 2009. Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych 263 Smashing Book.indd 263 2011-11-29 12:40:42 ich uwagi na wybrany fragment serwisu i zatrzymanie ich tam na dłużej jest już bar- dziej złożone, ponieważ uwaga ta rozprasza się bardzo łatwo. Dlatego warto pamiętać o kilku sprawach. • Uwagę przyciąga każda forma ruchu, wideo, animacje i banery — nie nama- wiam bynajmniej do wstawiania wszędzie ruchomych reklam (a szczególnie nie do uruchamiania ich bez wiedzy użytkownika), ale uważam, że powinie- neś o tym wiedzieć. • Uwagę rozpraszają wszelkiego rodzaju zdjęcia, na których pojawiają się lu- dzie, pożywienie bądź jakiekolwiek aluzje do seksu czy niebezpieczeństwa. • Wszystkie migające elementy bardzo irytują, ponieważ są stale wychwytywa- ne przez mechanizm widzenia obwodowego. Wszystkie czynniki rozpraszające uwagę pozwolą Ci przenieść zainteresowanie użyt- kownika w wybrane miejsce, lecz gdy już tego dokonasz, postaraj się je wyeliminować. Ludzie są leniwi z natury Ludzie zawsze starają się wykonać swoją pracę najmniejszym możliwym nakładem środków. Dziesiątki tysięcy lat ewolucji nauczyły nas, że nasze szanse przetrwania wzrastają, a życie jest przyjemniejsze, gdy oszczędzamy energię. Wiemy, że musimy poświęcić pewną jej ilość, by zdobyć środki niezbędne do życia, ale zbyt długie uga- nianie się za nimi będzie zwykłą stratą energii. Zaspokojenie + wystarczanie = zaspokorczanie Przeciętny człowiek w większości przypadków działa na zasadzie wystarczającego za- spokojenia. W literaturze spotyka się często angielskie określenie ukute przez Her- berta Simona — satisficing. Simon użył go do opisania mechanizmu podejmowania decyzji polegającego na tym, że ludzie chętniej wybierają rozwiązania wystarczające niż optymalne. Powodami takiego postępowania mają być przede wszystkim zbyt wysokie koszty prowadzenia pełnej analizy problemu w stosunku do spodziewanych zysków oraz, co jest nie mniej istotne, często brak możliwości jej przeprowadzenia. Z ustaleń Simona wynika, że podejmujący decyzje bardzo często nie mają wy- starczających możliwości poznawczych, by rozważyć wszystkie dostępne opcje. Stąd wniosek, że lepiej wybrać opcję, która będzie wystarczająco dobra, niż szukać naj- lepszego w danej sytuacji rozwiązania. A jak wpływa to na zasady, którymi powinni kierować się projektanci stron internetowych, programów komputerowych, towarów czy chociażby osoby układające ankiety? „Zaspokorczanie” pozwala wyciągnąć kilka zaskakujących wniosków. 264 Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych Smashing Book.indd 264 2011-11-29 12:40:42 Projektuj strony tak, by dało się je przebiec wzrokiem i nie trzeba było ich czytać. Steve Krug w Nie każ mi myśleć! stosuje właśnie ideę wystarczającego zaspoko- jenia, opisując zachowania użytkowników stron internetowych160. Właściciel witryny ma nadzieję, że odwiedzający zapozna się z jej zawartością w całości, ale wie, że „za- zwyczaj użytkownicy obrzucają stronę zdawkowym spojrzeniem (jeżeli mamy nieco szczęścia), szybko przebiegają wzrokiem podane na niej informacje i klikają pierwszy odnośnik, który przykuje ich uwagę i choć trochę przypomina to, czego szukają”. Załóż, że każdy będzie chciał iść na skróty. Ludzie zawsze starają się zrobić wszystko szybciej i w mniejszej liczbie kroków, szczególnie jeśli ich zadanie ma się powtarzać. Jeżeli odkrycie skrótu będzie zbyt skomplikowane, pozostaną przy starej metodzie. Czynnikiem decydującym jest tu — niespodziewanie — przewidywany wysiłek, jaki przyszłoby im podjąć, by osiągnąć cel. Jeżeli znalezienie skrótu wydaje się zbyt pracochłonne, człowiek będzie wolał pozostać przy swoich przyzwyczaje- niach (zaspokajając swoje potrzeby jedynie w stopniu wystarczającym). Korzystaj z wartości domyślnych. Używanie wartości domyślnych minimali- zuje wysiłek, jaki musi podjąć odwiedzający stronę, by osiągnąć zamierzone cele. Możesz na przykład wypełnić za użytkownika pola nazwiska i adresu formularza in- teraktywnego — dzięki temu oszczędzisz mu pracy. Niestety, wiąże się z tym pewne ryzyko. Ludzie bardzo często nie zważają na ustawienia domyślne, przez co zdarza się im zaakceptować błędne dane. Zachowanie to także wiąże się z potrzebą podejmo- wania wysiłku. Jeżeli zmiana ustawień domyślnych wyda Ci się zbyt uciążliwa, lepiej zrezygnuj z opcji podpowiadania. Ludzie ze wszelkich sił starają się wykonać każde zadanie jak najmniejszym na- kładem pracy i jednocześnie nie chcą się przy tym zbytnio nudzić. Jeżeli Twój projekt uwzględni obydwa te aspekty ludzkiej natury, zdołasz stworzyć witrynę interesującą dla odwiedzających. Ludzie posługują się wzorcami myślowymi Wyobraź sobie, że nigdy nie widziałeś czytnika Kindle, a ja wręczam Ci taki, mówiąc, że to urządzenie do czytania książek. Jeszcze zanim go włączysz, będziesz miał w gło- wie gotową ideę tego, jak powinien działać. Wyobrazisz sobie, w jaki sposób książka będzie prezentować się na ekranie, co i jak będziesz mógł z nią zrobić. W głowie zrodzi Ci się model przewracania kartek i zakładania miejsca, w którym skończysz lekturę. W ten sposób, mimo że nigdy nie 160 S. Krug, Nie każ mi myśleć! O życiowym podejściu do funkcjonalności stron internetowych (wydanie II), Helion 2006. Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych 265 Smashing Book.indd 265 2011-11-29 12:40:42 czytałeś książki w czytniku Kindle, będziesz mieć gotowy wzorzec myślowy działania tego urządzenia. Kształt wzorca zależy od wielu czynników. Ktoś, kto miał już kontakt z  tego rodzaju urządzeniami, wytworzy własny wzorzec, inny od wzorców ludzi, którzy sły- szeli o czytnikach, ale nigdy ich nie używali, i zupełnie odmienny od wyobrażeń osób niewiedzących nawet, czym jest Kindle. Jeżeli w ostatnich latach czytałeś książki za pomocą iPada, będziesz oczekiwać czegoś innego niż osoba, która nie miała dotąd do czynienia z e-bookami. A gdy już dostaniesz czytnik Kindle do rąk i przeczytasz przy jego wykorzystaniu kilka książek, wzorzec myślowy samoczynnie ulegnie zmianie. Wzorce myślowe to nic nowego O wzorcach myślowych (w informatyce określanych też modelami mentalnymi) sły- szy się nieprzerwanie od przynajmniej dwudziestu pięciu lat. Susan Carey definiowa- ła je w swojej publikacji z 1986161 w następujący sposób: „Wzorzec myślowy opisuje ludzkie wyobrażenia dotyczące zachodzenia pewnych procesów (to jest ludzkie wyobrażenie otaczającego nas świata). Wzorce myślowe powstają na bazie niepełnej znajomości faktów, minionych doświadczeń, a nawet przeczuć. Pomagają nam podejmować działania i za- chowywać się w dany sposób w nowych sytuacjach, a także wpływają na nasze podejście do każdego problemu i określają sposób jego rozwiązywania”. Z  punktu widzenia użytkownika interfejsu aplikacji internetowej wzorzec myślo- wy będzie modelem przedstawiającym wyobrażenie tego użytkownika o produkcie, z którym ma właśnie do czynienia. Oto kilka faktów na temat wzorców myślowych. • Wzorce myślowe powstają bardzo szybko, czasami jeszcze przed użyciem pro- duktu lub usługi. • Wzorce ulegają zmianom. • Użytkownicy tworzą wzorce myślowe na bazie swoich przeszłych doświad- czeń z podobnymi towarami, na podstawie podejrzeń, opinii i obserwacji in- nych ludzi oraz własnych doświadczeń z danym produktem. • Wzorce myślowe pozwalają nam przewidywać, jak zadziała dane urządzenie (bądź aplikacja) i jak należy z nim postępować. 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ń użytkowników i projektowania aplikacji internetowych Smashing Book.indd 266 2011-11-29 12:40:43 Wzorce myślowe kontra modele koncepcyjne Aby zrozumieć, jak ważne w procesie projektowania interfejsu są wzorce myślowe, musimy zrozumieć, czym są modele koncepcyjne. Model koncepcyjny jest rzeczywi- stym modelem interfejsu użytkownika. Wróćmy na chwilę do przykładu iPada. Załóżmy, że masz pewne wyobrażenie o tym, w jaki sposób odbywa się lektura książki na takim urządzeniu, domyślasz się, jak będzie ono działać i co możesz z nim zrobić. Kiedy jednak usiądziesz na kanapie z iPadem w ręku, spotkasz się z modelem koncepcyjnym czytnika książek. Będzie ekran i przyciski, a wyświetlane na ekranie elementy będą się przemieszczać. Model koncep- cyjny to interfejs, z którym masz do czynienia w trakcie korzystania z produktu162. Dlaczego zatem wprowadzać w ogóle rozróżnienie między tymi ideami? Powód jest prosty — każda decyzja związana z użytecznością aplikacji i doświadczeniami użytkownika kłóci się lub pozostaje w zgodzie z jego wzorcem myślowym i modelem koncepcyjnym aplikacji. Oto kilka przykładów. • Jeżeli model koncepcyjny nie będzie zgodny z wzorcem myślowym, użytkow- nik uzna, że aplikacja jest skomplikowana w obsłudze i trudno ją opanować. • Jeżeli projektant nie uwzględnił w czasie pracy wymagań wzorca myślowego, aplikacja zapewne będzie skomplikowana w obsłudze i trudna do opanowania. • Jeżeli z danego towaru lub usługi korzysta kilka grup użytkowników (na przy- kład ludzie, którzy wcześniej używali czytnika Kindle, i ludzie, którzy nigdy wcześniej nie czytali książek w wersji elektronicznej), a model koncepcyjny został dostosowany do wzorca myślowego jednej z nich, pozostałe uznają, że urządzenie jest trudne w obsłudze. • Jeżeli model koncepcyjny nie został poprawnie opracowany i ogranicza się do umożliwienia użytkownikowi korzystania ze sprzętu, programów bądź baz danych, prawdopodobnie nie będzie zgadzać się z wzorcem myślowym użyt- kownika, przez co użytkownik uzna, że urządzenie jest trudne w obsłudze. Co się dzieje, gdy musisz zmienić wzorzec myślowy? Nie zawsze można dostosować się do wyobrażeń użytkownika. Być może właśnie pracujesz nad czymś zupełnie nowym, co okaże się punktem przełomowym w danej dziedzinie. W takim przypadku uznasz zapewne, że musisz zmienić sposób myślenia użytkownika, dostosować jego wzorzec myślowy do modelu koncepcyjnego, mimo że zazwyczaj postępuje się odwrotnie. Powody są banalne — na przykład nikt, kto dotąd czytał jedynie na papierze, nie będzie wiedział, jak dokładnie działa czytnik Kindle. 162 Ideę tę przedstawił także Francisco Inchauste w rozdziale „Widoczne kontra niewidoczne” — przyp. red. Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych 267 Smashing Book.indd 267 2011-11-29 12:40:43 To oczywiście nie zwalnia Cię z obowiązku poznania wzorca myślowego, ponie- waż tylko w ten sposób będziesz mógł zdecydować, w których miejscach chcesz od niego odejść i w jaki sposób nauczyć użytkownika pracy z modelem koncepcyjnym (a nie tylko z samym urządzeniem). Etap nauki jest niezbędny, ponieważ tylko tak możesz zbudować nowy wzorzec myślowy lub przemodelować stary, by użytkownik mógł zastosować go, zanim jeszcze zacznie obsługiwać urządzenie. Nie mam tu wca- le na myśli uciążliwych, wielodniowych szkoleń. Wzorzec myślowy można zmienić w zaledwie kilka minut. Wystarczy zaprezentować potencjalnemu nabywcy film de- monstrujący działanie czytnika, zanim urządzenie trafi do jego rąk. Chodzi przecież wyłącznie o zmianę wzorca myślowego w sposób, który by pasował do modelu kon- cepcyjnego urządzenia. Wszystko o wzorcach myślowych i modelach koncepcyjnych Wzorce myślowe i modele koncepcyjne odgrywają ważną rolę w pracy projektanta interfejsu. Można nawet zaryzykować stwierdzenie, że wszystkie działania związane z osobą użytkownika dotyczą: 1. zrozumienia wzorca myślowego użytkownika (poprzez analizę zadań, prowa- dzenie obserwacji, przeprowadzanie rozmów itd.), 2. projektowania modelu koncepcyjnego zgodnie z wzorcem myślowym (po- przez odpowiednie zaplanowanie funkcji interfejsu, wielokrotne wprowadza- nie zmian, przeprowadzanie testów weryfikacyjnych). Sekret projektowania intuicyjnych interfejsów i tworzenia w ten sposób pozytyw- nych doznań użytkownika tkwi w dopasowaniu modelu koncepcyjnego do wzorca myślowego ludzi, którzy będą pracować z daną aplikacją. Zrób to, a wywołasz nieza- pomniane doznania użytkownika. Ludzie popełniają błędy Ludzie mylą się często, ale nie lubią popełniać błędów. Sposób, w jaki strona interne- towa reaguje na błędy, ma ogromny wpływ na to, czy ludzie chętnie do niej wracają i czy ją lubią. Miej na uwadze, że ludzie się mylą, staraj się przewidzieć ich błędy i za- stanów się, jak sobie z nimi radzić. Unikaj bezsensownych powiadomień o błędach. Opracowywanie powiadomień o błędach zajmuje zapewne najmniej czasu i uwa- gi każdego projektanta aplikacji i być może tak właśnie powinno być. Ostatecznie najlepszym komunikatem o błędach jest brak takowego (zakładam, że jest to równo- znaczne z zaprojektowaniem systemu, w którym nie da się popełnić pomyłki). Ale 268 Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych Smashing Book.indd 268 2011-11-29 12:40:43 jeżeli pomyłka jednak się zdarzy, należy poinformować użytkownika o tym, co nie zadziałało. W życiu zawsze coś musi się popsuć. Wszyscy popełniamy błędy — użytkownicy mylą się, wprowadzając dane, firmy popełniają błędy, oferując nie do końca sprawne oprogramowanie, a projektanci tworzą bezużyteczne aplikacje tylko dlatego, że nie rozumieją potrzeb użytkowników. Jeżeli jednak będziesz przestrzegać kilku zasad, uda Ci się ograniczyć błędy do minimum. • Zastanów się, jakie błędy mogą wystąpić w czasie pracy z aplikacją. Postaraj się przewidzieć większość z najczęściej popełnianych przez ludzi pomyłek i za- projektuj witrynę tak, by od razu reagowała odpowiednio. • Nie pomijaj etapu tworzenia prototypu i daj go do przetestowania ludziom. Tylko w ten sposób zdołasz poznać typowe sposoby pracy i zorientujesz się, jakie błędy popełniają użytkownicy. Krótko mówiąc, przeprowadź test uży- teczności aplikacji. • Unikaj żargonu w powiadomieniach o błędach. Komunikat powinien zawie- rać następujące informacje: (1.) że wystąpił błąd, (2.) jakiego rodzaju jest to błąd, (3.) co użytkownik powinien zrobić, by go poprawić, (4.) gdzie może znaleźć obszerniejsze wyjaśnienia. • Używaj strony czynnej i stawiaj na bezpośredniość. Komunikat: „Opłacenie faktury nie będzie możliwe, jeżeli data jej wystawienia nie przypadnie przed datą zapłaty”, jest mało czytelny. Zdecydowanie lepiej sprawdziłaby się in- formacja: „Ustaw datę płatności faktury tak, by przypadała przed datą jej wystawienia”. Zaprojektowanie systemu, w którym nie da się popełnić błędów, jest bardzo trud- ne… Powiedziałabym nawet, że niemożliwe. Wystarczy przypomnieć sobie awarie reaktorów elektrowni atomowych na Three Mile Island, w  Czarnobylu czy kata- strofę ekologiczną, której sprawcą było British Petroleum. Pomyłek należy unikać tym bardziej, im wyższe mogą być koszty ich wystąpienia. Jeżeli masz do czynienia z systemem, w którym błędów należy unikać za wszelką cenę (działającym na przy- kład w elektrowni atomowej, w zakładach przemysłu naftowego czy w placówkach z aparaturą medyczną), przygotuj się na przeprowadzanie dwu- lub nawet trzykrotnie większej liczby testów niż normalnie i znacznie intensywniejsze szkolenie osób pra- cujących z tym systemem. Próby projektowania systemów niezawodnych są drogie i nigdy nie kończą się zupełnym powodzeniem. To wrodzona cecha ludzkiego umy- słu. Wszyscy popełniamy błędy. Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych 269 Smashing Book.indd 269 2011-11-29 12:40:43 Nie twórz bezsensownych komunikatów o błędach, jak ten ze strony biblioteki (http://www.mcpl.us) „Patrzeć” nie znaczy „widzieć” Projektując stronę internetową, skupiamy się przede wszystkim na tym, na co będą patrzeć odwiedzający. Internet przecież oddziałuje przede wszystkim na wzrok. Zakła- damy, że odwiedzający poświęcą czas na przyglądanie się różnym elementom witryny i na tym założeniu budujemy mnóstwo teorii. Jeden z najczęściej wysuwanych wnio- sków jest zupełnie bezpodstawny — zakłada się, że człowiek „widzi” to, na co patrzy. Dwa oddzielnie prowadzone nurty badań dowiodły, że ludzie nie widzą tego, na co spoglądają. Pierwszy z nich koncentruje się na porównywaniu widzenia centralne- go z widzeniem obwodowym, drugi bada zjawisko „niezamierzonej nieuwagi”. Widzenie centralne kontra widzenie obwodowe Wiemy już, że człowiek postrzega świat za pomocą dwóch odrębnych mechanizmów — widzenia centralnego i widzenia obwodowego. Badania prowadzone na Uniwer- sytecie Stanowym w Kansas dowodzą, że bodźce dostarczane do mózgu za pośrednic- twem widzenia obwodowego mają większe znaczenie, niż dotąd sądziliśmy163. Oka- zuje się, że „istotę” scen rozgrywających się przed naszymi oczyma określamy właśnie poprzez widzenie obwodowe. W  czasie badań zaprezentowano uczestnikom serię fotografii przedstawiających obrazy znane z codziennego życia — zdjęcia kuchni czy pokojów. Na części zdjęć obrzeża były nieostre, na pozostałych nieostry był środek. Zdjęcia prezentowano bardzo szybko, a następnie proszono uczestników badania, by opisali, co widzieli. Naukowcy odkryli, że ludzie potrafili rozpoznać otoczenie prezentowane na zdjęciach z nieostrym środkiem, lecz gdy to obrzeża fotografii były zamazane, uczestnicy nie mogli odróżnić 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ń użytkowników i projektowania aplikacji internetowych Smashing Book.indd 270 2011-11-29 12:40:43 Niezamierzona nieuwaga W swojej książce The Invisible Gorilla panowie Chabis i Simons przedstawili wyni- ki badań poświęconych zagadnieniu niezamierzonej nieuwagi. W serii doświadczeń wykazali, że bardzo często nie dostrzegamy przedmiotów znajdujących się dokładnie przed naszymi oczyma. Otoczenie bombarduje nas tak intensywnie bodźcami wzro- kowymi, że mózg wykształcił mechanizm automatycznego i zupełnie nieświadomego decydowania, na które z nich powinniśmy zwracać uwagę. Oko wychwytuje znacznie więcej, niż trafia do świadomej części naszego mózgu. Skoro, jak się okazało, widzenie obwodowe jest w pewnym sensie znacznie waż- niejsze niż widzenie centralne i skoro zdarza się nam patrzeć na pewne przedmioty i w ogóle nie rejestrować ich obecności, to jak uwzględnić to w projektowaniu aplika- cji internetowych? Oto kilka konsekwencji wynikających z powyższych teorii. • To, że ktoś spojrzał na witrynę, nie znaczy, że zwrócił na nią uwagę. • To, że umieścisz coś na stronie, nie znaczy, że wszyscy to zobaczą. • Wprawdzie śledzenie ruchu gałek ocznych dostarczyło bardzo interesujących danych, ale nie zapominajmy, że dotyczą one przede wszystkim widzenia cen- tralnego. Badania tego rodzaju nie śledzą widzenia obwodowego, a ponieważ patrzenie nie jest tożsame z widzeniem, nie podejmuj najważniejszych decyzji wyłącznie w oparciu o dane dotyczące ruchu oka. Podsumowanie Niezależnie od charakteru witryny, nad jaką pracujesz, musisz pamiętać, że prędzej czy później trafi na nią osoba o  zupełnie innym sposobie myślenia. Pamiętaj, że masz własny obraz słonia. Jeżeli chcesz zbudować funkcjonalną, interesującą i cenną z punktu widzenia użytkowników stronę, postaraj się poszerzyć tę wizję i uwzględnić w niej wiedzę z zakresu psychologii. Oto dziesięć rzeczy, które warto wiedzieć o ludz- kich charakterach. • Ludzie są zwierzętami stadnymi. • Człowiek podejmuje większość decyzji nieświadomie. • Gdy ludzie nie wiedzą, co zrobić, powtarzają reakcje otoczenia. • Ludzie decydują się zaufać (bądź nie) Twojej stronie w ułamku sekundy. • Ludzi motywuje chęć osiągnięcia jak najlepszej pozycji w rankingu. • Uwaga człowieka rozprasza się w mgnieniu oka. • Ludzie są z natury leniwi. • Każdy z nas tworzy wzorce mentalne działania różnych rzeczy. Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych 271 Smashing Book.indd 271 2011-11-29 12:40:43 • Ludzie popełniają błędy. • „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 Credi- bility 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 a Cell 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 myśleć! O życiowym podejściu do funkcjonalności stron interne- towych, 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. o autorce Rób to, co kochasz i co Cię porywa. Nie unikaj wyzwań intelektualnych. Znajdź pracę, którą będziesz kochać tak bardzo, że nie będziesz mógł doczekać się rano wyjścia z domu. Susan Weinschenk ukończyła studia licencjackie na wydziale psychologii na Nor- theastern University w Bostonie, a następnie obroniła pracę magisterską i doktorat z tej samej dziedziny na uniwersytecie Penn State University w Pensylwanii. Susan pracuje jako główny specjalista do spraw ustalania strategii użyteczności aplikacji w Human Factors International. Od przeszło trzydziestu lat udziela się zawodowo, stosując swoją wiedzę do opisywania doświadczeń użytkownika, zagadnień użytecz- ności oraz uwzględniania czynnika ludzkiego w pracy urządzeń i aplikacji. W wol- nym czasie chadza na przedstawienia teatralne, czyta, śpiewa w zespole jazzowym i  piecze własnoręcznie chleb. Utrzymuje przy tym, że zakwas jest jak zwierzątko — trzeba go „karmić” codziennie. Susan zachęca Czytelników do ciągłego poszerza- nia swojej wiedzy i nieustannego projektowania — im więcej zrobicie, tym lepsze osiągniecie wyniki. 272 Co sprawia, że klikają? Psychologia zachowań użytkowników i projektowania aplikacji internetowych Smashing Book.indd 272 2011-11-29 12:40:43 Skorowidz A 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 bezpieczeństwo, 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 Březina 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 więzi, 231 Buivenga Jos, 172, 183, 188, 196, 208, 217 Burkert Thomas, 352 Burton Snowboards, 50 burza mózgów, 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, czynnościowy rezonans magnetyczny, Patrz: fMRI D Dagget John, 174, 197, Dannaway Adham, 27, 32, Darley J.M., 258 de León Inayaili, 188 Dewey John, 17, 18 diagram opisujący stronę, 79 Dobler Michael, 352 dostosowywanie, 230 DRM, 343, 346 społeczne, 346 Drowned Studio, 32 druk na życzenie, 350 dziedziczenie, 67 Smashing Book.indd 353 2011-11-29 12:40:53 Skorowidz 353 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 złożony, 87 354 Skorowidz Foursquare, 247 Friedman Vitaly, 352 G Gill Bob, 20 głos, 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 użytkowa, 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ść czynów, 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 Smashing Book.indd 354 2011-11-29 12:40:53 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 użytkownika, 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 Jägermeister, 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 użytkownika, 15, 134 kompatybilność wsteczna, 346 komunikat, 15 kontakt, 306 kontrast, 14, 21, 25, 28, 53, 92 koszty stałe, 337 wydruku, 337 wysyłki, 340 Kouwenhoven John, 62 krawędź, 99 Krug Steve, 265 książka, 318, 325, 330 cena, 347 elektroniczna, Patrz: e-book układ, 331 L Latane B., 258 Le Cobusier, 18 Leming Tal, 174 Lennartz Sven, 352 Lifrieri Joe, 41, 42 Liga Przenośnych Czcionek, 181, 192 Linowski Jakub, 113 Lubalin Herb, 18 M MacHeist, 231, 233 mapowanie myśli, 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 Smashing Book.indd 355 2011-11-29 12:40:53 Skorowidz 355 model implementacji, 57 koncepcyjny, 267, 268 mentalny, 57, 266, Patrz też: wzorzec myślowy MVC, 162 projektanta, Patrz: model przedstawiany przedstawiany, 57 systemowy, Patrz: model implementacji Moholy-Nagy László, 17, 18 moodboarding, 112 Müller Manuela, 352 Müller-Brockmann Josef, 18 myto projektowe, 58 N napięcie, 27, 28 nawigacja, 284 breadcrumbs, 284, 288 Netscape, 173, 174 niebiański wzrost, 231, 248 Nine Inch Nails, 239 O obraz, 15, 30 Old Spice, 245 OnA, 31 OpenIDEO, 248 OpenOffice, 33, 331, 332, 345 oświetlenie, 98 OTTO, 239 ozdobnik, 21 P palący optymizm, 231, 248 PayPal, 296 PDF, 332, 335, 343, 344, 345 Peters Yves, 183, 184, 189, 193, 207, 210, 217 Pink Daniel, 262 plik zamknięty, 332 podglądacz, 222, 230, 248 połysk, 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 język, 16 zasady, 16 projektant grafiki, Patrz: grafik interakcji, 220, 237, 254 prototyp, 121, 128 przepływ, 59 przestrzeń, 27 negatywna, 14, 27, 41 przycisk opcji, 85, 86, 94, 291, 294 psychologia społeczna, 222 QuarkXPress, 198, 332 R Ram Dieter, 49 Rand Paul, 17, 18, 20, 25, 29 reakcja, 228, 229, 247 recenzent merytoryczny, 325 356 Skorowidz Smashing Book.indd 356 2011-11-29 12:40:53 redaktor, 320, 338 reguła, 151, 233, 250 trójpodziału, 21 wzorca F, 28 złotego podziału, 21 Reichenstein Oliver, 33, 175, 189, 194, 196, 216, 217 Rich Micah, 181, 192, 209, 210, 217 Richmond Kean, 40 rozdzielczość ekranu, 278, 333 równowaga, 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 światło, 21, 98 Tan Jon, 172, 177, 180, 191, 195, 196, 197, 199, 217 technika rękawic bokserskich, 111 sIFR, 173 technologia Cufón, 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 użytkownika Underworld Magazines, 22 Unicode, 181, 198, 199 UNIQLO, 242 upselling, 350 Urminsky Oleg, 262 urządzenia mobilne, 72, 77, 78, 92, 99 UX, Patrz: komfort pracy użytkownika 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 Smashing Book.indd 357 2011-11-29 12:40:53 Skorowidz 357 Warde Beatrice, 36 Weingart Wolfgang, 18 Weinschenk Susan, 253, 272 weryfikacja społeczna, 258 Widget, 251 widżet, 73, 94, 242 Wood Alan, 198 Wowpedia, 232 Writer, 66 współczynnik CR, 223 wydawnictwo, 319, 322 wygrana, 235 wymiana, 228, 229, 247 wyrównanie, 94 wyszukiwanie, 286 wzorzec myślowy, 266, 267, 268 Y Y3K, 28 Z zakładka, 85, 87 zarabianie, 228, 229, 247 zaspokorczanie, 264 zbieranie, 228, 247 Zheng Yuhuang, 262 358 Skorowidz Smashing Book.indd 358 2011-11-29 12:40:53
Pobierz darmowy fragment (pdf)

Gdzie kupić całą publikację:

The Smashing Book #2
Autor:

Opinie na temat publikacji:


Inne popularne pozycje z tej kategorii:


Czytaj również:


Prowadzisz stronę lub blog? Wstaw link do fragmentu tej książki i współpracuj z Cyfroteką: