From 9f74cc60458aabeef6d8ba3a18cb252211f3f5d2 Mon Sep 17 00:00:00 2001 From: Krzysztof Jassem Date: Mon, 16 Jan 2023 11:41:47 +0100 Subject: [PATCH] =?UTF-8?q?poprawienie=20numeracji=20wyk=C5=82ad=C3=B3w?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ...1_wybrane_zagadnienia_użyteczności.ipynb | 561 ------------------ 1 file changed, 561 deletions(-) delete mode 100644 materiały na wykład/11_wybrane_zagadnienia_użyteczności.ipynb diff --git a/materiały na wykład/11_wybrane_zagadnienia_użyteczności.ipynb b/materiały na wykład/11_wybrane_zagadnienia_użyteczności.ipynb deleted file mode 100644 index ccef61a..0000000 --- a/materiały na wykład/11_wybrane_zagadnienia_użyteczności.ipynb +++ /dev/null @@ -1,561 +0,0 @@ -{ - "cells": [ - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "![Logo 1](https://git.wmi.amu.edu.pl/AITech/Szablon/raw/branch/master/Logotyp_AITech1.jpg)\n", - "
\n", - "

Systemy informatyczne

\n", - "

10. Wybrane zagadnienia użyteczności[wykład]

\n", - "

Krzysztof Jassem (2021)

\n", - "
\n", - "\n", - "![Logo 2](https://git.wmi.amu.edu.pl/AITech/Szablon/raw/branch/master/Logotyp_AITech2.jpg)" - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "# 1. Pojęcie użyteczności" - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "
\n", - " \n", - "

Użyteczność

\n", - "\n", - "Użyteczność narzędzia: łatwość, z jaką ludzie potrafią korzystać z tego narzędzia w celu osiągnięcia określonego celu.\n", - "\n", - "

Cechy aplikacji użytecznej

\n", - " \n", - "
" - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "# 2. Wskazówki do tworzenia użytecznej aplikacji" - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "## 2.1. Klasyka w oparciu o \"Don't make me think\"" - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "
\n", - " \n", - "Przeczytaj w Internecie\n", - "\n", - "
    \n", - " \n", - "
  1. Usability Means…
    2. \n", - "\n", - "
  2. Web applications should explain themselves.
    3. \n", - "\n", - "
  3. Don’t Make Me Think
    4. \n", - "\n", - "
  4. Don’t waste my time
    5. \n", - " \n", - "
  5. Users still cling to their back buttons
    6. \n", - "\n", - "
  6. We’re creatures of habit
    7. \n", - "\n", - "
  7. No Time for Small Talk
    8. \n", - "\n", - "
  8. Don’t lose search
    9. \n", - "\n", - "
  9. We form mental site-maps
    10. \n", - "\n", - "
  10. Make it easy to go home
    11. \n", - " \n", - "
\n", - "\n", - "
\n" - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "## 2.2. Podejście (bardziej) współczesne" - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "
\n", - " \n", - "

Wskazówki do tworzenia użytecznego systemu informatycznego

\n", - "\n", - "
    \n", - "
  1. Autorze: Poznaj użytkownika, a TY nie jesteś użytkownikiem.
    2. \n", - "
  2. Użytkownik powinien mieć kontrolę nad systemem, a nie odwrotnie: to użytkownik jest szefem i system powinien to okazywać.
    3. \n", - "
  3. System musi ułatwiać użytkownikowi życie:
    4. \n", - "
      \n", - "
    • 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.
      • \n", - "
    • Każda akcja użytkownika powinna mieć reakcję programu.
      • \n", - "
    • Kiedy użytkownik ma do podjęcia decyzję, system podaje mu całą dostępną informację.
      • \n", - "
    \n", - "
  4. System musi być \"idioto-odporny\":
    5. \n", - "
      \n", - "
    • Każdy robi błędy, więc każdy błąd powinien dać się naprawić.
      • \n", - "
    • Gdy użytkownik zrobi błąd, System daje mu o tym znać, zanim … wpadnie w PRAWDZIWE kłopoty.
      • \n", - "
    • Informacje o błędach powinny być zrozumiałe dla użytkownika i mówić mu, jak naprawić problem.
      • \n", - "
    \n", - "
  5. Wczuj się w użytkownika
    6. \n", - "
      \n", - "
    • Eliminuj niepotrzebne decyzje (nie pytaj, jak nie musisz).
      • \n", - "
    • Im mniej kroków do celu, tym lepiej.
      • \n", - "
    • Użytkownik powinien zawsze móc dowiedzieć się, co robić dalej.
      • \n", - "
    • Użytkownik powinien zawsze wiedzieć, co się dzieje.\n", - "
    \n", - "
\n", - "
" - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "## 3. Zasady dobrej nawigacji na portalu internetowym\n", - "### 3.1. Pojęcie nawigacji" - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "
\n", - " \n", - " Nawigacja to stały, niezmieniający się zestaw elementów w serwisie ułatwiający poruszanie się na niej.\n", - " \n", - "Najczęściej stosowanymi elementami nawigacji są: \n", - "
    \n", - "
  • Menu główne
    • \n", - "
  • Menu narzędziowe
    • \n", - "
  • Identyfikator witryny
    • \n", - "
  • Wyszukiwarka
    • \n", - "
  • Odsyłacz do strony startowej (zawarty w logo)
    • \n", - "
  • Flagi narodowe (przełączenie języków)
    • \n", - "
\n", - "\n", - "
" - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "## 3.2. Cechy dobrej nawigacji" - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - " * 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" - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "### Zasada 1. Widoczność\n", - "Wszystkie elementy nawigacji muszą być bardzo dobrze widoczne na każdej stronie i podstronie serwisu." - ] - }, - { - "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. " - ] - }, - { - "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." - ] - }, - { - "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." - ] - }, - { - "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." - ] - }, - { - "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" - ] - }, - { - "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/)" - ] - }, - { - "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/" - ] - }, - { - "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" - ] - }, - { - "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", - "\n", - "* Przykładowy adres\n", - " * https://webaim.org/resources/contrastchecker/\n", - " * Można wpisać adres strony, która ma zostać przeanalizowana pod względem kontrastu – otrzymuje się pełen raport." - ] - }, - { - "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." - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "### Obserwacja użytkownika\n", - "* Działalność użytkownika jest obserwowana.\n", - "* Obserwator zapisuje poczynania użytkownika.\n", - "* Obserwacje są analizowane w celu ulepszenia użyteczności aplikacji." - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "### Metoda wywiadu\n", - " * Sposoby przeprowadzenia wywiadu:\n", - " * Analiza celów użytkowników i wykonywania przez nich zadań,\n", - " * Dyskusja prowadzona przez moderatora,\n", - " * Wypełnienie ankiet / kwestionariuszy." - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "# 5. Raport badania użyteczności\n", - "Raport badania użyteczności to sprawozdanie z badania użyteczności aplikacji, w którym wskazuje się **obszary problemowe**.\n", - "Przykładowo raport użytecznści może składać się z następujących części:\n", - "1. Informacje wstępne\n", - "2. Metodologia badania\n", - "3. Obszary problemowe\n", - "4. Dodatki" - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "## 5.1. Informacje wstępne\n", - "Ta część zawiera ogólne informacje o prowadzonym badaniu, np. :\n", - " * Daty tworzenia raportu\n", - " * Harmonogram prowadzenia badań\n", - " * Odwołanie do standardów badania użyteczności\n", - " * Autorzy raportu" - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "## 5.2. Metodologia badania\n", - "Opis tej części zależy od przejętej metody badania. Przykładowo, dla metody wywiadu część ta może mieć następującą postać:\n", - "\n", - "### 5.2.1. Zakres badania\n", - " * Określenie zakresu projektowego: badanie gotowego produktu, czy ocena prototypu,\n", - " * Określenie celu, np., wskazanie wyłącznie błędów w systemie, czy również wskazanie proponowanych ulepszeń,\n", - " * Określenie zastosowanej metody badania użyteczności.\n", - "\n", - "### 5.2.2. Profile użytkowników\n", - " * Określenie kilku segmentów odbiorców pod względem:\n", - " * Danych demograficznych\n", - " * Doświadczenia z programami podobnymi (wcześniejszymi wersjami systemu)\n", - " * Oczekiwań względem systemu\n", - "\n", - "### 5.2.3. Grupa badawcza\n", - " * Określenie liczebności grupy badawczej (około 5 osób)\n", - " * Określenie charakterystyki grupy badawczej pod względem różnych kryteriów , np.\n", - " * płeć, \n", - " * wiek, \n", - " * miejsce zamieszkania, \n", - " * wykształcenie, \n", - " * zawód, \n", - " * wielkość firmy, \n", - " * branża, \n", - " * obsługa komputera, \n", - " * doświadczenie z podobnymi programami, itp.\n", - " * Liczebność i charakterystykę grupy badawczej można zobrazować za pomocą wykresów.\n", - "\n", - "### 5.2.4. Scenariusz badania\n", - "W tej części należy opisać, jak będzie przebiegać scenariusz badania.\n", - "Przykładowy scenariusz badania w metodzie wywiadu:\n", - "1. Omówienie zadań i sposobu wypełniania kwestionariusza\n", - "2. Podanie informacji o regulaminie przeprowadzenia testu wykonania zadań\n", - "3. Test wykonania zadań\n", - "4. Wypełnienie przygotowanego kwestionariusza przez użytkowników\n", - "\n", - "### 5.2.5. Lista zadań do wykonania przez użytkowników\n", - "W tej częścI dla każdego zadania należy podać kryterium pomyślnego ukończenia zadania. Lista zadań może być podana w postaci tabelki:\n", - " * Opis zadania\n", - " * Kryterium ukończenia zadania\n", - "\n", - "### 5.2.6. Ocena wykonania zadań \n", - "W tej części należy ocenić, jak badani wykonali zadania.\n", - "Przykładowa ocena wykonania zadań:\n", - " * Liczba błędów krytycznych użytkownika\n", - " * Liczba błędów niekrytycznych użytkownika\n", - " * Liczba zadań wykonanych zgodnie z założeniami\n", - " * Liczba zdań niewykonanych zgodnie z założeniami\n", - " * Czas wykonania zadań\n", - "\n", - "Ten etap raportu można zakończyć wykresami." - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "## 5.3. Obszary problemowe\n", - "Obszary problemowe to **wnioski** z badania użyteczności.\n", - " * W tej częśći raportu określone zostają obszary problemowe (składowe systemu, które sprawiają kłopoty).\n", - " * Dla każdego obszaru problemowego określa się zestaw problemów użytkowania.\n", - " * Problem użytkowania składa się z:\n", - " * Tytułu problemu,\n", - " * Opisu problemu,\n", - " * Jeśli problemem jest zbyt długi czas wykonania zadania, to można podać średnie czasy rozwiązania,\n", - " * Filmiku wideo (jeśli takim dysponujemy),\n", - " * Rekomendacji rozwiązania problemu,\n", - " * Opisu proponowanego scenariusza działania użytkownika po rozwiązaniu problemu." - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "## 5.4. Dodatki\n", - "W tej części raportu składamy materiały pomocnicze, np.\n", - " ### 5.4.1. Ankieta\n", - "\n", - "W ankiecie mogą znaleźć się przykładowe pytania:\n", - " * Jak ocenia Pan/Pani trudność poszczególnych zadań?\n", - " * Co sprawiło Panu/Pani największy problem podczas testów?\n", - " * Jakie inne funkcjonalności byłyby pożyteczne (wskazać listę do wyboru)?\n", - " * Jakie elementy systemu były niezrozumiałe?\n", - "\n", - " Wyniki ankiety potestowej możemy przedstawić na wykresach.\n", - " \n", - "### 5.4.2. Inne materiały pomocnicze\n", - "Przykładowe materiały pomocnicze:\n", - " * Lista filmów video ilustrujących błędy użyteczności aplikacji,\n", - " * Wnioski i rekomendacje ekspertów użyteczności,\n", - " * Inne materiały w zależności od zastosowanej metody badawczej." - ] - }, - { - "cell_type": "markdown", - "metadata": {}, - "source": [ - "# Podsumowanie wykładu\n", - "1. Tworząc aplikację, myśl przede wszystkim o jej użyteczności, a potem dopiero o jej funkcjonalności.\n", - "2. O sukcesie aplikacji stanowi pomysł, a nie wielość funkcji.\n", - "3. Zawsze (!) pamiętaj o wskazówkach użyteczności.\n", - "4. Tworząc portal internetowy, stosuj zasady dobrej nawigacji.\n", - "5. Przekonaj się, jak Twój program jest używany – wykonaj badanie użyteczności." - ] - } - ], - "metadata": { - "author": "Krzysztof Jassem", - "email": "jassem@amu.edu.pl", - "kernelspec": { - "display_name": "Python 3", - "language": "python", - "name": "python3" - }, - "lang": "pl", - "language_info": { - "codemirror_mode": { - "name": "ipython", - "version": 3 - }, - "file_extension": ".py", - "mimetype": "text/x-python", - "name": "python", - "nbconvert_exporter": "python", - "pygments_lexer": "ipython3", - "version": "3.7.6" - }, - "subtitle": "10. Wybrane zagadnienia użyteczności[wykład]", - "title": "Przygotowanie do projektu badawczo-rozwojowego", - "year": "2021" - }, - "nbformat": 4, - "nbformat_minor": 4 -}