projekt badania interfejsu do sterowania urządzeniami w sali ZBWiI
procownia badania użyteczności autor marek kasperk prowadzący prof. asp dr hab. wiesław gdowicz mgr marta więckowska
opis zadania podczas pracy semestralnej zapoznawałem sie z technikami badawczymi związanych z projektem interfejsów badany był własny projekt interfejsu służącego do obsługi wyposażenia sali wykładowej
porządek prac TWORZENIE PROTOTYPU
BADANIE PROTOTYPU
określenie funkcji interejsu określenie wątpliwości skatogoryzowanie funkcji projekt badania interfejsu weryfikacja kategori przeprowadzenie badania wykonanie struktury projekt interakcji wykonanie prototypu
KOREKTA PROTOTYPU wyciągnięcie wniosków dokonanie zmian
określenie funkcji i kategorii interfejsu powietrze — sterowanie temperaturą (klima, kaloryfery) – sterowanie oknami multimedia — sterowanie systemem audio — sterowanie rzutnikiem — sterowanie ekranem oświetlenie — sterowanie lampami rolety — sterowanie roletami
weryfikacja kategorii badanie card-sorting badanie card sorting pomaga w projektowaniu interfejsów które wymagają katogoryzowania treści, polega na wypisaniu wszystkich elementów na osobnych kartkach a następnie pokazanie ich użytkownikowi i poproszenie o pogrupowanie oraz nazwanie tych grup kategorie po badaniu multimedia wyposażenie temperatura
struktura multimedia
sterowanie audio sterowanie rzutnikiem sterowanie ekranm
wyposażenie
oświetlenie rolety okna
sterowanie oświetleniem sterowanie roletami sterowanie oknami
temperatura
klimatyzacja kaloryfery
sterowanie klimatyzacją sterowanie ogrzewaniem
projekt interakcji wszystkie zmiany odbywają sie po dotknięciu aktywnego pola
dotknięcie
zmiana
rodzaje zmian 1. zmiana strony (zmienia się wszystko poza paskiem stanu) — nawigacja 2. zmiana stanu elementów (stan wyswietlany w głównym oknie i na pasku stanu) 3. zmiana wielu elementów (jeden przycisk obsługuje więcej elementów (lamp)) 4. zmiana wielu elementów (jeden przycisk obsługuje wszystkie funkcje interfejsu)
projekt interakcji nawigacja na przykładnie pokaże jak to działa
strona przed zmianą
dotknięcie
stron po zmianie
projekt interakcji nawigacja tutaj pokazuje fragment struktury z sposobem poruszania sie, od aktywnego pola strzałka prowadzi do miejsca gdzie znajdziemy się po kliknięciu
projekt interakcji nawigacja fragment od temperatury
projekt interakcji nawigacja fragment od wyposaĹźenia
projekt interakcji nawigacja całość
projekt interakcji zmiana stanów elementów na przykładnie pokaże jak to działa
strona przed zmianą
dotknięcie
stron po zmianie
projekt interakcji zmiana wielu elementów przy wielu elementach dotyczących danaego segmentu sterowania wprowadzono ułatwienia polegające na zmiane wielu na raz
strona przed zmianą
dotknięcie
stron po zmianie
projekt interakcji zmiana stanów elementów w przypadku aktywizacji elementów wyposażenia pojawi się informacja że dany element jest aktywny na pasku stanu, oznacza to że jedno kliknięcie zminia na raz dwa elementy dotknięcie
stron po zmianie 2 1
wykonanie prototypu do wykonania prototypu posłużył mi program adobe flash prototyp przystosowałem do telefonu samsung galaxy note ponieważ na nim wykonywałem badanie. dzięki temu podczas badania użytkownicy operowali bezpośrednio dotykiem a nie myszką wymusiło to wymiary interfejsu czyli 75 na 75 mm
prezentacja przykładowych stanów
część druga TWORZENIE PROTOTYPU
BADANIE PROTOTYPU
KOREKTA PROTOTYPU
określenie funkcji interejsu skatogoryzowanie funkcji weryfikacja kategori wykonanie struktury projekt interakcji wykonanie prototypu
określenie wątpliwości projekt badenia interfejsu przeprowadzenie badania
wyciągnięcie wniosków dokonanie zmian
określenie wątpliwości czy użytkownik rozpozna element interakcji służący do podnoszenia temperatury? czy użytkownik prawidłowo rozpozna co kryje sie pod kategorią wyposażenie? czy użytkownik jest świadom że wprowadził zmiane? czy funkcja wyłącznia wszystkiego na raz jest rozpoznawalna przez użytkownika?
projekt badenia interfejsu zadania wykonywane przez badanych 1. ustaw klimatyzacje na daną temperaturę (miało na celu sprawdzenie identyfikacji elementu interakcji służącego do podniesienia temperatury) 2. zapal światło (sprawdzenie kategoryzacji treści, wątpliwość do kategorii wyposażenie) 3. przygotuj sale do wykładu — zgaś światło, zasłoń rolety włącz rzutnik, wysuń ekran (sprawdzenie czytelności efektów wprowadzania zmian i nawigacji) 4. wyłącz wszystko (sprawdzenie funkcjonalności opcji wyłączającej wszystkie opcje na raz, oraz czytelność pasku stanu)
przeprowadzenie badań jak już wspominałem badanie wykonałem przy użyciu telefonu samsung galaxy note przeprowadziłem je na pięciu osobach zebrałem materiał audio-video z przebiegu badań notowałem komentarze użytkowników
część trzecia TWORZENIE PROTOTYPU
BADANIE PROTOTYPU
KOREKTA PROTOTYPU
określenie funkcji interejsu skatogoryzowanie funkcji weryfikacja kategori wykonanie struktury projekt interakcji wykonanie prototypu
określenie wątpliwości projekt badenia interfejsu przeprowadzenie badania
wyciągnięcie wniosków dokonanie zmian
opis opisu dokonania zmina prototyp przed zmianami
identyfikacja opis napotkanych przycisku problemów podnoszącego temperaturę oraz włączającego klimatyzacje wszystkim użytkownikom sprawiła wiele kłopotu
zmiana opis dokonanych orientacji izmian wielkości powinna załatwić sprawe czerwone wyszczególnienia zaznaczają miejsce problemu
prototyp po zmianach
niebieskie wyszczególnienia zaznaczają miejsce dokonanej zmiany
dokonane zmiany na podstawie wyniku badań identyfikacja przycisku podnoszącego temperaturę oraz włączającego klimatyzacje wszystkim użytkownikom sprawiła wiele kłopotu
zmiana orientacji i wielkości powinna załatwić sprawe
dokonane zmiany na podstawie wyniku badań odczytanie że siła światła może sie jeszcze bardziej zwiększyć stanowiło problem
zostawienie wolnej przestrzeni, zastosowanie kompozycji otwartej w znaku.
dokonane zmiany na podstawie wyniku badań wiele zamieszania sprawiło wprowadzenie legendy oobjaśniającej grafikę w stosunku do stanu elementu
wizualizacja stanu elementu
dokonane zmiany na podstawie wyniku badań pojawiło się wiele wątpliwaości co to jakości graficznej interfejsu oraz ortografi
poprawa wizualnej jakości, poprawa błędów
dokonane zmiany na podstawie wyniku badań pozostałe wątpliwości na szczęście nie potwierdziły się
opisanie elementów projektu interfejsu grid — podział 8 na 8
piktogramy
krój pisma — klavika
O Hamburgerofont
prezentacja interfejsu po zmianach
zapraszam do zabawy interfejsem http://www.bu2.republika.pl/
jeśli się nie mieści dopasuj wielkość ustawieniami powiększenia strony w twojej przeglądarce dziękuje.