Projekt badania interfejsu
-
Upload
zaklad-badan-wizualnych-i-interakcji -
Category
Documents
-
view
228 -
download
2
description
Transcript of Projekt badania interfejsu
Projekt Badania Interfejsu do sterowania urządzeniami w sali ZBWi
autor: Karolina Wilk, rok II, sem IV, rok akademicki 2012/2013pracownia: Zakład Badań Wizualnych i Interakcjiprowadzący: prof. ASP Wiesław Gdowicz, asyst. Marta Więcowska
autor: Karolina Wilk, sem IV, rok akademicki 2012/2013pracownia: Zakład Badań Wizualnych i Interakcjiprowadzący: prof. ASP Wiesław Gdowicz,asyst. Marta Więckowska
Prezentacja projektu interakcji i wizualnej postaci interfejsu
Prototyp - badania z żytkownikiem.
Funkcje interfejsu badanie paper prototypingbadanie card sorting badanie prototypu 1 badanie prototypu 2
13:05 poniedziałek
• możliwość manipulowania obiektami interakcji w fizycznej i wirtualnej przestrzeni: 1. Manipulowanie żaluzjami okiennymi ( podnoszenie i opuszczanie żaluzji )2. Sterowanie oświetleniem w pomieszczeniu 3. Sterowanie projektorem ( włączanie, wyłączanie )4. manipulowanie ekranem ( chowanie, wysuwanie)
menuoświetlenie
a b
c
menurolety
1
menu
w dółekran:
projektor :
projekcja menu
godz.
:
:
godz.
ustaw zegar:
ustaw alarm:
dzień tyg.
alarmu powtarzanie
min.
min.
13
00
05
05
poniedziałek
menu
ustaw temperaturę:
temperatura
od
od
do
do
godz.
godz. godz.
godz.
temperatura
temperatura
00
00
20.5
20.0
00
00
autor: Karolina Wilk, sem IV, rok akademicki 2012/2013pracownia: Zakład Badań Wizualnych i Interakcjiprowadzący: prof. ASP Wiesław Gdowicz,asyst. Marta Więckowska
Prezentacja projektu interakcji i wizualnej postaci interfejsu
Prototyp - badania z żytkownikiem.
Funkcje interfejsu badanie paper prototypingbadanie card sorting badanie prototypu 1 badanie prototypu 2
2. Opis badania:
• do przprowadzenia badania został użyty program dostępny pod linkiem: http://www.optimalworkshop.com
• w badaniu wzieło udział 20 osób• każdej z osób został podany link do programu pozwalającego wykonać badanie• badanie card sorting było podzielone na 2 części: otwartą i zamkniętą:1. badanie otwarte polegało na podzieleniu elementów na grupy oraz na nadaniu
im nazw.2. badanie zamknięte polegało na dopasowaniu elementów do grupy z nadną już nazwą
1. cel badania:
badanie ma na celu wykazanie czy nazwy elementów architektury informacji są zrozumiałe dla potencjanlych użytkowników interfejsu
3. stworzone karty ( na podstawie elementów architektury informacji): ekran stop, klimatyzacja, lampa B, lampy grupa, lampy grupa A, lampy wszystkie, ogrzewanie, podnoszenie rolety, roleta stop, spuszczanie ekranu, spuszczanie role-ty ustawianie temperatury, ustawienie godziny, usypianie komputera, wyłączenie alarmu, wyłącznie lampy C1, wyłącznie rzutnika , właczanie rzutnika, włączanie komputera
przykład grup z dopasowanymi kartami
badanie wykazało że użytkownik może nie domyślić sie że pod kategorią zegarznajduje się opcja alarmu
większość badanych przypasowywała elementy z kategorii ekran oraz kategorii rzutnik do jednej grupy ( projekcja )
kategorie AI przed badaniem 7 grup:
lampyroletykomputerekranrzutniktemperaturazegar
kategorie aI po badaniu6 grup:
lampyroletykomputerprojekcja
temperaturazegar/ alarm
4. Wnioski
autor: Karolina Wilk, sem IV, rok akademicki 2012/2013pracownia: Zakład Badań Wizualnych i Interakcjiprowadzący: prof. ASP Wiesław Gdowicz,asyst. Marta Więckowska
Prezentacja projektu interakcji i wizualnej postaci interfejsu
Prototyp - badania z żytkownikiem.
Funkcje interfejsu badanie paper prototypingbadanie card sorting badanie prototypu 1 badanie prototypu 2
1. Cel badaniaWeryfikacja wstępnego projektu interfejsu, wprowadzenia korekty na podstawie przprowadzonego badania
2. Opis badania:• Badanie zostało przeprowadzone na 6 osoba w wieku od 22 lat do 55• Zadaniem badanych było wykonać polecenia przy użyciu papierowegmodelu, który mieli traktować ja dotykowe elekroniczne urządzenie.• W zależności od tego na co “kliknęli” badani, strony modelu były zmieniane tak by odpowiadały kolejnemu stanu inetrfejsu
3. Polecenia:• włącz komputer,• włącz wszystkie lampy• wyłącz lampy• włącz grupe lamp B i A• wyłącz obie grupy lamp• włącz lampe A1, B1, C1• wyłącz lampy• spuść wszystkie rolety• podnieś wszystkie rolety• spuść rolete 1 i 2• spuść Ekran• włącz rzutnik• wyłącz rzutnik• zwiń ekran• ustaw zegar na 9:55• dodaj alarm na 20:00• zwiększ temperature• uśpij urządzenia• wyłącz urządzenie
wniosek 5
komputer oświetlenie
rolety wszystkie
roleta n
1
2
3
rolety projekcja zegar/alarm temperatura
4. papierowy prototyp przykałady stron
1. Badani intuicujnie wiedzieli ze aby zapalić lub wyłączyć lampy należy kliknąć na czarny/ żółty pasek lub grupe pasków. Napis włącz / wyłącz nie pomagał, a nawet wprowadzał niejasności. Jedynie w zakładce gdzie włącza sie wszystkie lampy jednocześnie napisy były pomocne.
3. Badani ignorowali zakładke komputer, po otrzymaniu poleceniawyłącz komputer badani klikali na guzik włączanie, który został również zinterpretowany jako wyłącznik.
4. Badani nie zrozumieli komendy uśpij,
5. Strzałka w prawym dolny rogu nie została zrozumiana jakopowrót do strony startowej
6. Część badanych miała problem z wykonaniem polecenia- włącz lampe A1, B1, C1. Badani zasugerowali aby nazwe:lampa n zmienić na lampy osobno
7. Osoby badane zwróciły uwage na część graficzną interfejsu.według nich pole interfejsu było znacznie za duże w stosunku doilości i wielkości elementów interfejsu.
5. Wnioski
wniosek 3
wniosek 1
wniosek 7,1,3,5
wniosek 5
autor: Karolina Wilk, sem IV, rok akademicki 2012/2013pracownia: Zakład Badań Wizualnych i Interakcjiprowadzący: prof. ASP Wiesław Gdowicz,asyst. Marta Więckowska
Prezentacja projektu interakcji i wizualnej postaci interfejsu
Prototyp - badania z żytkownikiem.
Funkcje interfejsu badanie paper prototypingbadanie card sorting badanie prototypu 1 badanie prototypu 2
2.Opis badania:• Badanie zostało przeprowadzone na 3 osoba w wieku od 22 lat do 55• Zadaniem badanych było wykonać polecenia przy użyciu prototypy interaktywnego interfejsu, wyświetlanego na ekranie komputera. Ruch kursora i kliknięcie myszką miały być traktowane jak ruch dłoni i dotknięcie palcem ekranu• W zależności od tego na co “kliknęli” badani, strony inter-fesju zmieniały się tak by odpowiadały kolejnemu stanu inetr-fejsu• Osoby biorące udział w badaniu zostały poproszone abyna głos komentować wykonywane czynności• Badanie opierało się głównie na obserwacji zachowań użytkownika, w jaki sposób porusza się po stronach nterfejsu, na co zwraca uwagę, co sprawia mu problem• Osoba badana nie miała ograniczenia czasowego, podczas wykonywanych zadań oraz nie miała możliwości zapoznania się z inetrfejsem przed badaniem
1. cele badaniaPrzed użytkownikiem postawione były konkretne zadania, których celem było sprawdzenie poprawnosci działania interfesju, jego czytelności, płynności nawigacji. Badanie miało na celu wskazanie błędów w funkcjonowaniu inetrfejsu Polecenie:Chcesz przygotować salę na wykład. 1. Spuść rolete 1; 2; 32. włącz wszytkie lampy w sali3. włącz jedynie jedną grupe lamp4 wyłącz lampy 5. chcesz aby w sali panował półmrok, włącz tylko jedną lampe 6 włącz rzutnik8. ustaw alarm który zasygnalizuje koniec zajęc ( 14:00 )9. zwiększ temperature w saliWykład się skończył11. wyłącz projektor i zwiń ekran10. Odsłoń dwa okna, trzecią rolete podnieś do połowy
menu
lampy wszystkie
oświetlenie oświetlenie
lampy wszystkie
menuoświetlenie
wnioski:aby zapalić wszystkie lampy nalezy kliknąć w ikone ‘‘lampy wszystkie’’ a następnie kliknąć w prostokąt z włącznikiem, wszyscy badani po kliknięciu w ikone lampy wszytkie uznawali że lampy zostały już włączone
proponowana zmiana: po kliknięciu w ikone z napisem : lampy wszystkie lampy zapalają się automatycznie
autor: Karolina Wilk, sem IV, rok akademicki 2012/2013pracownia: Zakład Badań Wizualnych i Interakcjiprowadzący: prof. ASP Wiesław Gdowicz,asyst. Marta Więckowska
Prezentacja projektu interakcji i wizualnej postaci interfejsu
Prototyp - badania z żytkownikiem.
Funkcje interfejsu badanie paper prototypingbadanie card sorting badanie prototypu 1 badanie prototypu 2
Po wprowadzeniu poprawek, badanie zostało powtórzone na 4 innych osobach. badanie wykazało nowe błędy w funkjonowaniu interfejsu. błędy które nie zostały zauważone podczas pierwszego badania.
13:15
1. Badani mylili zegar interfejsu z przyciskiem. Chcąc ustawić godzine klikali na zegar a nie na przyciski odsyłający do ustawieńzegara.wniosek: należy usunąć ramke która otacza zegar inetrfejsu, zmienić kształt pola zegara tak by nie przypominał przycisku
13:05 poniedziałek
2. Zmiana po pierwszym badaniu:po kliknięciu na przycisk z napisem lampy wszystkie lampy zapalają się automatycznie. Kliknięty klawisz zostaje podświetlolony na niebiesko, przestaje być aktywny. Aby wyłączyć lampy należy kliknąć na niebieski prostokąt z symbolem jednak po wprowadzonej zmianie badani chcąc wyłączyć lampy klikali na nieaktywny już przycisk.
Po drugim badaniu została wprowadzona zmiana:zmiana:
menu
lampy wszystkie
oświetlenie
po kliknięciu na przycisk lampy zapalają sie automatycznie a napis na guziku zmienia się na , przycisk pozostaje aktywny. Aby wyłączyć lampy nalezy na niegokliknąć
menuoświetlenie
3. badanym trudno było zorientować sie jak opuścić rolety, mylący był dla nich kierunek strzałki:
wszyscy badani radzili aby przycisk zastąpić:
menu
w dół
w górę
rolety menurolety
autor: Karolina Wilk, sem IV, rok akademicki 2012/2013pracownia: Zakład Badań Wizualnych i Interakcjiprowadzący: prof. ASP Wiesław Gdowicz,asyst. Marta Więckowska
Prezentacja projektu interakcji i wizualnej postaci interfejsu
Prototyp - badania z żytkownikiem.
Projekt interfejsu Projekt interakcji prezentacja działania interfejsu
układ + grId:
13:05 poniedziałek
menuoświetlenie
a b
c
menurolety
1
menu
w dółekran:
projektor :
projekcja menu
godz.
:
:
godz.
ustaw zegar:
ustaw alarm:
dzień tyg.
alarmu powtarzanie
min.
min.
13
00
05
05
poniedziałek
menu
ustaw temperaturę:
temperatura
od
od
do
do
godz.
godz. godz.
godz.
temperatura
temperatura
00
00
20.5
20.0
00
00
°C
°C
menu glowne oświetlenie rolety prokekcja zegar/alarm temperatura
autor: Karolina Wilk, sem IV, rok akademicki 2012/2013pracownia: Zakład Badań Wizualnych i Interakcjiprowadzący: prof. ASP Wiesław Gdowicz,asyst. Marta Więckowska
Prezentacja projektu interakcji i wizualnej postaci interfejsu
Prototyp - badania z żytkownikiem.
Projekt interfejsu Projekt interakcji prezentacja działania interfejsu
oświetlenie zegar/alarmrolety
podstrony
menu głównekOLOrYSTYka TYPOgraFIa
LINIa
projekcja
projekcja
temperatura
temperatura
projekcja
temperaturazegar/alarm
rolety
oświetlenie
13:05 poniedziałek
projekcja
temperaturazegar/alarm
rolety
oświetlenie
13:05 poniedziałek
projekcja
temperaturazegar/alarm
rolety
oświetlenie
13:05 poniedziałek
projekcja
temperaturazegar/alarm
rolety
oświetlenie
13:05 poniedziałek
projekcja
temperaturazegar/alarm
rolety
oświetlenie
13:05 poniedziałek
projekcja
zegar/alarm
rolety
oświetlenie
13:05 poniedziałek
projekcja
temperaturazegar/alarm
rolety
oświetlenie
13:05 poniedziałek
AAAAA
AA
AAAAA
A
A
A
AAAA
A
AAAA
A
a
a
a
a
a
a
a
nazwa krój pt
pt pt
kolor
kolor kolor
kontrast
kontrast kontrast
titillum medium
titillum medium
titillum medium
titillum medium
titillum medium
titillum medium
titillum medium
bezszeryfowy 3412
12
12
12
12
12
18
zegar/alarm
rolety
oświetlenie
menu główne
menu główne projekcjamenu główne
oświetlenie zegar/alarm
rolety temperatura
2 2
2 2
22
1 1
1 1
11
1 1
1 1
11
eFekTYdrop shadows: oppacity 30%; distance 0,2 mm; angle 90˚; offset x 0mm; offset y 0,2 mm; size 1mm
bevel and embross: size 2mm; soften 0,0 mm; depth100%; shading: angle -86 ˚; altitude 36 ˚hightlight oppacity 100%shadow oppacity 13%
bevel and embross: size 0, 2mm; soften 0,0 mm; depth 0%; shading: angle 120; altitude 28 ˚hightlight oppacity 100%shadow oppacity 20%inner glow oppacity 75%size 2mm; choke 78%source : center
bevel and embross: size 0,4mm; soften 0,0 mm; depth100%; shading: angle 120 ˚; altitude 30 ˚;hightlight oppacity 100%shadow oppacity 100%
te same efekty z elementami:
inner shadow:distance 1,75 mm; opacity 50%; angle 120˚x offset 0,9 mm; y offset 1,5 mm; size 3mm
autor: Karolina Wilk, sem IV, rok akademicki 2012/2013pracownia: Zakład Badań Wizualnych i Interakcjiprowadzący: prof. ASP Wiesław Gdowicz,asyst. Marta Więckowska
Prezentacja projektu interakcji i wizualnej postaci interfejsu
Prototyp - badania z żytkownikiem.
Projekt interfejsu Projekt interakcji prezentacja działania interfejsu
a b
11
1
1
1
1
1
1
1
1
1
1
22
2
2
2
2
2
2
2
2
2
2
1 2a b
element aktywny
element nieaktywny
otwarcie nowego oknapo kliknięciu w powiązany element:
animacja- zatrzymanie
animacja- elementporusza sie w góre
animacja- elementporusza sie w dół
pojwienie sie grupynowych elementów
element zmienia kolor
cyfry zmieniaja sie
napisy zmieniaja sie zmiana koloru po najechaniu palcemzmiana koloru w trakcie klikniecia
zmiana koloru po klinięciu
elementelement najechaniezmiana koloru
najechaniezmiana koloru
klikzmiana koloru
klikzmiana koloru
zmiana kolorupo kliknięciu
lampy wszyst. lampy wszyst lampy wszyst.
lampy grupa lampy grupa lampy grupa
lampy osobno lampy osobno lampy osobno
wyłącz lampy wyłącz lampy wyłącz lampy
autor: Karolina Wilk, sem IV, rok akademicki 2012/2013pracownia: Zakład Badań Wizualnych i Interakcjiprowadzący: prof. ASP Wiesław Gdowicz,asyst. Marta Więckowska
Prezentacja projektu interakcji i wizualnej postaci interfejsu
Prototyp - badania z żytkownikiem.
Projekt interfejsu Projekt interakcji prezentacja działania interfejsu
element najechaniezmiana koloru
klikzmiana koloru
po kliknieciuzmiana koloru
po kliknieciu w powiazanyelement : zmiana napisu
lampy wszyst.
lampy grupa
stop stop stop
w górę w górę w górę
w dół w dół
WT WT
animacja- po kliknięciu w powiązany element, element animacji porusza się w :
w dół w dół w góręstop stop
13 14
poniedziałek wtorek
20.0 20.5 °C °C
WT
autor: Karolina Wilk, sem IV, rok akademicki 2012/2013pracownia: Zakład Badań Wizualnych i Interakcjiprowadzący: prof. ASP Wiesław Gdowicz,asyst. Marta Więckowska
Prezentacja projektu interakcji i wizualnej postaci interfejsu
Prototyp - badania z żytkownikiem.
Projekt interfejsu Projekt interakcji prezentacja działania interfejsu
proces działania:
projekcja projekcja projekcja
temperatura temperatura temperaturazegar/alarm zegar/alarm
rolety rolety
oświetlenie oświetlenie oświetlenie
13:05 13:05 13:05 poniedziałek
poniedziałek
poniedziałek
menu
menu menu
lampy wszyst. lampy wszyst
lampy grupa lampy grupa
lampy osobno lampy osobno
oświetlenie
oświetlenie oświetlenie menu menu menuoświetlenie oświetlenie oświetlenie
lampy osobno lampy osobno lampy osobno
lampy grupa lampy grupa lampy grupa
wyłącz lampy wyłącz lampy wyłącz lampy
menuoświetlenie
stany, elementy zaprezentowanew procesie działania interfejsu
najechanie na element
najechanie na element najechanie na element
kliknięcie w element
kliknięcie w element kliknięcie w elementzmiana stanu elementów interfesju w eyniku kliknięcia
otwarcie nowego okna
otwarcie nowego okna
autor: Karolina Wilk, sem IV, rok akademicki 2012/2013pracownia: Zakład Badań Wizualnych i Interakcjiprowadzący: prof. ASP Wiesław Gdowicz,asyst. Marta Więckowska
Prezentacja projektu interakcji i wizualnej postaci interfejsu
Prototyp - badania z żytkownikiem.
Projekt interfejsu Projekt interakcji prezentacja działania interfejsu
proces działania:stany, elementy zaprezentowanew procesie działania interfejsu
najechanie na element
najechanie na elementnajechanie na elementpojeawienie sie
nowych elementów
kliknięcie w element
kliknięcie w element kliknięcie w elementzmiana stanupo kliknięcia
otwarcie nowego okna
menu
menu menu
rolety
rolety rolety
1
1 1
2
2 1
3
3 3
13:05 13:05 13:05
menu menu menu menurolety rolety rolety rolety
w dół w dółw dół
w górę w górę w górę w górę
stop stop stop stop
2 2 2 21 1 1 13 3 3 3
animacja- elementporusza sie w dół
autor: Karolina Wilk, sem IV, rok akademicki 2012/2013pracownia: Zakład Badań Wizualnych i Interakcjiprowadzący: prof. ASP Wiesław Gdowicz,asyst. Marta Więckowska
Prezentacja projektu interakcji i wizualnej postaci interfejsu
Prototyp - badania z żytkownikiem.
Projekt interfejsu Projekt interakcji prezentacja działania interfejsu
a b
proces działania:stany, elementy zaprezentowanew procesie działania interfejsu
najechanie na element
najechanie na element
kliknięcie w element
kliknięcie w element kliknięcie w elementzmiana stanu po kliknięcia
otwarcie nowego okna
13:05 13:05 13:05
animacja- elementporusza sie w dół
menu
menu menumenumenu
godz.
godz. godz.godz.godz.
:
: :::
:
: :::
godz.
godz. godz.godz.godz.
ustaw zegar:
ustaw zegar: ustaw zegar:ustaw zegar:ustaw zegar:
ustaw alarm:
ustaw alarm: ustaw alarm:ustaw alarm:ustaw alarm:
dzień tyg.
dzień tyg. dzień tyg. dzień tyg. dzień tyg.
alarmu
alarmu alarmu alarmu alarmu
powtarzanie
powtarzanie powtarzanie powtarzanie powtarzanie
min.
min. min.min.min.
min.
min. min.min.min.
13
13 131413
00
00 000000
05
05 050505
00
00 000000
poniedziałek
poniedziałek poniedziałekponiedziałekponiedziałek
1
1
1
1
2
2
2
2
autor: Karolina Wilk, sem IV, rok akademicki 2012/2013pracownia: Zakład Badań Wizualnych i Interakcjiprowadzący: prof. ASP Wiesław Gdowicz,asyst. Marta Więckowska
Prezentacja projektu interakcji i wizualnej postaci interfejsu
Prototyp - badania z żytkownikiem.
Projekt interfejsu Projekt interakcji prezentacja działania interfejsu