Projekt interfejsu i badania zachowań użytkownika

Projekt interfejsu i badanie interakcji interfejsu

Badania Użyteczności Nina Duda Prowadzący: prof. ASP dr hab. Wiesław Gdowicz, asyst. Marta Więckowska Zakład Badań Wizualnych i Interakcji ASP Katowice

Projekt interfejsu Założenia projektowe interfejsu: Interfejs ma charakter gry. Użytkownik klikając w elementy oraz wzorując się na dostępnej „galerii” układa wybrany przez siebie portret. Nie istnieje żaden stan końcowy, gra kończy się, gdy użytkownik odgadnie, że nie ma ona rozwiązania.

• •

o projektu interfejsu zostało wykorzystanych 8 fotografii – portretów.

D Fotografie podzielone są na 4 równe części (czoło, oczy, nos, usta) Każda z fotografii występuje w czterech wersjach zniekształcenia obrazu (raster, mozaika, ziarno, ciemne kreski) – po podziale daje to 128 elementów

wygląd zastosowanych filtrów przetworzenia obrazu

Layout interfejsu podzielony jest na dwie części: „Galeria” Część znajdująca się po lewej stronie layoutu składa się z 8 prostokątów .

Każdy z nich przedstawia jeden portret złożony z 4 fragmentów przetworzonych obrazów. Przykłady te mają za zadanie pomóc użytkownikowi w odnalezieniu poszukiwanej części fotografii.

Interakcje: po najechaniu kursorem na prostokąt następuje zmiana miejsca występowania każdego z filtrów.

Ilość możliwych zmian dla każdego portretu – 4 „Ukłądanka” Po prawej stronie znajduje się obszar gry składający się z czterech prostokątów ułożonych w kolumnie, wypełnionych przetworzonymi fragmentami fotografii.

Tutaj użytkownik klikając przełącza elementy układanki.

Interakcje: po kliknięciu na prostokąt następuje zmiana wyświetlanego fragmentu fotografii na inny.

W każdym prostokącie istnieje możliwość wyświetlenia 32 różnych obrazów Obie części interfejsu są są niezależne od siebie i nie łączą się ze sobą żadnym aktywnym linkiem.

schemat layoutu interfejsu. odcienie szarości oznaczają różne filtry przetworzenia obrazu.

Projekt interfejsu Budowa i zasada działania interfejsu

Interakcje

Schemat przedstawia budowę interfejsu z podpisanymi ilościami elementów możliwych do wyświetlenia w danym polu. Elementy te dzięki określonym interakcjom przełączają się między sobą.

Litery od A do H są oznaczeniem kolejnych portretów znajdujących się w lewej części interfejsu.

Najechanie kursorem na jeden z elementów w części „galerii” powoduje zmianę jego wyglądu – przesunięcie każdego filtru na inną część portretu.

Kliknięcie na jedno z pól w części układanki powoduje wyświetlenie w nim innego elementu pochodzącego z grupy 32 elementów przynależnych do konkretnego pola.

schemat pokazuje w jaki sposób następuje zmiana miejsc występowania każdego z filtrów na portretach w „galerii”. Każdy odcień szarości odpowiada innemu rodzajowi przetworzenia obrazu.

w każdym z pól w zaznaczonym obszarze istnieje możliwość wyświetlenia 4 różnych obrazów

w każdym z pól w zaznaczonym obszarze istnieje możliwość wyświetlenia 32 różnych obrazów

Projekt interfejsu Aby uniemożliwić użytkownikowi ułożenie całego portretu jednej osoby elementy w polach zostały pogrupowane w określony sposób.

Poniższy schemat przedstawia dwa sposoby przydzielenia elementów fotografii do konkretnego pola układanki. Odcienie szarości symbolizują różne rodzaje graficznej modyfikacji obrazu.

Każdy z tych sposobów został użyty dla 4 portretów (8 przetworzonych fotografii).

sposób 1

sposób 2

Droga użytkownika

element „galerii”

Przykadowy scenariusz drogi użytkownika

a b c d e f g

element „układanki”

h

20

kliknięcie najechanie

40

60

czas [s]

Badanie interakcji interfejsu Cel badania i pytania badawcze • • •

rzeanalizowanie drogi, jaką wykona użytkownik podczas korzystania z interfejsu, p jaka będzie kolejność działań podczas korzystania z zaprojektowanego interfejsu? po jakim czasie użytkownik zrozumie, że gra nie ma rozwiązania?

Badanie interakcji interfejsu Przebieg badania Badanie polega na obserwacji drogi i zachowań użytkownika podczas gdy badany korzysta z interfejsu.

Badanie kończy się gdy użytkownik zrozumie, że nie istnieje żaden stan końcowy interfejsu oraz, że nie da się ułożyć żadnego portretu.

Badany nie otrzyma żadnych wskazówek dotyczących działania interfejsu.

• ilość osób badanych: 10 • w badaniu wzięły udział osoby w przedziale wiekowym 20-35 lat Osoby badane zajmują miejsce przed ekranem komputera, na którym wyświetlony zostanie interfejs, oraz dostaną polecenie: „Zapoznaj się z interfejsem” Sposób dokonywania pomiaru: • •

zapis drogi użytkownika na ekranie za pomocą programu Camtasia zapis komentarzy i uwag użytkownika wypowiadanych w trakcie badania

Badanie interakcji interfejsu Zapis drogi użytkownika – badany nr 1, 25 lat

a b c d e f g h

01

02

kliknięcie najechanie czas badania: 79 sekund ilość kliknięć: 63 ilość najechań: 3 czas, w którym badany wywołuje interakcje w części „galerii”

03

04

05

06

0

Osoba badana zrozumiała sens aplikacji po 1 minucie i 19 sekundach.

Wielokrotne kliknięcia w jeden element świadczą o poszukiwaniu przez badanego „brakującej” części portretu, którą spodziewał się zobaczyć w danym miejscu.

Badany wywołał 3 interacje (następujące po sobie) w „galerii”, jednak nie okazał większego zainteresowania tą częścią.

70

80

czas [s]

Badanie interakcji interfejsu

elementy „układanki”

elementy „galerii”

Zapis drogi użytkownika – badany nr 2, 21 lat a b c d e f g h

0

10

20

30

40

50

kliknięcie najechanie czas badania: 84 sekundy ilość kliknięć: 77 ilość najechań: 0

Osoba badana zrozumiała sens aplikacji po 1 minucie i 24 sekundach.

Badany zapoznawał się z interfejsem klikając wielokrotnie w każdy z elementów (kliknięcia następują po sobie).

Badany nie podjął żadnych działań w obszarze „galerii”.

Kilkosekundowe przerwy między seriami kliknięć spowodowane są wypowiedziami badanego bądź wahaniem przed podjęciem dalszych działań.

60

70

80

czas [s]

90

Badanie interakcji interfejsu

elementy „układanki”

elementy „galerii”

Zapis drogi użytkownika – badany nr 3, 27 lat a b c d e f g h

0

10

20

30

kliknięcie najechanie

a b

czas badania: 104 sekundy ilość kliknięć: 69 ilość najechań: 13

c d e f g

50

60

80

70

czas [s]

Osoba badana zrozumiała sens aplikacji po 1 minucie i 44 sekundach.

Badany zapoznawał się z interfejsem klikając wielokrotnie w każdy z elementów (kliknięcia następują po sobie w seriach).

Badany poświęcił około 20 sekund na zapoznanie się z „galerią”.

Nie udało mu się jednak odgadnąć jej celu.

czas, w którym badany wywołuje interakcje w części „galerii”

h

80

40

0

90

10

100

20

110

30

120

40

130

50

140

60

150 70

0

0

Badanie interakcji interfejsu

elementy „układanki”

elementy „galerii”

Zapis drogi użytkownika – badany nr 4, 22 lata a b c d e f g h

0

10

0

0

0

0

60

80

70

0

czas [s]

a b c d e f g h

80

0

0

10

100

20

110

30

1 0

40

1 0

50

1 0

60

1 0

70

160

0

170

0

Badanie interakcji interfejsu Zapis drogi użytkownika – badany nr 4, 22 lata – ciąg dalszy

a b c d e f g h

170

0

180

10

1 0

20

00 30

1040

050

60 0

czas [s]

kliknięcie najechanie czas badania: 230 sekund ilość kliknięć: 173 ilość najechań: 11 czas, w którym badany wywołuje interakcje w części „galerii”

Osoba badana zrozumiała sens aplikacji po 3 minutach i 50 sekundach.

Badany zapoznawał się z interfejsem klikając wielokrotnie w każdy z elementów (kliknięcia następują po sobie w seriach różnej długości – od kilku do kilkunastu kliknięć).

Badany skorzystał z „galerii” dwukrotnie, poświęcając na to łącznie około 14 sekund. Udało mu się odgadnąć cel tej części interfejsu i świadomie się nią posługiwać. Wzorując się na wyświetlanych portretach wyszukiwał w „układance” odpowiedniego fragmentu fotografii.

70

0

0

Badanie interakcji interfejsu

elementy „układanki”

elementy „galerii”

Zapis drogi użytkownika – badany nr 5, 23 lata a b c d e f g h

0

10

20

30

a b

40

50

czas badania: 109 sekund ilość kliknięć: 73 ilość najechań: 14

c d

czas, w którym badany wywołuje interakcje w części „galerii”

h

80

0

90

kliknięcie najechanie

10

100

20

110

30

120

40

130

80

70

czas [s]

Osoba badana zrozumiała sens aplikacji po 1 minucie i 49 sekundach.

Badany zapoznawał się z interfejsem klikając wielokrotnie w każdy z elementów (od kilku do kilkunastu kliknięć). Kilkakrotnie zdarzają się również pojedyncze kliknięcia.

Badany skorzystał z „galerii” trzykrotnie, poświęcając na to łącznie około 20 sekund. Udało mu się odgadnąć cel tej części interfejsu oraz świadomie się nią posługiwać. Wzorując się na wyświetlanych portretach wyszukiwał w „układance” odpowiedniego fragmentu fotografii.

e f g

60

50

140

60

150

70

0

0

90

Badanie interakcji interfejsu

elementy „układanki”

elementy „galerii”

Zapis drogi użytkownika – badany nr 6, 22 lata a b c d e f g h

0

10

20

30

40

c d f g

70

0

0

Osoba badana zrozumiała sens aplikacji po 1 minucie i 48 sekundach.

Wielokrotne kliknięcia w jeden element świadczą o poszukiwaniu przez badanego „brakującej” części portretu, którą spodziewał się zobaczyć w danym miejscu.

Badany trzykrotnie najeżdżał kursorem na „galerię”, jednak nie okazał większego zainteresowania tą częścią.

czas, w którym badany wywołuje interakcje w części „galerii”

e

60

czas [s]

czas badania: 108 sekund ilość kliknięć: 87 ilość najechań: 7

a b

50

h

00

kliknięcie najechanie

10010

20

30

40

50

60

70

0

0

Badanie interakcji interfejsu

elementy „układanki”

elementy „galerii”

Zapis drogi użytkownika – badany nr 7, 34 lata a b c d e f g h

0

10

20

30

50

60

70

80

90

czas [s]

czas badania: 104 sekundy ilość kliknięć: 78 ilość najechań: 15

a b c d

czas, w którym badany wywołuje interakcje w części „galerii”

e f g h

90

40

0

kliknięcie najechanie

100

10

20

30

Osoba badana zrozumiała sens aplikacji po 1 minucie i 44 sekundach.

Badany klikając wielokrotnie w każdy z elementów zapoznawał się z obrazami wyświetlanymi w każdym z pól.

Badany poświęcił około 15 sekund na zapoznanie się z „galerią” i stwierdził, że istnieje zależność miedzy tą częścią i „układanką”.

Wzorując się na wyświetlanych portretach wyszukiwał w „układance” odpowiedniego fragmentu fotografii.

40

50

60

70

0

0

Badanie interakcji interfejsu

elementy „układanki”

elementy „galerii”

Zapis drogi użytkownika – badany nr 8, 22 lata a b c d e f g h

0

10

20

30

40

50

60

70

80

90

czas [s]

czas badania: 149 sekund ilość kliknięć: 116 ilość najechań: 11

a b c d e f g h

90

0

100

kliknięcie najechanie

10

110

20

120

30

czas, w którym badany wywołuje interakcje w części „galerii”

130

40

140

50

150

60

Osoba badana zrozumiała sens aplikacji po 2 minutach i 29 sekundach.

Badany najpierw klikając wielokrotnie w każdy z elementów zapoznawał się z obrazami wyświetlanymi w każdym z pól.

Krótsze serie kliknięć wiążą się z poszukiwaniem konkretnych fragmentów portretu Badany zapoznał się z „galerią”, jednak nie 0 0 70 odgadł zasady jej działania.

Badanie interakcji interfejsu Zapis drogi użytkownika – badany nr 9, 25 lat

elementy „galerii”

a b c d e

elementy „układanki”

f g h

0

10

20

30

40

a b

50

60

czas badania: 126 sekund ilość kliknięć: 92 ilość najechań: 16

c d e

h

90

0

100

kliknięcie najechanie

10

110

20

120

30

130

40

140

50

90

czas [s]

Osoba badana zrozumiała sens aplikacji po 2 minutach i 6 sekundach.

Badany przeglądał obrazy dostępne w różnych polach, oraz poszukiwał „brakujących” obrazów za pomocą krótkich serii kliknięć (4–7) w różne elementy „układanki” .

Badany zapoznał się z „galerią”, jednak nie odgadł zasady jej działania.

czas, w którym badany wywołuje interakcje w części „galerii”

f g

80

70

150

60

70

0

0

Badanie interakcji interfejsu elementy „galerii”

a b

elementy „układanki”

Zapis drogi użytkownika – badany nr 10, 20 lat

h

c d e f g

0

10

20

30

40

50

60

70

90

czas [s]100

Osoba badana zrozumiała sens aplikacji po 2 minutach i 42 sekundach.

Badany zapoznał się z „galerią”, w ciągu ok. 30 sekund, mimo to nie udało mu się zrozumieć jej sensu ani zasady działania.

Badany przeglądął obrazy dostępne w różnych polach za pomocą krótkich serii kliknięć.

Dwukrotnie skupił się na poszukiwaniu obrazu w jednym polu klikając w nie wielokrotnie.

a b c d e f g h

90

80

0

100

kliknięcie najechanie

10

110

20

120

30

130

40

czas, w którym badany wywołuje interakcje w części „galerii”

140

50

150

60

160

czas badania: 162 sekundy ilość kliknięć: 106 ilość najechań: 21

70

0

0

100

Badanie interakcji interfejsu Komentarze i reakcje użytkowników podczas badania •

• •

• •

szyscy użytkownicy wyrażali zdziwienie gdy w polu, na które klikali pojawiał W się fragment portretu, który nie odpowiadał normalnemu układowi elementów ludzkiej twarzy.

Dwoje użytkowników miało problemy ze zidentyfikowaniem przetworzonych graficznie fragmentów fotografii.

Użytkownicy przyznawali, że nie rozumieją zasady działania aplikacji, ale rozumieli jej sens – dochodzili do wniosku, że nie da się ułożyć żadnej fotografii w całości.

Badanych irytował fakt, że układanka nie ma żadnego rozwiązania.

Tylko trzy osoby badane zrozumiały jaką funkcję pełnią przykładowe portrety w lewej części interfejsu. Jeden badany całkowicie zignorował tę część.

Badanie interakcji interfejsu Zestawienie czasów badania użytkowników.

Badany 1

czas badania Badany 2

czas korzystania z „galerii”

Badany 3 Badany 7 Badany 6 Badany 5 Badany 9 Badany 8 Badany 10 Badany 4 01

min

2 min3

min

4 min

Wykres przedstawia zestawienie czasów badania wszystkich użytkowników oraz czasów jakie spędzili oni korzystajc z „galerii”. czas [minuty]

Nazwy badanych, którym udało się odgadnąć sens działania „galerii” zostały zaznaczone niebieskim kolorem.

Z wykresu wynika, że zrozumienie celu części „galerii” nie jest zależne od długości czasu poświęconego na zapoznanie się z nią.

Wszyscy przebadani użytkownicy doszli do wniosku, że aplikacja nie ma rozwiązania (zrozumieli sens interfejsu). Zajęło im to od 1 minuty 19 sekund do 3 minut 50 sekund. Średnia z czasów badania wszystkich użytkowników to 2 minuty 5 sekund.

Badanie interakcji interfejsu Wnioski i podsumowanie •

• • •

•

•

żytkownicy potrzebowali od 1 minuty 19 sekund do 3 minut i 50 sekund.

U Dwoje badanych wykonało zadanie w czasie krótszym niż 1 minutę 40 sekund sekund, najdłuższe badanie trwało 3 minuty 50 sekund sekund. Pozostałe 7 osób badanych mieściły się w przedziale czasowym 1 min 44 -2 min 43 s.

Użytkownicy nie rozumieli dlaczego w każdym polu występują różne fragmenty portretów.

Większość badanych nie zrozumiała zasady działania przykładowych portretów, bądź z nich nie skorzystała.

Badani podejmowali próby ułożenia całego portretu jednej osoby. Nie mogąc znaleźć brakującego elementu układanki reagowali poirytowaniem lub rozczarowaniem.

Większość kliknięć występuje w bardzo krótkich odstępach czasowych. Świadczy to o tym, że osoby badane starały się jak najszybciej skończyć układankę, nie skupiając się na zrozumieniu zasady działania interfejsu.

Wielokrotne klikanie w jeden element wynika z poszukiwania brakującego elementu portretu (użytkownik po odnalezieniu 3 pasujących części stara się jak najszybciej znaleźć 4 element tej samej fotografii).