Zbadać
Zaprojektowa
52
Zweryfikowa
Kontekst liczy się bardziej niż wielkość ekranu 26
W 2007 roku – tym samym, w którym na rynek weszły iPhone’y oraz telewizory smart – Jan Chipchase, antropolog kulturowy pracujący dla Nokii, opublikował wyniki swoich badań. Ustalił, że – bez względu na podziały kulturowe i płciowe –wyróżnia się trzy rzeczy uznawane obecnie za niezbędne: klucze, pieniądze i telefon komórkowy. Tym samym nastała epoka, w której projektowanie interfejsów na urządzenia mobilne nie mogło być już traktowane po macoszemu.
Gdy w 2012 roku pracowaliśmy nad nową stroną internetową dla „USA Today”, Apple wprowadził na rynek iPada, więc nasz nowy projekt musiał wyglądać dobrze na trzech różnych rodzajach ekranów, charakteryzujących się różnymi rozmiarami i proporcjami (komputer, telefon komórkowy i tablet). Sam ekran to jednak tylko część tamtego wyzwania. Musieliśmy również uwzględnić różne konteksty sytuacyjne, w których się z tych urządzeń korzysta. Od wielkości ekranu zdecydowanie ważniejsze jest bowiem to, kiedy i dlaczego sięgamy po konkretne urządzenie.
Zagłębiliśmy się w dane analityczne strony „USA Today” i dokonaliśmy podziału ruchu przychodzącego według rodzaju urządzenia. Okazało się, że widać w tych danych wyraźne prawidłowości. Smartfony zdominowały poranny i wieczorny okres dojazdu do pracy i powrotu do domu, w standardowych godzinach pracy najwięcej czytelników korzystało z komputerów, po tablety sięgali natomiast wieczorami.
Korzystając z urządzeń mobilnych, często jesteśmy w drodze i często przełączamy się między kilkoma różnymi aplikacjami, dlatego layout tworzony z myślą o urządzeniach mobilnych musiał być dopasowany do takiego rwanego sposobu konsumowania treści. Oznaczało to duże nagłówki i krótkie akapity, a także odpowiednio duży kontrast, umożliwiający korzystanie ze strony w ostrym słońcu. Musieliśmy też uwzględnić obsługę urządzenia jedną ręką (kciukiem nie da się sięgnąć wszędzie!), więc najczęściej używane elementy interfejsu umieściliśmy na dole ekranu.
Początkowo zakładano, że tablety będą urządzaniami mobilnymi, tymczasem większość ludzi korzysta z nich w domu, i to w celach rozrywkowych oraz do konsumowania dłuższych treści. Dlatego wielkość i krój czcionki w przypadku dłuższych tekstów muszą zapewniać komfort czytania, a layout musi się sprawdzać zarówno w układzie pionowym, jak i poziomym.
Kiedy, gdzie, po co i jak konsumujemy treści? Odpowiedzi na te pytania należy wziąć pod uwagę na długo przed rozpoczęciem faktycznych prac projektowych, ponieważ gdy coś ma działać na różnych urządzeniach, uniwersalne rozwiązania nie istnieją. Gdy system jest projektowany pod konkretny kontekst użytkowania, a nie pod wybraną wielkość ekranu, są większe szanse, że okaże się właściwy i komfortowy dla użytkownika.
Mało czasu, minimalistyczny
design
→ Zrzuty ekranu z gry ColorMatch na iOS, którą zaprojektowaliśmy z własnej inicjatywy. Zaczęło się od sporu między nami dotyczącego pewnego konkretnego koloru. Anton uważał, że to jest taki i taki kolor, a ja się z nim nie zgadzałam. W celu rozstrzygnięcia sporu zagłębiliśmy się w naukowe aspekty postrzegania barw i napisaliśmy apkę sprawdzającą, na ile precyzyjnie ludzie postrzegają kolory.
Zazwyczaj decyzja o zastosowaniu minimalistycznego designu zapada w celu zmniejszenia obciążenia poznawczego użytkownika. Z interfejsu łatwiej się wówczas korzysta (patrz zasada 11). Może też chodzić o względy estetyczne albo przekazanie jakichś konkretnych odczuć lub emocji. Bywa jednak i tak, że interfejs jest bardzo prosty, ponieważ musi powstać w jak najkrótszym czasie.
Gdy otwieraliśmy nasze studio, Anton i ja ustaliliśmy, że ewentualne przestoje między zleceniami będziemy wykorzystywać na osobiste eksperymenty. W takich okresach sami będziemy pisać sobie brief i będziemy musieli zmieścić się w dostępnym czasie z zaprojektowaniem tego, co wymyśliliśmy.
W naszej pierwszej przerwie tego rodzaju stworzyliśmy grę na urządzenia mobilne. Uznaliśmy, że warto postawić na kolory, ponieważ to zawsze mniej projektowania i możliwość szybszego ukończenia projektu.
Kiedy zanurzyliśmy się w świecie barw, zaczęło robić się ciekawie. Mózg każdego człowieka nieco inaczej reaguje na bodźce w postaci światła trafiającego w kilka rodzajów czopków w oku, przez co postrzeganie barw okazuje się subiektywne. O różnicach w postrzeganiu kolorów decydują również płeć, pochodzenie etniczne, geografia, a nawet język, którym się posługujemy. Uznaliśmy zatem, że ciekawie będzie zaprojektować grę, która polega na sprawdzaniu naszego postrzegania barw.
Tworzyliśmy zatem prostą zabawę złożoną z dziesięciu rund. Użytkownikowi przez trzy sekundy wyświetlał się jakiś kolor, a następnie był on proszony, by jak najdokładniej ten kolor dopasował. Mechanika tej gry była bardzo prosta, więc nie mieliśmy zbyt dużo pracy z projektowaniem. Cały projekt wymyśliliśmy, opracowaliśmy i wdrożyliśmy w dwa tygodnie.
Minimalistyczny design wybiera się z wielu różnych powodów. Właściwe rozwiązanie czasami udaje się znaleźć w najprostszych pomysłach, a poza tym ograniczanie ram projektu pozwala oszczędzić czas. Im mniej elementów i funkcji, tym szybciej coś może zostać zaprojektowane i zbudowane. Gdy sprawa jest pilna, minimalistyczny design to duży atut.
Uniwersalne zasady projektowania UX
Albo obiecaj
za mało, albo dostarcz więcej, niż obiecałeś
Jeśli chodzi o wymagania biznesowe, wskazanie niezbędnych cech jest stosunkowo proste, ponieważ wymaga to jedynie rozmów z interesariuszami biznesowymi. Nieco trudniej jest wskazać te funkcje, które należy uwzględnić w rozwiązaniu z punktu widzenia użytkownika. Do pierwszej wersji produktu nie można wdrożyć jedynie funkcji absolutnie niezbędnych, to byłoby zbyt proste (patrz zasada 43). Ważne jest również, aby uwzględnić nieco funkcji, których użytkownik się nie spodziewa i które go pozytywnie zaskoczą.
W jaki sposób należy zatem wskazać dodatkowe funkcje, które powinny znaleźć się w MVP? Można to zrobić „na czuja”, ale co do zasady warto jest przyjąć jakieś bardziej usystematyzowane podejście do szeregowania cech i funkcji – zwłaszcza jeśli te decyzje trzeba uzasadnić na forum interesariuszy biznesowych. Jeszcze przed etapem ustalania, jaką wartość ma dana funkcja dla użytkownika (niską, średnią czy wysoką), warto odpowiedzieć sobie na poniższe pytania:
Czy użytkownik spodziewa się obecności tej funkcji?
A może użytkownika ta funkcja w ogóle nie interesuje?
Czy ta funkcja może aktywnie sfrustrować użytkownika?
Czy ta funkcja pozytywnie zaskoczy użytkownika?
Czy ta funkcja pomoże użytkownikowi zoptymalizować użycie interfejsu?
Ta metoda szeregowania funkcji jest dość luźno oparta na modelu z 1984 roku, którego autorem jest Noriaki Kano, profesor zarządzania jakością na Tokijskim Uniwersytecie Naukowym. Model ten powstał w toku badań nad czynnikami kształtującymi zadowolenie i lojalność klientów. Co prawda nie został on opracowany z myślą o projektowaniu interfejsów, ale pozwala dość łatwo i szybko ustalić, jakie funkcje powinny się znaleźć w finalnej wersji produktu.
Gdy zajmowaliśmy się spisem członków Art Directors Guild (związku zawodowego, reprezentującego interesy pracowników branży filmowej i telewizyjnej), naszym celem było zapewnienie tym osobom nowego, łatwiejszego sposobu poszukiwania pracy. Stworzyliśmy dla nich publicznie dostępne profile, w których każdy mógł wymienić swoje umiejętności i osiągnięcia oraz odpowiednie dane kontaktowe. Jak na MVP powstało rozwiązanie zupełnie wystarczające. Dysponowaliśmy jednak bazą danych ze wszystkimi projektami i osiągnięciami członków tej organizacji, więc postanowiliśmy te informacje zestawić i pokazać, które osoby pracowały ze sobą przy poszczególnych produkcjach. Tym samym ułatwiliśmy znajdowanie całych zespołów do zatrudnienia przy nowych produkcjach. Nikt o tę funkcję nie prosił, ale my wdrożyliśmy ją mimo to. Okazało się, że to właśnie nią fascynowało się najwięcej osób.
Należy pamiętać, że funkcje, które dzisiaj użytkowników ekscytują, później mogą stać się funkcjami oczekiwanymi. Gdy w 2007 roku Steve Jobs pokazywał możliwość powiększania obrazu przez uszczypnięcie ekranu iPhone’a, zrobił na wszystkich olbrzymie wrażenie, a dzisiaj to dla nas rzecz całkowicie oczywista. Technologia się rozwija, a my oczekujemy coraz bardziej zaawansowanych funkcji. Dlatego należy nieustannie na nowo oceniać oferowany interfejs i co jakiś czas wzbogacać go o nowe funkcje, by móc znowu zadziwić czymś użytkowników.
→ Członkowie Art Directors Guild mogą szybko uzyskać dostęp do danych wszystkich członków tej organizacji, którzy pracowali przy danej produkcji. Funkcja ta ułatwia znajdowanie całych zespołów, które już się znają
Uniwersalne zasady projektowania
87
Oczekuj tego, co niespodziewane
Jeden z najbardziej złożonych systemów projektowania, jaki kiedykolwiek stworzyliśmy, powstał przy okazji projektowania nowej strony internetowej „USA Today” w 2012 roku. Stanęliśmy przed zadaniem opracowania systemu na tyle uniwersalnego, by mógł zostać wykorzystany przez wszystkie inne gazety należące do tamtej spółki matki, Gannett, a poza tym musieliśmy zadbać o na tyle elastyczny system zarządzania treściami, żeby redaktorzy mogli łatwo zmieniać uszeregowanie wiadomości na stronie głównej, by zawsze znajdowały się na niej najaktualniejsze i najpilniejsze doniesienia.
Wszystkie tworzone przez nas produkty ostatecznie trafiają w ręce klientów, więc opracowywanie systemów samodzielnego publikowania treści, by klient mógł sam dokonywać zmian na swojej stronie, nie jest dla nas niczym nowym. W przypadku strony „USA Today” potrzebne były jednak znacznie potężniejsze możliwości samodzielnego modyfikowania layoutu i znacznie bardziej zaawansowane narzędzia samodzielnej publikacji treści niż wszystko to, co tworzyliśmy wcześniej. Po raz pierwszy w naszej karierze daliśmy klientowi nieograniczone możliwości modyfikowania strony głównej.
Stworzyliśmy wachlarz różnych modułów (patrz zasada 86) dla doniesień bardzo ważnych, mniej ważnych i niezbyt ważnych, żeby redaktorzy mieli wybór i mogli przez cały dzień tworzyć dowolny layout strony głównej według bieżących potrzeb. Stworzyliśmy również odrębne klocki Lego dla wiadomości napływających na żywo (na przykład doniesienia wojenne), wiadomości cyklicznych (na przykład igrzyska olimpijskie, Oscary) oraz wiadomości pilnych. I właśnie wtedy wpłynęła niecodzienna prośba.
Pracowaliśmy akurat nad różnymi postaciami modułu wiadomości pilnych, gdy dyrektor kreatywny Gannett poprosił nas o przygotowanie funkcji, którą na własne potrzeby nazwaliśmy roboczo „pstryczkiem 9/11”. Podczas jednego z wielu spotkań rozmawialiśmy o tym, w jaki sposób nasz system projektowania umożliwiałby reagowanie na wydarzenia w podobnej skali jak zamachy terrorystyczne z 11 września 2001 roku.
Zdecydowaliśmy się na layout „katastroficzny”, w ramach którego cała strona główna zostaje zdjęta i zastąpiona jednym artykułem i nagłówkiem. Ten ekstremalny układ strony miał być zastosowany jedynie w sytuacjach skrajnych, takich jak ataki z 11 września. Bardzo nieliczni przedstawiciele „USA Today” otrzymali uprawnienia do autoryzacji tego layoutu. Protokoły jego aktywacji zostały obłożone takimi obwarowaniami, że żartowaliśmy wręcz, że łatwiej byłoby odpalić rakietę balistyczną z ładunkiem nuklearnym, niż aktywować nasz layout katastroficzny.
Na szczęście nigdy nie pojawiła się konieczność wykorzystania tego layoutu, nie zmienia to jednak faktu, że byliśmy na takie zdarzenia przygotowani. Na tym w sumie polega tworzenie dobrego systemu projektowania: trzeba przewidywać i wyobrażać sobie wszystkie możliwe scenariusze, które mogą mieć wpływ na design. Umożliwia to zbudowanie systemu na solidnych fundamentach logicznych typu „jeżeli to, to tamto”. Drastycznie maleje wówczas ryzyko, że klienci niechcący design popsują, próbując po partyzancku zmusić go do robienia czegoś, do czego nie został zaprojektowany.
→ Przykład codziennej strony głównej „USA Today” z wiadomościami dnia oraz przykład strony głównej na wypadek wielkiej katastrofy krajowej lub międzynarodowej.
Uniwersalne zasady projektowania UX