Warsztat: Zabawa w agencję interaktywną. Projekt od A do Z.

Warsztat: Zabawa w agencję interaktywną. Projekt od A do Z. Tomasz Karwatka {Divante i Ideacto}

Plan

Stworzyć projekt serwisu WWW

Zgodnie z User-Centered Design

Przy użyciu prototypowania

Nie jest lekko

We’re surrounded.

That simplifies our problem of getting to these people and killing them. *

- Chesty Puller

* Motto z naszego biura

Cel biznesowy

Cel biznesowy: …

Potrzeby użytkowników: …

Analiza

Analiza kontekstu użytkownika

Przegląd rozwiązań konkurencyjnych

Jakie indywidualne cechy użytkowników mogą wpłynąć na ich zachowanie / percepcję podczas korzystani a z serwisu ?

Jakie doświadczenie i wiedzę mają użytkownicy w wykonywaniu zadań?

Jak silnie są zmotywowani użytkownicy , podczas wykon ywania zadania ?

Jakie są przyczyny tego, że użytkownicy wykonują swoje zadania?

Jakie doświadczenie i wiedzę mają w korzystaniu z innych serwisów ?

Wszystkie aspekty związane z użytkownikami, które będą miały znaczenie przy korzystaniu przez nich z serwisu

Zebranie grupy ludzi, którzy najczęściej kontaktują się z użytkownikami, np. obsługa klienta

Zrobienie listy potencjalnych użytkowników – podział na kluczowe segmenty wg wieku, wykształcenia, doświadczenia z Internetem, zawodu , ról jakie pełnią korzystając z systemu itp.

Określenie jakie zadania będą wykonywać poszczególne grupy: publikacja ogłoszeń, przeglądanie ogłoszeń, kupno domu dla rodziny, kupno samochodu dla żony, znalezienie wakacyjnej pracy – poziom szczegółowości zadań

Opis użytkowników – źródła wiedzy

Wybór metody weryfikującej założenia (badania jakościowe)

Obserwacje

Wywiady

Źródła wiedzy o użytkownikach

Użytkownicy

Statystyki

Ludzie kontaktujący się z użytkownikami

Fora internetowe

Znajomi

Artefakty

Eksperci

My sami, jako użytkownicy

Analiza - Testy porównawcze

Analiza - Zasięg Alexa.com

Generowanie koncepcji

Burze mózgów

Techniki kreatywne

Archiwizacja

Ewaluacja ekspercka

Ewaluacja - Less is more

Rozwiązuj jeden problem

Omijaj trudne problemy

Tylko niezbędne funkcje

Nie dokumentuj, twórz prototypy

Uruchamiaj jak najwcześniej

Trzy osoby to idealny team

Prototypowanie

Scenariusze (use case) – wybierzmy jeden

Diagramy przejść

Struktura

Architektura informacji

Makiety funkcjonalne

Działające prototypy

Dokumentacja

Diagramy przejść

Struktura serwisu Mało, kto wie, że „mały gwint” to E14. Aby zadowolić wszystkich użytkowników do kategorii dodano obrazki.

Struktura

http://freemind.sourceforge.net/wiki/index.php/Main_Page#Download .

Architektura informacji - Patterns

http://developer.yahoo.com/ypatterns/

http://interface.fh-potsdam.de/infodesignpatterns/patterns.php

Makiety funkcjonalne

Makiety funkcjonalne - Axure

Testowanie - Test Kruga

Co to jest za witryna (identyfikator witryny)?

Na jakiej jestem stronie (nazwa strony)?

Jakie są główne kategorie?

Jakie mam opcje do wyboru na tym poziomie struktury?

Gdzie znajduję się w odniesieniu do całej struktury?

W jaki sposób mogę czegoś poszukać?

Testowanie – testy z użytkownikami

Na podstawie celów biznesowych serwisu i ustaleń z klientem opracuj zadania testowe do badania. W czasie jednego badania użytkownik zrealizuje od 4 do 12 zadań. Zadania należy dopasować tak aby całe badanie nie trwało dłużej niż 90 minut.

Przetestuj realizowalność zadań.

Przygotuj kwestionariusze wywiadu przed badaniem i po badaniu. Warto przeprowadzić krótki wywiad z użytkownikiem przed badaniem aby dowiedzieć się czegoś o sposobie w jaki korzysta z Internetu. Po badaniu warto poznać ogólne opinie o badanym serwisie.

Przygotuj dokumenty potrzebne do przeprowadzenia badań. Będą to umowa z osobą badaną, klauzula poufności, zezwolenie na ew. nagranie badań, wydruk zadań testowych oraz kwestionariuszy wywiadu, formatki do prowadzenie notatek podczas badania.

Zrekrutuj użytkowników. Zapewnij sobie minimum 30 minut przerwy pomiędzy badaniami abyś mógł przygotować środowisko testowe i omówić wyniki badania.

Ustal harmonogram testów. Testy najlepiej prowadzić z obserwatorem. Moderator może wtedy skupić się na prowadzeniu badania, bez obawy, że pominie jakiś szczegół w notatkach.

Zapewnij odpowiednie miejsce do przeprowadzenia testów oraz odpowiedni sprzęt, dobre łącze do Internetu, ewentualny sprzęt nagrywający.

Przeprowadź testy. Zacznij od próbnego zadania na rozgrzewkę, aby odstresować badanego. Bądź uprzejmy i dbaj o poczucie własnej wartości użytkowników. Testujesz strony, nie ludzi. Podczas testów:

Zachęcaj do głośnego myślenia.

Jeśli nie wiesz, co myśli użytkownik – zapytaj o to.

Nie udzielaj wskazówek dotyczących tego jak mają postępować.

Wydawaj proste i klarowne polecenia.

Bezpośrednio po sesji rób notatki.

Uprzedź użytkownika, że:

Będzie nagrywany

Nie będziesz w trakcie testu odpowiadać na jego pytania

Wynagrodzenie nie zależy od wyniku testów

Omów notatki z testów i przygotuj wnioski . Opcjonalnie opracuj nagrania video z testów.

Testy użyteczności a testy grupowe Testy grupowe Testy użyteczności Niewielka grupa osób Pojedynczy użytkownik Uczestnicy reagują na koncepcje i projekty, które im się przedstawia Prosi się użytkownika o określenie co to jest, do czego służy lub aby użył danej rzeczy 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 powstać ma witryna. Można sprawdzić też wykorzystywane w witrynie słownictwo. Sprawdzenie czy witryna funkcjonuje poprawnie i określenie na jakie problemy napotyka użytkownik. Wykonywane na początku procesu tworzenia serwisu. Wykonywane na końcu procesu tworzenia serwisu.

Porównawcze testy usability Wersja 01 Wersja 02 Strona główna - skojarzenie ze sklepem, z możliwością porównania cen z innych sklepów - kojarzy się ze sklepem ze sprzętem komputerowym, ale też sprzedają inne rzeczy [bo widoczne różne zdjęcia] - nie rzuca się w oczy że jest to porównywarka - można coś kupić, dowiedzieć się jaka jest najlepsza cena, porównać, dowiedzieć się na co zwrócić uwagę - kojarzy się ze stroną, która jest bardziej nastawiona na sprzęt, na określoną tematykę [ze względu na zdjęcia] - kategorie w kolumnach lepiej się czyta niż listy w drugiej wersji, - zostawić kolumny kategorii ale dodać z poprzedniego ikony Box „Najlepsze ceny” - dobrze, że jest ale mało rzuca się w oczy, powinny być bardziej przejrzyste, może sama nazwą lub wyraźne okienko z najlepszą ceną.. - bardziej zaznaczone, że porównywarka ale wciąż mało rzuca się w oczy - kojarzy się ze stroną Allegro (podobna lista) - bardziej przejrzysta, klarowna, widoczna - przydałyby się te dwa kwadraty z I wersji, ale b. przejrzyste - można zakupić przez Internet, pooglądać, dowiedzieć się gdzie można kupić - jeśli szuka się ogólnie, różnych rzeczy to ta jest lepsza

Optymalizacja

Dokumentacja produkcyjna

Jakość