Projektowanie zorientowane na użytkownika user-centered design Ksenia Jałocha Marta Wandzel Mateusz Muryjas Interfejs użytkownika Kraków, 12 marca 2015
Plan na dziś 1. Wstęp i wprowadzenie do tematu user-centered design 2. Procesy, narzędzia i elementy ważne w projektowaniu zorientowanym na użytkownika 3. Wady i zalety user-centered design 4. Alternatywne podejścia do projektowania interfejsów
Zacznijmy od.. Gdyby interfejs był filmem..
Czasem wcale nie jest śmiesznie
Postawmy sobie pewną tezę zaspokajana przez człowiek (potrzeba) technologia (interfejs) generuje technologia (interfejs) człowiek (potrzeba)
Rozszerzmy ją jeszcze o jeden aspekt
User-centered Design Projektowanie zorientowane na użytkownika (user-centered design) to proces, w którym potrzeby, oczekiwania i ograniczenia końcowego użytkownika produktu, usługi lub procesu odkrywają kluczową rolę na każdym etapie procesu projektowania i wdrażania. Zagadnienie projektowania zorientowanego na użytkownika jest bardzo szerokim pojęciem, obejmującym wiele procesów i narzędzi pozwalających postawić użytkownika w centrum projektu.
Przykład?
Procesy, narzędzia i elementy ważne w projektowaniu zorientowanym na użytkownika
Użytkownik Komunikacja
ANALIZA I PRZYGOTOWANIE PROJEKTU Znaczenie badań Zmienność!
1. Kim są użytkownicy serwisu/systemu? 2. Do czego będzie służył im serwis? 3. Jakie są ich umiejętności? 4. Czy serwis lub użytkownicy będą napotykać na utrudnienia zewnetrzne?
Warsztaty z użytkownikami Affinity diagramming - diagramy pokrewieństwa Grupowanie dużej ilości informacji w celu ich łatwiejszego zrozumienia i wykorzystania w dalszej pracy.
Affinity diagramming Pozwala na poznanie idei i sposobu myślenia uczestników (w przypadku projektowania użytkowników). Umożliwia zebranie rozproszonych danych od uczestników i przekształcenie ich w wartościową bazę informacji (np. kryteria projektowe). Uczy pracy grupowej. Angażuje wszystkich uczestników, dzięki czemu pozyskane informacje mają charakter wspólnej własności. Niski koszt przeprowadzenia badania. Wizualizacja wypracowanych przez grupę rozwiązań.
Persony Persona - archetyp użytkownika danego produktu przedstawiony w postaci perswazyjnego, uczłowieczonego opisu cech, umiejętności, potrzeb, celów (zarówno życiowych jak i realizowanych przy użyciu produktu). Zadaniem takich modeli jest przybliżenie zespołowi pracującemu nad projektem różnych typów użytkowników, tak, aby ułatwić podjęcie decyzji związanych z koncepcją, funkcjonalnościami projektu oraz grafiką.
Ankiety Sposób na względnie szybkie, tanie i łatwe zgromadzenie dużej ilości informacji Możliwe uzyskanie danych od reprezentatywnej statystycznie grupy respondentów pochodzących często z odległych miejsc. Wysoka standaryzacja pytań i odpowiedzi umożliwiająca sprawną analizę oraz przejrzysty output Dostęp do poufnych informacji dzięki zapewnieniu pełnej anonimowości respondentom Jakościowe w przypadku udzielania przez respondentów bardziej rozbudowanych odpowiedzi na pytania otwarte, umożliwiające również podzielenie się własnym komentarzem
KONCEPCJA I PROJEKTOWANIE
Preprodukcja Cel: uzyskanie dobrego projektu przed przystąpieniem do pisania kodu XHTML i CSS. burze mózgów, szkice metafora wizualna, motyw przewodni Użytkownik może zatwierdzić koncept, zanim zmiany są łatwe do wprowadzenia.
Preprodukcja Burze mózgów są prowadzone by wygenerować świeże pomysły, koncepcje. Po wygenerowaniu pomysłów są one poddawane krytycznej ocenie ekspertów i użytkowników.
Preprodukcja burza mózgów szkice Do czego ma służyć strona? MOTYW PRZEWODNI METAFORA WIZUALNA
Badanie fokusowe - moderowana dyskusja wśród potencjalnych użytkowników witryny internetowej przeprowadzana w celu odkrycia istotnych dla właścicieli witryn opinii. KONCEPCJA Grupy: 5-8 osób ok. 2h
Badania fokusowe są wykorzystywane do głębokiego poznania profilu grupy docelowej witryny internetowej. Pozwalają na odkrycie ich potrzeb oraz preferencji (gdy strona jeszcze nie powstała), ale również do oceny satysfakcji i postrzegania analizowanej witryny.
Uzyskane informacje skupiają się wokół opinii na temat koncepcji, prototypów, nawigacji, przyjętej strategii i wyglądu witryny. Wywiady fokusowe są również pomocne przy konsultacjach społecznych oraz do uzyskania porozumienia w określonych kwestiach. Najczęstszym celem badań fokusowych jest sprawdzenie sensowności koncepcji serwisu internetowego oraz analiza atrakcyjności jego zawartości. Pochodną badań są również informacje dotyczące nazewnictwa etykiet w nawigacji oraz stopnia zrozumienia innych użytych nazw.
Preprodukcja Architektura informacji tworzona jest w początkowej fazie projektu. Pracujemy na wcześniej zgromadzonej wiedzy, burzy mózgów, stworzonych i przetestowanych koncepcjach. Projektujemy kolejne prototypy interfejsu. W kolejnych iteracjach poddajemy je ocenie ekspertów i użytkowników, wnioski z testów nanosimy na prototyp. Prototypy systemu tworzone są zarówno w postaci papierowej (paper prototyping) jak i w postaci klikalnych prezentacji Power Point i HTML. W ostatecznej fazie prototypowania mogą być używane prototypy graficzne.
Makiety funkcjonalne Makiety (wireframes) to po prostu rysunki interfejsu i funkcjonalności produktu. Prototypy to makiety na których można sprawdzić interakcję z produktem, a więc najczęściej klikalne.
Makieta funkcjonalna Co to jest za witryna (identyfikator witryny)? Na jakiej jestem stronie? Jakie są główne kategorie? Co mogę tutaj zrobić?
Organizacja strony Dopasowanie zawartości strony do jej układu NAWIGACJA: wygodne, wydajne i efektywne przeszukiwanie i przeglądanie treści i zasobów serwisu. Zasada trzech kliknięć użytkownik w każdej chwili ma mieć pełną świadomość swojego obecnego położenia liczba elementów 7+/-2 (?) grupowanie elementów nawigacji według logicznych kryteriów sprzyja tworzeniu przyjaznych interfejsów użytkownika nazwy krótkie i opisowe (dla studentów)
Organizacja strony Dobra nawigacja zależy od ARCHITEKTURY INFORMACJI grupy znaczące i logiczne. SORTOWANIE KART: stos kart 7x12 cm, pisak, wolny blat stołu, kawałek podłogi, wiedza o zawartości strony.
Organizacja strony Nazewnictwo elementów: własny, unikatowy, opisowy i wymowny tytuł hierarchia nagłówków - max. 1 <h1> Tekst i typografia: czarny tekst na jednorodnych, kontrastowych tłach; popularne kroje czcionek rzadkie wyróżnianie tekstu (coś ważnego) zasada odwróconej piramidy
Audyt dostępności strony internetowej Cel: wykrycie przeszkód na jakie mogą natrafić na stronie internetowej ludzie z dysfunkcjami oraz zapewnienie skutecznej rekomendacji poprawy błędów. Standardy Web Content Accessibility Guidelines (WCAG) zbiór wyznaczników zapewniających dostępność zawartości strony dla ludzi niepełnosprawnych. DOSTĘPNOŚĆ == strona może być używana przez osoby niewidome, niedowidzące lub z innymi wadami wzroku, niesłyszące lub mające problemy z używaniem myszy i klawiatury.
Audyt dostępności strony internetowej Dostępność NIE oznacza rezygnacji z treści audio, wideo czy grafiki na stronie, lecz właściwe jej umieszczenie i oznaczenie. Dostępność stron dla osób niepełnosprawnych najczęściej nie ma żadnego przełożenia biznesowego!!!! Lista wytycznych Web Content Accessibility Guidelines WCAG 2.0: http://fdc.org.pl/wcag2/g2/
BADANIA NA RÓŻNYCH ETAPACH PROJEKTU
Testy z użytkownikami Testy z użytkownikami są podstawowa i najważniejszą techniką badania użyteczności produktów.
Testy z użytkownikami a badania fokusowe TESTY FOKUSOWE TESTY Z UŻYTKOWNIKAMI Wykonywane są na początku procesu tworzenia produktu. Badane są koncepcje. Wykonywane w trakcie procesu projektowania projektowania. Badane są prototypy. Niewielka grupa badanych. Pojedynczy użytkownik. Uczestnicy oceniają i komentują koncepcje i projekty, które im się przedstawia. Użytkownik wykonuje zadania testowe posługując się badanym produktem. Dobre do szybkiego uzyskania próbek opinii i odczuć użytkowników. Nadają się do sprawdzenia oczekiwań odbiorców, określenia ich potrzeb. Pozwalają ocenić pomysł, na bazie którego ma powstać produkt. Sprawdzenie, czy prototyp lub produkt funkcjonuje poprawnie i określenie, na jakie problemy napotyka użytkownik podczas pracy.
Testy z użytkownikami Proces: Ustalenie obszaru badania; zdefiniowanie problemu. Identyfikacja grupy docelowej serwisu. Ustalenie scenariuszy testowych. Przeprowadzenie badań pilotażowych i ew. adiustacja scenariuszy. Rekrutacja użytkowników do testu. Przeprowadzenie testów z użytkownikami.
Testy z użytkownikami Wprowadzenie użytkownika, zapoznanie z przebiegiem testu. Wypełnianie ankiety pre (+/-). Realizacja zadania pilotażowego. Realizacja scenariuszy testowych. Elementy wywiadu pogłębionego. Wypełnienie ankiety post (+/-). Zamknięcie spraw formalnych, opłata dla użytkownika.
Testy z użytkownikami Opcjonalne nagranie testów (audio, wideo, ekran) i obróbka materiału. Opracowanie zapisu sesji i omówienie ich w gronie obserwator, moderator, kient. Opracowanie wniosków i wytycznych projektowych na podstawie wyników testów.
Eye-tracking mobilny (ang. mobile eye tracking) to nieinwazyjna technika stosowana w badaniach użyteczności, mająca na celu uzyskanie informacji odnośnie ruchu oka w naturalnym dla osób badanych otoczeniu. Możliwość bezinwazyjnej obserwacji ruchu gałek ocznych osób badanych w naturalnym dla tych ostatnich środowisku Relatywnie krótki czas przeprowadzenia badania Wyniki testów są zazwyczaj prezentowane w postaci map ciepłych miejsc (ang. heat maps ).
Click-tracking - metoda wizualizacji aktywności użytkownika na danej stronie internetowej w celu sporządzenia mapy termicznej, która pozwala na lokalizację w obrębie strony miejsc najczęściej klikanych bądź omijanych przez użytkownika. w co dokładnie klikają użytkownicy; dane ilościowe statystyki dotyczące kliknięć w obszary nieklikalne, linki tekstowe oraz graficzne; Poznajesz obszary o największym i najmniejszym zainteresowaniu użytkowników, miejsca, które powinieneś podlinkować.
Analiza heurystyczna Ewaulacja heurystyczna pozwala wykryć problem usability występujący w badanym produkcie. Metoda ta opiera się na analizie wykonywanej przez ekspertów oceniają zgodność testowanego interfejsu z uznanymi regułami usability (heurystyki). min. 2 osoby (!) wyniki ewaulacji scalane do spójnej postaci. heurystyki doświadczenie!
Heurystyki usability opracowane przez Nielsena i Molicha 1. Widoczność stanu systemu.
2. Dostosowanie do świata rzeczywistego (?)
3. Kontrola i wolność wyboru. 4. Spójność i standardy. 5. Zapobieganie błędom. 6. Rozpoznawanie a NIE przypominanie.
7. Elastyczność i efektywność 8. Estetyka i umiar. 9. Pomoc w rozpoznawaniu i radzeniu sobie z błędami. 10. Pomoc i dokumentacja.
Podsumowanie wiadomości o UCD Projektowanie zorientowane na użytkownika (user-centered design) to proces, w którym potrzeby, oczekiwania i ograniczenia końcowego użytkownika produktu, usługi lub procesu odkrywają kluczową rolę na każdym etapie procesu projektowania i wdrażania. Proces ten składa się z wielu podprocesów i elementów (narzędzi, metod) pozwalających na postawienie użytkownika w centrum procesu projektowania, jest niezwykle rozbudowany, czasochłonny i - z praktycznego punktu widzenia - nie zawsze realizowany w pełni.
Podsumowanie wiadomości o UCD Wady Zalety Wytworzony produkt jest bardziej efektywny Zaangażowanie użytkownika końcowego w proces projektowy Ostateczna forma i kształt produktu wytworzone przez użytkownika końcowego Potencjalnie szybka adaptacja produktu w środowisku Rozbudowany zespół projektowy generuje więcej "kreatywnych" rozwiązań pojawiających się problemów Czas realizacji projektu Koszt realizacji projektu Interdyscyplinarność zespołu zaangażowanie zewnętrznych osób w realizację projektu Zbyt szeroka grupa tzw. klienta docelowego
Alternatywy.
Activity Centered Design (ACD) Skupiamy się NIE na userze tylko na jego AKTYWNOŚCIACH!!
Goal-Directed Design (GDD) Jakie są życzenia użytkowników? Co spośród tych życzeń pozwoli utrzymać biznes? Co możemy stworzyć z tych założeń?
Unintended Design Produkt jest frustrujący w użyciu dlatego, że nikt go nie zaprojektował
Self design Projektanci wcielają się w docelową grupę użytkowników.
Genius design Opiera się na doświadczeniu projektantów.