![Page 1: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/1.jpg)
1
Projektowanie Graficznych Interfejsów Użytkownika
Robert Szmurło
![Page 2: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/2.jpg)
2
Różnorodność interfejsów użytkownika
Internet:– strony domowe,– sklepy internetowe,– serwisy korporacyjne,
intranet,– serwisy bankowe,– serwisy informacyjne,– wyszukiwarki,– blogi.
Aplikacje– biurowe,– inżynierskie / naukowe,– grafika komputerowa,– programiści,– przemysłowe (magazyny,
sterowanie itp.),– systemy ogólnego
przeznaczenia.Urządzenia:
– multimedialne,– pda / telefony komórkowe,– bankomaty.
Kategorie interfejsów użytkownika
![Page 3: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/3.jpg)
3
Ograniczenia Techniczne● Aplikacje internetowe:
– protokół bezstanowy (tzw. cienki klient),
– bezpieczeństwo, – ograniczone możliwości
dostępu do danych, (problem okienek dialogowych)
– problem z nawigacją (wygodne do formularzy, ale trudne wypełnianie danych w tabelach, dwuklik myszką),
– kontrola przycisku Wstecz, – ograniczone możliwości współpracy z urządzeniami interfejsu
użytkownika,– kompatybilność przeglądarek,– itd.
![Page 4: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/4.jpg)
4
Ograniczenia Techniczne● Aplikacje biurowe:
– prostota obsługi, – szablony,
automatyzacja zadań biurowych,
– skróty klawiaturowe, – ergonomia interfejsu, – adaptacyjność -
dostosowanie do preferencji i zmieniających się potrzeb użytkownika użytkownika
● Systemy inżynierskie: – duże możliwości, – dopuszczalny skomplikowany interfejs.
![Page 5: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/5.jpg)
5
Ograniczenia Techniczne● Urządzenia (PDA, GSM, przemysłowe):
– udostępniają tylko niezbędne funkcje, – brak myszki, – często brak klawiatury, – niestandardowe klawisze – brak możliwości
dostosowania interfejsu przez użytkownika● Systemy przemysłowe (SCADA):
– ograniczona i bardzo specjalistyczna funkcjonalność,
– bezawaryjność, – obserwowalność: czyli widoczność wszelkich
usterek i awarii, wizualizacja procesów– BEZPIECZEŃSTWO - Spies 'infiltrate US power grid' By Maggie Shiels,
Technology reporter, BBC News, Silicon Valley (http://news.bbc.co.uk/2/hi/technology/7990997.stm)
![Page 6: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/6.jpg)
6
O czym będziemy mówić na kursie?● Na niniejszym kursie skoncentrujemy się na interfejsach
biznesowych, które stanowią znakomitą większość powstających aplikacji.
● Większość aplikacji pisanych na zamówieni dotyczy udostępnienia mechanizmów manipulacji danymi w bazie oraz wyświetlania raportów wynikowych.
● W przypadku takich aplikacji najłatwiej jest sformalizować pewne standardowe metodyki projektowania i wytwarzania.
● Aplikacje specjalistyczne wymagają zazwyczaj innych metodyk.Na przykład trudno sobie wyobrazić wzorzec projektowy MVC zastosowany do symulatora lotu.
![Page 7: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/7.jpg)
7
Dlaczego graficzne interfejsy?
![Page 8: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/8.jpg)
8
Interfejs Użytkownika Jest WażnyInterfejs wpływa na odbiór
programu/strony przez użytkowników.
– Użyteczne oprogramowanie lepiej się sprzedaje.
– Nieużyteczne strony są szybko porzucane.
– Do estetycznego / użytecznego programu z większą przyjemnością się wraca (np. z przerwy na kawę :-).
Interfejs jest często niedoceniany, traktowany powierzchownie, bezkrytycznie, zwłaszcza przez programistów, dla których ważne są algorytmy i struktury danych.
– Użytkownicy często obwiniają siebie za błędy w projekcie interfejsu. („Argh, znowu zapomniałem, że muszę wcisnąć Zapisz. Muszę jeść mniej masła!”)
– Osoby decydujące o zakupie/projekcie systemu zazwyczaj nie są końcowymi użytkownikami, dlatego często nie dbają o ważne szczegóły.
GUIJESTWAŻNY
![Page 9: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/9.jpg)
9
Słaby projekt dużo kosztuje...To truizmy, ale należy o nich wspomnieć:
– Czas użytkownika!Koszt czasu użytkownika wcale się nie zmniejsza zgodnie z prawem Moore'a. (natomiast: "moc obliczeniowa komputerów podwaja się co 18 miesięcy", czyli należy automatyzować jak najwięcej czynności)
– Utrzymanie systemu!Należy poświęcić więcej czasu na projekt, bo zapłaci się za niedokładność później, podczas utrzymania systemu. Zły projekt i podział na komponenty wizualne potrafi utrudnić rozwój.
– Bezpieczeństwo!Błędny interfejs powoduje wypadki!
● Therac-25 (http://en.wikipedia.org/wiki/Therac, Nancy Leveson, “Medical Devices: the Therac-25”, 1995, http://sunnyday.mit.edu/therac-25.html)
● System radarowy USS Vincennes (Peter Neumann, “Aegis, Vincennes, and the Iranian Airbus“, Risks v8 n74, May 1989).
![Page 10: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/10.jpg)
10
Interfejs Użytkownika – Za mało poświęcamy mu uwagi
Coś na pocieszenie: Nie jest łatwo...– Nie jesteś użytkownikiem.
● Większa część inżynierii oprogramowania zajmuje się komunikacją między programistami (specyfikacje, modele obiektowe, biblioteki, etc.).
● UI (Interfejs Użytkownika) zajmuje się 'tylko' komunikacją z użytkownikiem.
– Użytkownik ma zawsze rację...● Jeśli użytkownik ciągle popełnia błędy
podczas używania programu, to najprawdopodobniej winny jest projekt.
● ... ale niestety użytkownik czasem nie ma racji, ponieważ ma zbyt małe doświadczenie i wiedzę! Nie traktujmy każdego użytkownika jak 'eskperta'.
![Page 11: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/11.jpg)
11
Dobry interfejs też kosztujeSzacuje się, że wytworzenie UI stanowi 50%:
– czasu poświęconego na projekt– czasu na implementację– kosztów / czasu utrzymania systemu– rozmiaru całkowitego kodu systemu
Redukcja nakładów tworzenia UI:– Komponenty (kontrolki, databinding, itp.)– Ponowne wykorzystanie (widoki obiektów, itp.)– Maksymalnie uniwersalne komponenty (DBGrid)– Automatyzacja generowania interfejsów (MS Access, Delphi ECO)– DOBRY PROJEKT
![Page 12: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/12.jpg)
12
Interfejs Użytkownika – Na zwraca się uwagę?Funkcjonalność
– ergonomia, prostota obsługi, czytelność prezentowanej informacji, realizacja określonych zadań itp.
Odporność na błędy – stabilność, powtarzalność, konsekwencja, zgodność...
Estetyka– odbiór aplikacji przez użytkowników, czy danej aplikacji używa się z
przyjemnością i chętnie do niej wraca, – odpowiedni dobór kolorów i wyróżnień tak aby nie utrudniały odbioru
przedstawionej informacji.
Dostępność – czy nasza aplikacja może być wykorzystywana przez osoby
z ograniczonymi możliwościami fizycznymi.
![Page 13: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/13.jpg)
13
HCI – Komunikacja Człowiek-Komputer● Dyscyplina zajmująca się badaniem i ogólnymi zasadami
projektowania metod interakcji człowieka z komputerem– głównym zadaniem HCI jest udoskonalenie użyteczności
produktów informatycznych– dobór funkcjonalności dopasowanej do potrzeb użytkownika– organizacja pracy z komputerem (np. zespołowej)– wpływ technologii informatycznych na życie codzienne
użytkowników● HCI wykorzystuje narzędzia badawcze z:
– nauki techniczne i psychologia, marketing, socjologia, antropologia, neurolingwistyka
● Ten wykład będzie nawiązywał do HCI, ale będzie skoncentrowany na aspektach praktycznych i technicznych.
![Page 14: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/14.jpg)
14
Powiedz Kolory Czcionki Na Głos
KsiążkaOłówekSlajdOknoSamochódSamochódKapelusz
Na początek mały test. Proszę głośno powiedzieć kolory w jakich napisane są słowa.
![Page 15: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/15.jpg)
15
Powiedz Kolory Na Głos Ponownie
NiebieskiZielonyPomarańczowyCzarnyCzarnyCzerwonyCzerwonyŻółty
Jest to efekt Stroopa demonstrujący wielokanałowe przesyłanie informacji.
Wniosek: Dodatkowe bodźce powinny wzmacniać podstawowe,a nie konkurować z nimi. Nie jesteśmy w stanie łatwo skoncentrować się na pojedynczym bodźcu. Automatycznie działają na nas wszystkie.
Proszę ponownie głośno powiedzieć kolory w jakich napisane są słowa.
![Page 16: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/16.jpg)
16
KoszmarkiCel:
– wprowadzenie w problematykę– wytworzenie wrażliwości na typowe błędy i niekonsekwencje– przedstawienie błędów w komercyjnych produktach
![Page 17: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/17.jpg)
17
Interfejs Użytkownika - Galeria Niesławy
W pełni graficzny.
Myszka.
WYSIWYG.
Długi komunikat pomocy.
Dziwaczny interfejs.
Scrollbar - Suwak
(ang. hall of shame)
![Page 18: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/18.jpg)
18
Poprawiony Interfejs
Lista wyboru (Listbox) udostępnia zmianę stylu dla sporadycznych jak i stałych użytkowników.
Swobodny wybór dla stałych użytkowników.
Niepotrzebny jest żaden komunikat pomocy.
![Page 19: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/19.jpg)
19
Więcej Galerii Niesławy
powiększ
A najgorsze jest to, że programista napracował się bez sensu... :-(
![Page 20: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/20.jpg)
20
Galeria Sławy czy NiesławyBrak menu.
Dynamiczne klawisze Skrótów. Czy użytkownik zawsze potrzebuje dostosowywać aplikację? Gdzie jest granica rozsądku?
![Page 21: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/21.jpg)
21
PrzykładyOzWin II – program do czytania wiadomości offline (Compuserve
Information Service)
SimCity 2000 firmy Maxis. Przyciski, które mają podmenu dostępne po długim wciśnięciu przycisku myszki.
![Page 22: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/22.jpg)
22
PrzykładNawigacja za pomocą klawisza Tab.
– (Unisyn's Automate Pro – program do automatyzacji zadań dla Windows NT.)
![Page 23: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/23.jpg)
23
PrzykładyPomoc kontekstowa jest bardzo potrzebna, ale przesada, a
zwłaszcza długie komunikaty mogą doprowadzić do frustracji.
![Page 24: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/24.jpg)
24
PrzykładyWybór kontrolki jak najbardziej właściwy, ale jednostki pozostawiają
wiele do życzenia. (Internet Explorer 3.0 – Rozmiar Cache)
Instalacja programu PowerSearch. Nie ma problemu, gdy użytkownik wybierze katalog domyślny? A co gdy będzie chciał zainstalować gdzie indziej?
A tak w ogóle, czy nie dałoby się sprawdzić gdzie jest zainstalowany Word?
![Page 25: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/25.jpg)
25
PrzykładyUżytkownicy zdecydowanie szybciej przeglądają listy w kierunku od
góry do dołu (heurystyka). Tutaj Microsoft jednak zmusił ich do przeglądania dodatkowo od lewej do prawej. (Internet Explorer 3.0)
![Page 26: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/26.jpg)
26
PrzykładyProgram: HTML Transit
Poświęcanie 25% powierzchni okna na przyciski komend? – Staraj się nigdy nie mieć dwóch przycisków o takim samym
znaczeniu.
![Page 27: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/27.jpg)
27
PrzykładyPowerBuilder – udostępniał pomoc kontekstową i pomoc w Pasku
Statusu. – Problem: pomoc kontekstowa była pokazywana z opóźnieniem
ok 2s, ale również pomoc w pasku status była pokazywana z opóźnieniem.
– Skutek: po zmianie pozycji myszy, w pasku statusu była nieaktualna informacja.
![Page 28: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/28.jpg)
28
PrzykładyPrzyciski powinny być nieaktywne!
Możemy być pewni, że programiści Microsoft potrafią dynamicznie zmieniać kolory ikon. Czy zatem wpływ na wyeliminowanie 'szarych', nieaktywnych ikon mieli graficy Microsoft?
![Page 29: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/29.jpg)
29
PrzykładyMicrosoft Excel – Wytnij i Wklej
Po wciśnięciu wytnij, fragment pozostaje nienaruszony do momentu aż go nie wkleimy w nowym miejscu.
Ponieważ 'wszyscy' znają Excela więc spodziewam się gorącej dyskusji. :-)
![Page 30: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/30.jpg)
30
PrzykładyOkna z suwakami! Horror Accessa?
„Unfortunately, visit any programming support forum, and you'll see an ever-increasing number of new programmers asking how to create scrollable forms. The only appropriate answer is, "You don't."”
PeopleSoft
![Page 31: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/31.jpg)
31
PrzykładyChyba ktoś nie przeczytał o kontrolce listy wyboru? (Listbox?)
![Page 32: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/32.jpg)
32
PrzykładyZnajdź użytkownika w
rozwijalnej liście zawierającejkilka tysięcy nazwisk?
Są lepsze sposoby walidacji, czy użytkownik wpisał rzeczywiście cyfry! (np.: InputMask)
![Page 33: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/33.jpg)
33
PrzykładyMS Word: Wykluczające się opcje. Dlaczego nie zostały użyte
komponenty RadioButton. Należy zaznaczyć, że bardzo nam to nie przeszkadza i szybko jesteśmy się w stanie tego nauczyć, ale jest to jednak niespójność.
Sierpień 1999 edition of the Visual Basic Programmer's Journal 101 Tech Tips for VB Developers
Niewielki fragment kodu może ograniczyć wybór użytkownika dojednej pozycji w danym momencie. Taka zmiana jest użyteczna gdy chcesz użyć checkboxów zamiast radiobutton.
Ostatnie zdanie powinno brzmieć: Ta zmiana jest użyteczna gdy chcesz zmylić użytkownika.
![Page 34: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/34.jpg)
34
PrzykładUżytkownicy są przyzwyczajeni do okienek potwierdzeń! Większość wciska
ENTER bez czytania. Tym bardziej, że poniższe okno ma więcej niż dwie linijki tekstu :-).
ENTER? ESCAPE? A w oknie są przyciski OK i Cancel?
MacOS rozwiązał to inaczej: często klawisze nie są obsługiwane. Tylko kliknięcie myszką zamyka okno.
![Page 35: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/35.jpg)
35
PrzykładyInternet Explorer, Visual Studio.
Czy kontrolka Checkbox jest niezbędna? Przecież i tak nie mamy żadnego wyboru?
No tak. Projektant chciał abyśmy uniknęli automatycznego wciśnięcia klawisza enter, enter, enter...
![Page 36: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/36.jpg)
36
PrzykładyQuiz: Ilu użytkowników
wciśnie Enter? Ilu Next? A ilu Finish?
Oracle's SQL*Net Easy ConfigurationQuiz 1: Jak wyjść z aplikacji?
Quiz 2: Po co ten komunikatjeśli nie można anulowaćdecyzji?
![Page 37: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/37.jpg)
37
Przykłady
Windows Help Designer. Programista zapomniał zaznaczyć opcji automatycznego sortowania.
Instalacja modemu U.S. Robotics:
W dodatku tylko opcje direct dial i postal mailpowinny być aktywne.
![Page 38: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/38.jpg)
38
PrzykładyKontynuuj używanie, czy
proces zamykania?Czym różni się Abort odCancel?
Proces tworzenia tabeliw MS Access dla nowegoużytkownika może staćsię nie lada wyzwaniem?
![Page 39: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/39.jpg)
39
PrzykładyXblock – gra.
Kto chciałby zająć miejsce numer 0?
IBM's AudiostationQuiz: Co się stanie gdywciśniemy Power?
![Page 40: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/40.jpg)
40
PrzykładyRozmieszczenie przycisków.
Ok czy OK? Po co używać ALT+O i ALT+C, przecież i tak większość będzie wciskać ENTER i ESC.
![Page 41: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/41.jpg)
41
PrzykładyIdiotyczne komunikaty:
ClearCase, a source-code control system from Rational Software:
NT workstation
Quicken's Turbo Tax – anulowanie niemalże każdej czynności:
![Page 42: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/42.jpg)
42
PrzykładyOdpowiedni dobór kolorów...
(Easy CD Creator)
Zbyt mały kontrast utrudnia używanie aplikacji dla niepełnosprawnych. (Accessibility) (Apple's QuickTime 4.0 Player)
Błąd. Sukces.
![Page 43: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/43.jpg)
43
PrzykładyNieprawidłowe użycie kontrolek:
– (uninstalling „Freeloader”, an off-line internet browser)
„Classified”, a shareware diary program:– nie można wprowadzać daty
za pomocą klawiatury– zmienić rok można tylko
za pomocą paska
![Page 44: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/44.jpg)
44
PrzykładyMicrosoft's NT Operating System:
– Od kiedy sukces jest błędem?
Microsoft's Access 95:– Komunikat pojawia się przy próbie uruchomienia kwerendy,
która w wyniku nie modyfikuje żadnych wierszy.
![Page 45: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/45.jpg)
45
PrzykładyPretty Good Privacy:
![Page 46: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/46.jpg)
46
PrzykładyNie istniejący obiekt...
– nie, to tylko brak uprawnień do odczytu
– Nie wprowadzaj użytkownika w błąd.
![Page 47: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/47.jpg)
47
Przykłady● Moodle – system do tworzenia serwisów dydaktycznych● Spróbuj zmienić opis dotyczący zajęć...
● Nie ukrywaj funkcjonalności przed użytkownikiem.
![Page 48: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/48.jpg)
48
DEMO
![Page 49: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/49.jpg)
49
Bruce Tognazinni Podstawy projektowania interakcji
Bruce "Tog" Tognazzini is a principal with the Nielsen Norman Group, the "dream team" firm specializing in human-computer interaction. Tog was lead designer at WebMD, the super-vertical start-up founded in February, 1996 by Jim Clark, founder of Silicon Graphics and Netscape. Before that, Tog was Distinguished Engineer for Strategic Technology at Sun Microsystems. During his 14 years at Apple Computer, he founded the Apple Human Interface Group and acted as Apple's Human Interface Evangelist. Tog has published two books, Tog on Interface and Tog on Software Design, both from Addison Wesley, and is currently publishing the free webzine, "AskTog."
![Page 50: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/50.jpg)
50
Wytyczne Bruce'a Tognazziniego
● 1. Oczekiwania● 2. Autonomia● 3. Nierozpoznawanie
kolorów● 4. Spójność● 5. Wartości domyślne● 6. Efektywność
użytkownika● 7. Interfejsy dla
odkrywców● 8. Prawo Fitts’ów
● 9. Obiekty interfejsu użytkownika
● 10. Redukcja opóźnienia● 11. Łatwość uczenia● 12. Użycie metafor● 13. Ochrona pracy
użytkowników● 14. Czytelność● 15. Śledzenie użytkownika● 16. Widoczna nawigacja
Na podstawie tłumaczenia: http://www.eioba.pl/a2186/podstawy_projektowania_interakcji (Eryk 'eof' Orłowski)
![Page 51: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/51.jpg)
51
Oczekiwania, AutonomiaOczekiwania
– zaspokojenie potrzeb użytkownikaAutonomia
– swoboda = szybka nauka– paradoks braku ograniczeń– autonomia nie istnieje bez poczucia kontroli, a kontrola bez
aktualnej informacji– przez wiele lat system operacyjny Macintosh pokazywał
użytkownikom ikonę kosza, którego stan napełnienia wskazywał na nadchodzącą eksplozję, nawet po skasowaniu pojedynczego pliku...
![Page 52: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/52.jpg)
52
Nierozpoznawanie kolorów, SpójnośćNierozpoznawanie kolorów
– nie wszyscy użytkownicy widzą kolory,– lub nie widzą jednego ze składników: czerwonego, niebieskiego
lub zielonegoSpójność
– Poziomy spójności:● 1. interpretacja zachowań użytkowników,● 2. niewidoczne struktury,● 3. niewielkie widoczne struktury,● 4. ogólny wygląd aplikacji bądź usługi - ekrany powitalne (splash
screens),● 5. gama produktów,● 6. spójność wewnętrzna,● 7. spójność ogólna.
![Page 53: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/53.jpg)
53
Niespójność,Niespójność
– wyróżnienie obiektów, które zachowują się odmiennie– należy unikać uniformizacji obiektów odpowiedzialnych za
różne zadania
Najważniejsza jest spójność z oczekiwaniami użytkowników.– Można ją zapewnić wyłącznie w drodze testów z udziałem
użytkowników.
![Page 54: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/54.jpg)
54
Wartości domyślne, Efektywność użytkownikaWartości domyślne
– powinny być łatwe do zmodyfikowania– wartości domyślne powinny być adekwatne do oczekiwanych
danych - unikaj sformułowań typu "domyślna wartość" w polach wartości
Efektywność użytkownika– ludzie kosztują znacznie więcej niż maszyny– czas z punktu widzenia użytkownika, a nie maszyny (prędkość
podgrzewania wody 1:10 czy 1:11)– ankieta na dyskietkach czy papierowych formularzach
![Page 55: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/55.jpg)
55
Efektywność użytkownika cd.– Etykiety poleceń, menu etc. poprzedzaj słowami kluczowymi.
– Dodatkowa informacja (dodaj, zaktualizuj) z lewego przykładu nie równoważy zalety szybkiego skanowania słów kluczowych.
Źle:Wstaw podział stronyDodaj stopkęZaktualizuj spis treści
Dobrze: Wstawpodział stronystopkęspis treści
![Page 56: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/56.jpg)
56
Interfejsy dla odkrywcówInterfejsy dla odkrywców
– Daj użytkownikom dobrze oznakowane drogi i pozwól włączyć napęd na cztery koła. Staraj się nie więzić użytkowników w zamkniętej ścieżce danej usługi - oferuj raczej linię najmniejszego oporu.
– Czasami konieczne jest dostarczanie rutynowych rozwiązań– Wskazuj użytkownikom wyraźnie i w sposób dla nich intuicyjny,
gdzie znajduje się punkt wejścia ("start").– Pozwalaj na odwracalność wykonywanych poleceń.– Zawsze udostępniaj możliwość cofnięcia wydanych wcześniej
poleceń. (zamiast: Czy na 100% chcesz usunąć dokument?)
– Badania dowiodły, że ludzie pracujący w "niebezpiecznym" środowisku popełniają dokładnie tyle samo błędów, ile popełniają w wyposażonym w odpowiednie zabezpieczenia.
![Page 57: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/57.jpg)
57
Prawo Fittsa, Obiekty interfejsu użytkownikaPrawo Fittsa
– Czas potrzebny do osiągnięcia celu jest funkcją odległości i rozmiaru celu.
Obiekty interfejsu użytkownika– Obiekty użytkownika to foldery, dokumenty, kosz. – Pojawiają się w środowisku użytkownika i mogą, ale nie muszą
być odzwierciedlone w obiektach kodu aplikacji.
Źródło obrazka: http://www.asktog.com/columns/022DesignedToGiveFitts.html
Koncepcja pokazywania wyśrodkowanych w pionie podmenu:
![Page 58: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/58.jpg)
58
Redukcja opóźnieniaRedukcja opóźnienia - Kiedy to możliwe, używaj wielu wątków w celu
uniknięcia latencji. ● potwierdzaj kliknięcia wszystkich przycisków wizualnie bądź dźwiękowo w
ciągu 50 milisekund● wyświetlaj klepsydrę dla zadań wykonujących się w czasie pomiędzy 50
milisekund do 1 sekundy● animuj klepsydrę, pokazując, że system pracuje (nie zawiesił się)● wyświetlaj informację o szacunkowym czasie wykonywania zadania trwającego
dłużej niż 2 sekundy● informuj o postępach procesu● absorbuj uwagę użytkowników oczekujących na wykonanie dłużej trwających
procesów, na przykład wyświetlając informację o aktualnie wykonywanej czynności bądź czasie pozostałym do zakończenia
● informuj użytkownika dźwiękowo o zakończeniu procesów trwających dłużej niż 10 sekund, aby mogli wykonywać inne zadania poza aplikacją i powrócić do niej w odpowiedniej chwili
● uniemożliwiaj wielokrotne naciśnięcia przycisków. Ponieważ interfejsy stron www reagują z opóźnieniem, użytkownicy często klikają wielokrotnie w celu wymuszenia reakcji, co powoduje dalsze opóźnienia.
![Page 59: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/59.jpg)
59
Łatwość uczeniaŁatwość uczenia
– W idealnej sytuacji produkty nie miałyby krzywej uczenia - użytkownicy korzystając z nich po raz pierwszy osiągaliby poziom eksperta natychmiast. W praktyce nawet najprostsze aplikacje charakteryzują się krzywą uczenia.
– Unikaj kompromisów. Użyteczność nie musi wykluczać łatwości uczenia i odwrotnie. Na początek zdecyduj, która wartość jest w danym przypadku istotniejsza i próbuj osiągnąć obie. Wzrost łatwości uczenia nie przychodzi jednak automatycznie wraz z łatwością użycia.
![Page 60: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/60.jpg)
60
Użycie metafor, Ochrona pracy użytkownikówUżycie metafor
– Rozważnie wybieraj metafory, powinny one umożliwić użytkownikowi szybkie pojęcie szczegółów modelu koncepcyjnego aplikacji. Dobre metafory są historiami, tworzącymi obrazy w wyobraźni użytkowników.
http://www.doradztwofinansowe.pl/
Microsoft Bob (rok 1995)
![Page 61: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/61.jpg)
61
Ochrona pracy użytkownikówOchrona pracy użytkowników
– Upewnij się, że użytkownicy nie mogą utracić efektów swojej pracy w wyniku:
● własnych błędów, ● błędów transmisji przez sieć, ● bądź z jakiegokolwiek innego powodu, który
można przewidzieć bądź go uniknąć.
![Page 62: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/62.jpg)
62
Czytelność, Śledzenie użytkownikaCzytelność
– Zapewniaj czytelność tekstu poprzez wysoki kontrast, najlepiej czarnego fontu na jasnym tle. Unikaj szarego tła.
– Używaj wielkości fontów wystarczającej do swobodnego czytania tekstu na standardowych monitorach.
– Zwracaj szczególną uwagę na potrzeby osób starszych.Śledzenie użytkownika
– czy jest to pierwszy raz, kiedy użytkownik korzysta z aplikacji– gdzie znajduje się użytkownik– dokąd zmierza użytkownik– gdzie użytkownik był w czasie sesji pracy z systemem– gdzie był użytkownik przed opuszczeniem systemu
![Page 63: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/63.jpg)
63
Widoczna nawigacjaWidoczna nawigacja
– Unikaj niewidocznej nawigacji.– Sieć www pełna jest serwisów wypełnionych wymyślnymi
systemami menu, w efekcie niewidocznymi dla użytkownika.– Użytkownicy często nie mają możliwości dowiedzieć się więcej
ponad to, na jakiej stronie się znaleźli. – Nawigacja powinna być maksymalnie uproszczona, przejrzysta
i naturalna dla użytkownika.
http://www.brillpublications.com/
![Page 64: Projektowanie Graficznych Interfejsów Użytkownikawikidyd.iem.pw.edu.pl/attachments/GIP/GIP_2010_wyk1.pdf2 Różnorodność interfejsów użytkownika Internet: – strony domowe,](https://reader031.vdocuments.pub/reader031/viewer/2022022802/5c7905d009d3f268558c5f4b/html5/thumbnails/64.jpg)
64
Interakcja
Dziękuję za uwagę.
Chcemy być coraz lepsi!
Jeżeli coś cię zainteresowało napisz e-maila:– [email protected]
Jeżeli coś cię bardzo znudziło napisz e-maila:– [email protected]
Jeżeli zauważyłeś błąd napisz e-maila:– [email protected]