HCI w rozwoju interfejsów w uŝytkownikau Krótki przegląd d metodyki HCI Koło Naukowe HCI PJWSTK, 21 stycznia 2008r. Marcin Sikorski Politechnika Gdańska PJWSTK Warszawa www.marcinsikorski.net
SPRAWY ORGANIZACYJNE lista członk onków w koła, nowe osoby, terminarz spotkań Data pon 21.01.08 pon 03.03.08 pon 17.03.08 pon 21.04.08 pon 21.05.08 sob 07.06.08 pon 16.06.08 Temat Przegląd d metodyki HCI + film video Project Starfire sesja egzaminacyjna 28.01-22.02.08 22.02.08 Metody badań i analiz interfejsu uŝytkownika u WyposaŜenie laboratorium do testów w uŝytecznou ytecznościci WARSZTAT: Jak prowadzić testy uŝytecznou yteczności ci Eyetracking w badaniach uŝytecznou yteczności: ci: za i przeciw WARSZTAT: Jak prowadzić badania ankietowe z udziałem uŝytkowników Emocjonalne interfejsy i affective design WARSZTAT: Jak opracowywać oferty i kosztorysy badań uŝytecznościci Seminarium Interfejsu uŝytkownika u KANSEI 2008 Spotkanie podsumowujące Seminarium Kansei 2008 Kto M. Sikorski M. Sikorski studenci studenci studenci wszyscy wszystko wkrótce na http://hci.pjwstk.edu.pl hci.pjwstk.edu.pl 2
Interfejs uŝytkownika u i sztuka magiczna 3
W W opinii iluzjonistów w sztuka magiczna składa się z efektu i z metody. Efektem jest to, co dostrzega publiczność ść, metodą zaś jest tajemnica ukryta za efektem, pozwalająca mu zaistnieć. P. Lamont, R.Wiseman Teoria magii 4
Magia interfejsu uŝytkownikau interfejs uŝytkownika u = efekt projekt i kod = metoda projektant interfejsu = iluzjonista (?) 5
Szczególna rola interfejsu uŝytkownika u uŝytkownik niewiele wie o systemie uŝytkownik widzi tylko interfejs uŝytkownika u (IU) IU umoŝliwia: dostęp p do funkcji systemu nawigację w systemie IU moŝe e ułatwiau atwiać,, ale i utrudniać pracę IU dostarcza wraŝeń estetycznych i emocjonalnych kształtuj tujących opinię uŝytkownika o produkcie Dyscyplina Human-Computer Interaction (HCI) zajmuje się: projektowaniem i doskonaleniem komunikacji uŝytkownik-system projektowaniem, oceną i rozwojem interfejsów w uŝytkownika u 6
Kluczowe kryterium: FUNKCJONALNOŚĆ 7
Kluczowe kryterium: UśYTECZNOU YTECZNOŚĆ Usability: effectiveness, efficiency and satisfaction with which users can achieve tasks in a particular environment wysoka jakość uŝytkowa (uŝyteczno yteczność) ) oznacza: skuteczne wspomaganie zadań uŝytkownika łatwość instalacji i obsługi łatwość nauki i zapamiętywania efektywne wspomaganie procesów w pracy odporność na błęb łędy i zakłócenia ze środowiska zadowolenie uŝytkowniku ytkowników Jakość uŝytkowa = jakość postrzegana przez uŝytkownika: jest to róŝnica między wartością oczekiwaną a wartością dostarczoną 8
Obszary HCI http://www.sigchi.org/cdg/ Co obejmuje komunikacja człowiek owiek-komputer komputer? 9
Techniki i metody HCI HCI w projekcie informatycznym: analiza wymagań analiza i modelowanie zadań uŝytkownika projektowanie implementacja testowanie i ocena współpraca praca z uŝytkownikamiu zarządzanie jakości cią w eksploatacji systemu analiza i doskonalenie efektywności biznesowej 10
UCD: projektowanie uŝytkoweu techniki obserwacyjne AKU analiza kontekstu uŝytkowania systemu analiza zadań uŝytkownika (task analysis) inŝynieria wymagań wywiady, ankiety, kwestionariusze spotkania analityczne persony metody warsztatowe sortowanie kart prototypy wstępne testowanie prototypów testy uŝytecznou yteczności ci 11
Nie tylko twarda informatyka Iteracyjny proces wytwórczy: projektowanie uŝytkowe u UCD (User( User-Centred Design) integracja: informatyka, marketing, zarządzanie jakości cią 12
Projektowanie uŝytkowe u UCD Metody i techniki: analityczne eksperymentalne organizatorskie 13
Prawo Fitts a (Paul Fitts 1954) T = a + blog 2 (2D/W) T - czas dosięgnięcia obiektu (ręką, kursorem itp.) D - początkowa odległość pomiędzy ręką a obiektem W wymiar poziomy obiektu a, b współczynniki wyznaczone doświadczalnie prawo Fitts a określa czas dostępu do obiektu, zaleŝnie od jego rozmiaru i odległości od uŝytkownika (operatora) modyfikacje prawa Fitts a dotyczą obliczania czasu kliknięcia obiektu na ekranie z uŝyciem myszy lub innych urządzeń wskazujących z prawa Fitts a moŝna oszacować czasy manualnej reakcji uŝytkownika prawo Fitts a stosuje się dla wszelkich systemów, gdzie istotny jest czas ręcznego naprowadzenia kursora na obiekt 14
Prawo Fitts a T = a + blog 2 (2D/W) = czas dosięgnięcia obiektu kursorem Oblicz: Który obiekt zostanie najszybciej trafiony? 15
Metoda CTTE (ConcurTaskTreeEnvironm( ConcurTaskTreeEnvironm.) Analiza zadań uŝytkownika Task Analysis (TA) model sieci czynności ci pomoc w określeniu docelowej funkcjonalności ci systemu 16
Model KLM model KLM (Keystroke( Keystroke-Level Model) pozwala na oszacowanie czasu wykonywania typowych działań Naciśni nięcie klawisza Czynność Wskazanie obiektu kursorem myszy Ruch ręki r klawiatura-mysz Przeniesienie wzroku na ekranie Reakcja na sygnał świetlny Reakcja na sygnał akustyczny Rozpoznanie słowa s 6-literowego6 Przywołanie obiektu z pamięci roboczej Nauczenie się kroku w procedurze Wykonanie kroku w pracy umysłowej Wybór r pomiędzy metodami Czas przec. 0,28 1,5 0,3 0,23 0,1 1,0 0,34 1,2 25 0,08 1,2 od - do 0,07-2,0 0,5-5,0 5,0 0,21-0,36 0,36 0,2-1,5 0,05-0,2 0,2 0,1-2,0 0,21-0,36 0,36 10-? 0,05-0,1 0,1 0,06-1,8 analizuje się łańcuchy czynności ci pod kątem k zwiększenia szybkości wykonywania zadań 17
Planowanie uŝytecznou yteczności ci Persona Persona określenie profilu docelowego uŝytkownikau Pronix Anna Belloni Project manager Anna Beloni, 27, is a hard working project manager at the mid-sized software house Pronix in Milan (offthe-shelf application software). She has been working with software development for eight years now and knows the business well. A year ago she went to a presentation on usability, and she's convinced that this can turn out to provide a winning edge for Pronix. Since, she's been reading more on the subject - not at depth but to understand it better, and she has been busy lobbying for a stronger focus on usability and user - centred opis typowych design. Pronix 5 zadań has now wykonywanych agreed to hire an interaction z systemem designer, przez so the tego battle uŝytkownika has been successful so far. However, Malena feels that she needs much more information on cost-benefit issues to keep making her case. Specifically, she's looking for business cases and ROI calculations that are detailed and trustworthy -(loads opis of 4 uŝytkowników statistics wouldn't hurt). tego One samego problem systemu, with the information ale na innych she has stanowiskach found on the web today is that it isn't very objective, but often promotes a company. RAZEM: She would also like to one day find a compiled description of competences and salary statistics - she is only in 5 the zadań beginning x 4 of typowych a grand scheme uŝytkowników that will be concluded = 20 scenariuszy when she's recruited wykorzystania a team of competent systemu usability professionals... Another long-term plan of Malena's - - - is to make sure that usability is a natural part Persona of the software pozwala development na lepsze process rozpoznanie at Pronix - she's wymagań sure it must i be środowiska possible. uŝytkowania systemu 18
Techniki pracy z uŝytkownikamiu obserwacja bezpośrednia rejestracja video ankiety: wywiady, kwestionariusze oceny produktu rejestracja obsługi urządze dzeń przenośnych nych 19
Analiza wymagań sortowanie kart metody warsztatowe określenie priorytetów dla wymagań projekcja struktury systemu postrzeganej przez uŝytkowników serwisy WWW: podział na sekcje tematyczne aplikacje: podział na moduły procesy: podział na etapy łatwe przejście do opracowania prototypu 20
Badania uŝytecznou yteczności ci - prototypowanie budowa i testowanie prototypów w jako podstawowa metoda pracy testowanie i ocena prototypów przez uŝytkowniku ytkowników prototypy papierowe low-fidelity prototypes prototypy zaimplementowane high-fidelity prototypes 21
Testy uŝytecznou yteczności ci rejestracja pracy uŝytkownika na video nie sąs potrzebne duŝe e nakłady ady finansowe są dostępne róŝnorodne r techniki analizy zdarzeń 22
Badania zachowań uŝytkowników Eyetracking (okulografia( okulografia): badanie ruchów w gałki ocznej uŝytkownikau określenie preferowanej ścieŝki obserwacji ekranu 23
Symulatory GUI projektowanie prototypu GUI bez pisania kodu źródło: Caretta Software 24
Wybrane obszary zastosowań HCI 25
Klasyczny GUI 26
Oprogramowanie i aplikacje oprogramowanie uŝytkowe, u systemy dla przedsiębiorstw Wymagania uŝytkowe u i ergonomiczne: klarowność wizualna spójno jność dialogu zgodność z oczekiwaniami przejrzystość struktury prowadzenie uŝytkownikau potwierdzenia i status systemu kontrola przez uŝytkownikau elastyczność i indywidualizacja automatyzacja typowych zadań obsługa błęb łędów Narzekania uŝytkowniku ytkowników: w: produkt wspomaga wykonywanie zadań w zbyt wąskim w zakresie obsługa produktu zbyt zawiła, a, nauka sprawia duŝe e trudności zbyt mała a moŝliwo liwość dopasowania produktu do zmieniających się potrzeb trudności ze współprac pracą z innymi systemami (programami) niespójno jności w operacjach manualnych i w warstwie prezentacyjnej... 27
Oprogramowanie i aplikacje przykład 28
Przewodniki stylu do projektowania IU Przewodniki stylu (ang. styleguide): są przeznaczone dla projektantów w i programistów w IU podają zasady ogólne projektowania oraz wzorcowe rozwiązania zania okien dialogowych, menu, ikon itp. cel: zachowanie zgodności i spójno jności ze środowiskiem Microsoft Windows GUI and User Experience Styleguide: http://msdn2.microsoft.com/en en-us/library/ms997431.aspx 29
Interfejs WWW 30
Serwisy WWW strony WWW firm i instytucji e-biznes, usługi ugi elektroniczne Wymagania uŝytkowe u i ergonomiczne: czytelny podział na sekcje łatwa nawigacja zgodność ze standardami treść zgodna z potrzebami atrakcyjność wizualna szybkie ładowanie stron poprawne drukowanie stron pełna dostępno pność dla wszystkich narzędzie: idesigner Narzekania uŝytkowniku ytkowników: w: nieczytelna struktura serwisu, dziwny podział na sekcje tematyczne trudna i zniechęcaj cająca nawigacja, poczucie zagubienia powolne ładowanie stron, przeładowanie zbędn dną grafiką trudne do zapamiętania adresy URL, problemy z zakładkami adkami za długie d strony, brak podziału u formularzy na sekcje... 31
Interfejs WWW pomysłowe owe innowacje 32
Pomoce do projektowania interfejsu WWW Rosenfeld L., Morville P. (2003). Architektura informacji w serwisach internetowych. Wyd. Helion Warszawa. Nielsen J. (2003). Projektowanie funkcjonalnych serwisów internetowych. Wyd. Helion Warszawa. Pearrow M. (2002). Funkcjonalność serwisów internetowych. Wyd. Helion Warszawa Nielsen J., Loranger H. (2007). Optymalizacja funkcjonalności serwisów internetowych. Wyd. Helion Warszawa. 33
Dostępno pność stron WWW dla niedowidzących wymagania W3C wizualny test strony http://www.alphaworks.ibm.com/tech/adesigner 34
UŜyteczność zawartości 35
UŜyteczność treści zainteresowanie: zgodność treści z potrzebami informacyjnymi czytelnika bezpośrednia korzyść (wartość ść) ) dla czytelnika układ treści na stronie lead na początku tekstu formatowanie nagłówk wków typografia, wielkość czcionki, odstepy styl krótkie zdania, podział na sekcje zapewnienie wiarygodności autor, data aktualizacji, dane kontaktowe linki do źródeł zewnętrznych 36
Formatowanie treści - przykład 37
Interfejsy urządze dzeń mobilnych 38
Uniwersalność - dopasowanie do potrzeb 39
Zaufanie i budowa relacji z klientem 40
Serwisy WWW - wiarygodność usługi ugi specjalistyczne, e-sklepye instytucje finansowe, administracyjne, prawnicze Wymagania specyficzne: budowa wiarygodności oferenta dostarczanie pozytywnych odczuć ( user experience ) kształtowanie towanie wizerunku firmy/instytucji + ZAUFANIE Jak budować zaufanie uŝytkownika: u Zaufanie wzmacniają: linki do uznanych firm i instytucji pełen adres, zdjęcie siedziby firmy nr rejestru handlowego, nr konta bankowego i nazwa banku standardowe warunki dostawy, gwarancji i zwrotu towaru poszukiwanie nowych pracowników dane giełdowe, dane o wynikach finansowych Zaufanie osłabiają: brak cennika, listy referencyjnej puste linki, nieaktualne dane brak nazwisk kierownictwa telefony: numery komórkowe tylko jedna forma płatności barokowy design wraŝenie amatorszczyzny niestosowne animacje 41
Serwisy WWW wiarygodność i zaufanie przykład środki budowy wiarygodności 42
Systemy e-biznesu e budowa relacji tworzenie wartości dla klienta poziomy rozwoju produktu interaktywnego Value Lifestyle Service Relationship Loyalty Added-value products innovation Experience Delight Device Usability Satisfaction Functionality Productivity informacje transakcje proces relacja 43
Przykład: usługi ugi finansowe klient z pomocą systemu oblicza wysokość wymaganej składki na fundusz edukacji dziecka www.fidelity.com financial options: investments & services scenariusz: informacje transakcje proces relacja 44
Podsumowanie 45
Dlaczego warto zajmować się HCI jest to waŝny obszar zarządzania jakości cią w projekcie informatycznym jest to obszar ciekawy, bo interdyscyplinarny: technologia, psychologia, zarządzanie, marketing, waŝnymi elementami projektu informatycznego sąs projektowanie interfejsu uŝytkownika u prowadzenie testów w uŝytecznou yteczności ci umiejętno tność organizowania współpracy pracy z uŝytkownikami u firmy poszukują specjalistów w od IU dobry interfejs wpływa na odbiór r jakości produktu i podnosi jego atrakcyjność dla klientów 46
Koło Naukowe HCI PJWSTK, 21 stycznia 2008r. Dziękuj kuję Proszę o pytania Marcin.Sikorski@pjwstk.edu.pl Wykorzystano materiały firm: Magit, MCM, Noldus, NN/g, SilverOrange http://www.marcinsikorski.net 47