"<h3>Wskazówki do tworzenia użytecznego systemu informatycznego</h3> \n",
"\n",
"<ol>\n",
"<li> Autorze: Poznaj użytkownika, a TY nie jesteś użytkownikiem. </li> \n",
" <li> Użytkownik powinien mieć kontrolę nad systemem, a nie odwrotnie: to użytkownik jest szefem i system powinien to okazywać. </li> \n",
" <li> System musi ułatwiać użytkownikowi życie:</li>\n",
" <ul>\n",
" <li> Elementy, które wyglądają tak samo, powinny działać tak samo, a akcje, które nie działają tak samo powinny być inaczej reprezentowane. </li>\n",
" <li> Każda akcja użytkownika powinna mieć reakcję programu. </li>\n",
" <li> Kiedy użytkownik ma do podjęcia decyzję, system podaje mu całą dostępną informację. </li>\n",
" </ul> \n",
" <li> System musi być \"idioto-odporny\": </li>\n",
" <ul>\n",
" <li> Każdy robi błędy, więc każdy błąd powinien dać się naprawić. </li>\n",
" <li> Gdy użytkownik zrobi błąd, System daje mu o tym znać, zanim … wpadnie w PRAWDZIWE kłopoty. </li>\n",
" <li> Informacje o błędach powinny być zrozumiałe dla użytkownika i mówić mu, jak naprawić problem. </li>\n",
" </ul> \n",
" <li> Wczuj się w użytkownika </li>\n",
" <ul>\n",
" <li> Eliminuj niepotrzebne decyzje (nie pytaj, jak nie musisz). </li>\n",
" <li> Im mniej kroków do celu, tym lepiej.</li> \n",
" <li> Użytkownik powinien zawsze móc dowiedzieć się, co robić dalej. </li>\n",
" <li> Użytkownik powinien zawsze wiedzieć, co się dzieje.\n",
" * Szybkie przechodzenie po różnych elementach serwisu.\n",
" * Łatwe prowadzenie użytkownika do poszukiwanej informacji. \n",
" * Klarowność: użytkownik wie gdzie jest, gdzie może się skierować, jak wrócić, a także posiada informacje o odwiedzonych miejscach. \n",
" * Oszczędność: główne menu witryny nie powinno zawierać zbyt wielu elementów (między 5 a 9)"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## 3.3. Zasady użytecznej nawigacji"
]
},
{
"attachments": {},
"cell_type": "markdown",
"metadata": {},
"source": [
"### Zasada 1. Widoczność\n",
"Wszystkie elementy nawigacji muszą być bardzo dobrze widoczne na każdej stronie i podstronie serwisu."
]
},
{
"attachments": {},
"cell_type": "markdown",
"metadata": {},
"source": [
"### Zasada 2. Przewidywalność\n",
" * Nazwy elementów menu powinny pozwalać na przewidzenie zawartości\n",
" * Elementy menu powinny informować użytkownika o całej zawartości witryny.\n",
" * Odwiedzone linki powinny być oznaczone innym kolorem niż nieodwiedzone. "
]
},
{
"attachments": {},
"cell_type": "markdown",
"metadata": {},
"source": [
"### Zasada 3. Łatwość orientacji w strukturze serwisu\n",
"* Powinno się stosować różne style wyróżnienia jego elementów:\n",
" * dla całej kategorii, na której aktualnie znajduje się kursor (np. Aktualności),\n",
" * dla pozycji w menu, z której aktualnie korzysta użytkownik (np. Publikacje zagraniczne),\n",
" * dla pozostałych elementów serwisu."
]
},
{
"attachments": {},
"cell_type": "markdown",
"metadata": {},
"source": [
"### Zasada 4. Zasada odwróconej piramidy\n",
" * Na najwyższym poziomie należy umieścić kategorie najbardziej ogólne, a następnie przechodzić do podziału bardziej szczegółowego. \n",
" * Na tym samym poziomie powinny znajdować się kategorie o tym samym stopniu szczegółowości."
]
},
{
"attachments": {},
"cell_type": "markdown",
"metadata": {},
"source": [
"### Zasada 5. Właściwe nazewnictwo\n",
" * Wykluczający podział etykiet menu: \n",
" * dana pozycja w menu może należeć tylko do jednej kategorii.\n",
" * Proste nazewnictwo: \n",
" * etykiety powinno formułować się w języku zrozumiałym dla użytkownika,\n",
" * powinno unikać się specjalistycznego słownictwa.\n",
" * Unikalne nazwy: \n",
" * dana nazwa powinna pojawiać się w serwisie internetowym nie więcej niż raz,\n",
" * każda strona powinna mieć swoja nazwę.\n",
" * Nazwa strony musi być dobrze widoczna:\n",
" * nazwa strony musi być w dobrze umiejscowiona i wyróżniona za pomocą rozmiaru i koloru czcionki.\n",
" * Nazwa strony lub podstrony musi być zgodna z nazwą odsyłacza, który do niej prowadzi."
]
},
{
"attachments": {},
"cell_type": "markdown",
"metadata": {},
"source": [
"### Zasada 6. Spójność w wyglądzie i działaniu elementów nawigacyjnych\n",
"* Należy stosować te same konwencje w obrębie całego menu. \n",
"* Elementy pierwszego poziomu powinny pozostawać niezmienne w trakcie korzystania z całego serwisu internetowego. \n",
"* Wszystkie pozycje w menu powinny funkcjonować na tej samej zasadzie. \n",
"* Przy formułowaniu nazw w menu należy w każdym przypadku stosować tę samą formę gramatyczną.\n",
"* Pozycje menu należące do jednego poziomu powinny być sformatowane w jednym stylu."
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"# 4. Metody badania użyteczności"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## 4.1. Automatyczne metody badania użyteczności"
]
},
{
"attachments": {},
"cell_type": "markdown",
"metadata": {},
"source": [
"### Badanie współczynnika konwersji\n",
"**Współczynnik konwersji** wskazuje, jaka część internautów odwiedzających daną stronę dokonała pożądanej akcji np.\n",
" * Dokonała zakupu\n",
" * Wypełniła formularz\n",
" * Wysłała maila na wskazany adres\n",
" * Zarejestrowała się do systemu\n",
" * Pobrała software"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Testy A/B (testy porównawcze)\n",
"* Metoda polega na porównaniu dwóch wersji tej samej aplikacji.\n",
"* Najczęściej stosowana jest do stron internetowych.\n",
"* Różnicę (postęp lub regres) między wersjami wyznacza się poprzez porównanie wartości pewnej miary, np. współczynnika konwersji dla stron internetowych. \n",
"\n",
"[Przeczytaj w Internecie](https://www.optimizely.com/ab-testing/)"
]
},
{
"attachments": {},
"cell_type": "markdown",
"metadata": {},
"source": [
"### Analityka ruchu na portalu internetowym\n",
"Metoda polega na obserwacji dotyczących ruchu na witrynie, takich jak:\n",
" * Wskaźnik odrzuceń – procentowa wartość osób, które opuściły stronę wejściową serwisu bez wykonania żadnej akcji\n",
" * Wskaźnik porzuceń – wskaźnik analogiczny dla podstron danego serwisu,\n",
"Metoda wskazuje działania użytkownika – nie wskazuje jego przyczyn. \n",
"\n",
"Przykładowa witryna: \n",
"https://www.google.com/analytics/"
]
},
{
"attachments": {},
"cell_type": "markdown",
"metadata": {},
"source": [
"### Click-tracking\n",
"\n",
"Metoda dostarcza informacji o poszczególnych elementach strony za pomocą następujących typów informacji\n",
" * Heat maps. \n",
" * Wskazują, w jakie miejsca na stronie ludzie klikają (see what’s hot and what’s not).\n",
" * Confetti\n",
" * Analiza kliknięć: jak klikały poszczególne grupy użytkowników i w poszukiwaniu czego.\n",
" * Scrollmap\n",
" * Analiza, jak daleko w dół strony użytkownicy przewijają stronę – pozwala przeanalizować miejsca, w których strona jest najczęściej porzucana.\n",
" * Overlay report\n",
" * Liczba kliknięć na poszczególne elementy strony.\n",
"\n",
"Przykładowy dostawca: \n",
"http://www.crazyegg.com"
]
},
{
"attachments": {},
"cell_type": "markdown",
"metadata": {},
"source": [
"### Analiza kontrastu\n",
"\n",
"Dostarcza informacji o kontraście pomiędzy elementami strony, co jest szczególnie istotne dla osób z upośledzeniem wzroku.\n",
" * Można wpisać adres strony, która ma zostać przeanalizowana pod względem kontrastu – otrzymuje się pełen raport."
]
},
{
"attachments": {},
"cell_type": "markdown",
"metadata": {},
"source": [
"## 4.2. Metody z udziałem użytkowników\n",
"\n",
"W metodach z udziałem użytkowników można posłużyć się zastosowaniem *persony*, w celu optymalizacji kosztów badania.\n",
" * **Persona** to fikcyjna postać stworzona by reprezentować typy użytkowników (demograficzne i technograficzne).\n",
" * Persony to inaczej archetypy grup użytkowników i ich potrzeb. Dzięki personom cała populacja docelowa reprezentowana jest przez kilka konceptów.\n",
" > Przykład persony: Jan Kowalski, lat 37, elektryk, mieszkaniec Ząbkowic Śląskich\n",
" \n",
" Przykładowy proces testowania użyteczności z udziałem użytkowników:\n",
" 1. Określ grupy użytkowników np. przy użyciu persony (co najmniej jedna persona na grupę).\n",
" 2. Dla każdej persony utwórz potencjalny scenariusz użycia – w jaki sposób dana persona chce korzystać z systemu.\n",
" 3. Dla każdej persony zorganizuj użytkowników reprezentatywnych (minimum jednego użytkownika dla persony).\n",
" 4. Poproś ich o wykonanie zadań charakterystycznych dla danej persony.\n",
" 5. Obserwuj lub nagrywaj działania użytkowników: gdzie im się powodzi, a gdzie mają trudności.\n",
" 6. Potencjalnie poproś użytkowników o wypełnienie ankiet.\n",
"\n",
"Wyróżniamy następujące typy metod z udziałem użytkowników:\n",
" * podgląd sesji użytkowników.\n",
" * obserwacja użytkownika,\n",
" * metoda wywiadu."
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Podgląd sesji użytkowników\n",
"* Działalność użytkownika jest „nagrywana”.\n",
"* Autor oprogramowania może odtworzyć działania użytkownika z perspektywy użytkownika.\n",
"* Każde kliknięcie, poruszenie myszą, przesunięcie kursora zostaje zapisane."
