Inżynieria oprogramowania: pośrednictwo graficzne

Inżynieria oprogramowania: projektowanie pośrednictwa graficznego Politechnika Śląska Instytut Matematyki Wydział Matematyki Stosowanej

Pośrednictwo graficzne aplikacji:

Pośrednictwo graficzne aplikacji: ˆ (graficzny) interfejs użytkownika

Pośrednictwo graficzne aplikacji: ˆ (graficzny) interfejs użytkownika ˆ (graphical) user interface - GUI

Pośrednictwo graficzne aplikacji: ˆ (graficzny) interfejs użytkownika ˆ (graphical) user interface - GUI wykorzystanie sprzętu: ˆ monitor (kolorowy) wysokiej rozdzielczości

Pośrednictwo graficzne aplikacji: ˆ (graficzny) interfejs użytkownika ˆ (graphical) user interface - GUI wykorzystanie sprzętu: ˆ monitor (kolorowy) wysokiej rozdzielczości ˆ mysz, tablet, klawiatura

Pośrednictwo graficzne aplikacji: ˆ (graficzny) interfejs użytkownika ˆ (graphical) user interface - GUI wykorzystanie sprzętu: ˆ monitor (kolorowy) wysokiej rozdzielczości ˆ mysz, tablet, klawiatura ˆ aparat fotograficzny, kamera wideo

Pośrednictwo graficzne aplikacji: ˆ (graficzny) interfejs użytkownika ˆ (graphical) user interface - GUI wykorzystanie sprzętu: ˆ monitor (kolorowy) wysokiej rozdzielczości ˆ mysz, tablet, klawiatura ˆ aparat fotograficzny, kamera wideo ˆ sterowanie dotykiem

Pośrednictwo graficzne aplikacji: ˆ (graficzny) interfejs użytkownika ˆ (graphical) user interface - GUI wykorzystanie sprzętu: ˆ monitor (kolorowy) wysokiej rozdzielczości ˆ mysz, tablet, klawiatura ˆ aparat fotograficzny, kamera wideo ˆ sterowanie dotykiem ˆ akcelerometr, żyroskop, magnetometr

Pośrednictwo graficzne aplikacji: ˆ (graficzny) interfejs użytkownika ˆ (graphical) user interface - GUI wykorzystanie sprzętu: ˆ monitor (kolorowy) wysokiej rozdzielczości ˆ mysz, tablet, klawiatura ˆ aparat fotograficzny, kamera wideo ˆ sterowanie dotykiem ˆ akcelerometr, żyroskop, magnetometr ˆ lokalizacja (GPS, Glonass)

Cechy GUI Zalety GUI Projektowanie GUI cechy pośrednictwa graficznego aplikacji:

Cechy GUI Zalety GUI Projektowanie GUI cechy pośrednictwa graficznego aplikacji: ˆ Okna: wiele okien umożliwia jednoczesne wyświetlanie różnych informacji na ekranie

Cechy GUI Zalety GUI Projektowanie GUI cechy pośrednictwa graficznego aplikacji: ˆ Okna: wiele okien umożliwia jednoczesne wyświetlanie różnych informacji na ekranie ˆ Ikony: Ikony reprezentują różne rodzaje informacji, np. pliki, procesy, akcje

Cechy GUI Zalety GUI Projektowanie GUI cechy pośrednictwa graficznego aplikacji: ˆ Okna: wiele okien umożliwia jednoczesne wyświetlanie różnych informacji na ekranie ˆ Ikony: Ikony reprezentują różne rodzaje informacji, np. pliki, procesy, akcje ˆ Menu: Polecenie wybiera się z menu, a nie wpisuje w postaci intrukcji języka poleceń

Cechy GUI Zalety GUI Projektowanie GUI cechy pośrednictwa graficznego aplikacji: ˆ Okna: wiele okien umożliwia jednoczesne wyświetlanie różnych informacji na ekranie ˆ Ikony: Ikony reprezentują różne rodzaje informacji, np. pliki, procesy, akcje ˆ Menu: Polecenie wybiera się z menu, a nie wpisuje w postaci intrukcji języka poleceń ˆ Wskazywanie: Urządzenia do wskazywania, takie jak mysz lub ekran dotykowy, służą do wyboru z menu i wskazywania wybranych elementów w oknie

Cechy GUI Zalety GUI Projektowanie GUI cechy pośrednictwa graficznego aplikacji: ˆ Okna: wiele okien umożliwia jednoczesne wyświetlanie różnych informacji na ekranie ˆ Ikony: Ikony reprezentują różne rodzaje informacji, np. pliki, procesy, akcje ˆ Menu: Polecenie wybiera się z menu, a nie wpisuje w postaci intrukcji języka poleceń ˆ Wskazywanie: Urządzenia do wskazywania, takie jak mysz lub ekran dotykowy, służą do wyboru z menu i wskazywania wybranych elementów w oknie ˆ Grafika: Elementy graficzne można połączyć z tekstowymi na tym samym ekranie

Cechy GUI Zalety GUI Projektowanie GUI zalety pośrednictwa graficznego:

Cechy GUI Zalety GUI Projektowanie GUI zalety pośrednictwa graficznego: ˆ łatwość przyswajania/nauki

Cechy GUI Zalety GUI Projektowanie GUI zalety pośrednictwa graficznego: ˆ łatwość przyswajania/nauki ˆ wykorzystanie/ilustracja wielozadaniowości

Cechy GUI Zalety GUI Projektowanie GUI zalety pośrednictwa graficznego: ˆ łatwość przyswajania/nauki ˆ wykorzystanie/ilustracja wielozadaniowości ˆ wydajność interakcji/dostęp do całego dokumentu lub dużego fragmentu

Cechy GUI Zalety GUI Projektowanie GUI zalety pośrednictwa graficznego: ˆ łatwość przyswajania/nauki ˆ wykorzystanie/ilustracja wielozadaniowości ˆ wydajność interakcji/dostęp do całego dokumentu lub dużego fragmentu ˆ prezentacja analogiczna jak w rzeczywistości (np. galeria obrazów)

Cechy GUI Zalety GUI Projektowanie GUI zalety pośrednictwa graficznego: ˆ łatwość przyswajania/nauki ˆ wykorzystanie/ilustracja wielozadaniowości ˆ wydajność interakcji/dostęp do całego dokumentu lub dużego fragmentu ˆ prezentacja analogiczna jak w rzeczywistości (np. galeria obrazów) pewne cechy kojarzone z GUI, ale nie wynikające wprost z graficznego przedstawiania informacji: ˆ dostępność systemu pomocy

Cechy GUI Zalety GUI Projektowanie GUI zalety pośrednictwa graficznego: ˆ łatwość przyswajania/nauki ˆ wykorzystanie/ilustracja wielozadaniowości ˆ wydajność interakcji/dostęp do całego dokumentu lub dużego fragmentu ˆ prezentacja analogiczna jak w rzeczywistości (np. galeria obrazów) pewne cechy kojarzone z GUI, ale nie wynikające wprost z graficznego przedstawiania informacji: ˆ dostępność systemu pomocy ˆ operacje cofnij/ponów

Cechy GUI Zalety GUI Projektowanie GUI zalety pośrednictwa graficznego: ˆ łatwość przyswajania/nauki ˆ wykorzystanie/ilustracja wielozadaniowości ˆ wydajność interakcji/dostęp do całego dokumentu lub dużego fragmentu ˆ prezentacja analogiczna jak w rzeczywistości (np. galeria obrazów) pewne cechy kojarzone z GUI, ale nie wynikające wprost z graficznego przedstawiania informacji: ˆ dostępność systemu pomocy ˆ operacje cofnij/ponów ˆ unifikacja sterowników (cecha systemu operacyjnego!)

Cechy GUI Zalety GUI Projektowanie GUI Proces projektowania graficznego interfejsu użytkownika:

Cechy GUI Zalety GUI Projektowanie GUI zasady projektowania pośrednictwa graficznego:

Cechy GUI Zalety GUI Projektowanie GUI zasady projektowania pośrednictwa graficznego: ˆ Oparcie na doświadczeniach użytkownika: Interfejs powinien posługiwać się pojęciami i kategoriami zbliżonymi do doświadczeń osób, które najczęściej będą z niego korzystać

Cechy GUI Zalety GUI Projektowanie GUI zasady projektowania pośrednictwa graficznego: ˆ Oparcie na doświadczeniach użytkownika: Interfejs powinien posługiwać się pojęciami i kategoriami zbliżonymi do doświadczeń osób, które najczęściej będą z niego korzystać ˆ Spójność: podobne operacje powinny być wykonywane w ten sam sposób

Cechy GUI Zalety GUI Projektowanie GUI zasady projektowania pośrednictwa graficznego: ˆ Oparcie na doświadczeniach użytkownika: Interfejs powinien posługiwać się pojęciami i kategoriami zbliżonymi do doświadczeń osób, które najczęściej będą z niego korzystać ˆ Spójność: podobne operacje powinny być wykonywane w ten sam sposób ˆ Stabilność: bez niespodzianek/zaskoczeń

Cechy GUI Zalety GUI Projektowanie GUI zasady projektowania pośrednictwa graficznego: ˆ Oparcie na doświadczeniach użytkownika: Interfejs powinien posługiwać się pojęciami i kategoriami zbliżonymi do doświadczeń osób, które najczęściej będą z niego korzystać ˆ Spójność: podobne operacje powinny być wykonywane w ten sam sposób ˆ Stabilność: bez niespodzianek/zaskoczeń ˆ Cofanie: interfejs powinien obejmować mechanizmy, które umożliwiają użytkownikom wycofanie się z błędów

Cechy GUI Zalety GUI Projektowanie GUI zasady projektowania pośrednictwa graficznego: ˆ Oparcie na doświadczeniach użytkownika: Interfejs powinien posługiwać się pojęciami i kategoriami zbliżonymi do doświadczeń osób, które najczęściej będą z niego korzystać ˆ Spójność: podobne operacje powinny być wykonywane w ten sam sposób ˆ Stabilność: bez niespodzianek/zaskoczeń ˆ Cofanie: interfejs powinien obejmować mechanizmy, które umożliwiają użytkownikom wycofanie się z błędów ˆ Porady/pomoc: interfejs powinien przekazywać znaczące informacje zwrotne oraz pomoc kontekstową

Cechy GUI Zalety GUI Projektowanie GUI zasady projektowania pośrednictwa graficznego: ˆ Oparcie na doświadczeniach użytkownika: Interfejs powinien posługiwać się pojęciami i kategoriami zbliżonymi do doświadczeń osób, które najczęściej będą z niego korzystać ˆ Spójność: podobne operacje powinny być wykonywane w ten sam sposób ˆ Stabilność: bez niespodzianek/zaskoczeń ˆ Cofanie: interfejs powinien obejmować mechanizmy, które umożliwiają użytkownikom wycofanie się z błędów ˆ Porady/pomoc: interfejs powinien przekazywać znaczące informacje zwrotne oraz pomoc kontekstową ˆ Rozróżnianie użytkowników/modelu użytkownika: interfejs powinien oferować udogodnienia dostosowane do różnych rodzajów użytkowników systemu

Cechy GUI Zalety GUI Projektowanie GUI Wskaźniki opisujące użyteczność (usability) (Nielsen):

Cechy GUI Zalety GUI Projektowanie GUI Wskaźniki opisujące użyteczność (usability) (Nielsen): efektywność (efficiency) łatwość uzyskania celu

Cechy GUI Zalety GUI Projektowanie GUI Wskaźniki opisujące użyteczność (usability) (Nielsen): efektywność (efficiency) łatwość uzyskania celu satysfakcja (satisfaction) brak dyskomfortu, pozytywne nastawienie do produktu

Cechy GUI Zalety GUI Projektowanie GUI Wskaźniki opisujące użyteczność (usability) (Nielsen): efektywność (efficiency) łatwość uzyskania celu satysfakcja (satisfaction) brak dyskomfortu, pozytywne nastawienie do produktu przyswajalność (learnability) łatwość nauczenia się zasad działania w celu szybkiego rozpoczęcia pracy

Cechy GUI Zalety GUI Projektowanie GUI Wskaźniki opisujące użyteczność (usability) (Nielsen): efektywność (efficiency) łatwość uzyskania celu satysfakcja (satisfaction) brak dyskomfortu, pozytywne nastawienie do produktu przyswajalność (learnability) łatwość nauczenia się zasad działania w celu szybkiego rozpoczęcia pracy zapamiętywalność (memorability) łatwość powrotu do pracy z systemem po przerwie (użycie schematów, wzorców)

Cechy GUI Zalety GUI Projektowanie GUI Wskaźniki opisujące użyteczność (usability) (Nielsen): efektywność (efficiency) łatwość uzyskania celu satysfakcja (satisfaction) brak dyskomfortu, pozytywne nastawienie do produktu przyswajalność (learnability) łatwość nauczenia się zasad działania w celu szybkiego rozpoczęcia pracy zapamiętywalność (memorability) łatwość powrotu do pracy z systemem po przerwie (użycie schematów, wzorców) bezbłędność/błędy (faultlessness/errors) liczba (popełnianych) błędów oraz zdolność do wznowienia działania po awarii (wydobycia się z błędu)

Miary użyteczności (ilościowe / jakościowe) Cechy GUI Zalety GUI Projektowanie GUI miary wydajności (ang. performance metrics)

Miary użyteczności (ilościowe / jakościowe) Cechy GUI Zalety GUI Projektowanie GUI miary wydajności (ang. performance metrics) miary problemów (ang. issue-based metrics)

Miary użyteczności (ilościowe / jakościowe) Cechy GUI Zalety GUI Projektowanie GUI miary wydajności (ang. performance metrics) miary problemów (ang. issue-based metrics) miary fizjologiczne i behawioralne (ang. behavioral and physiological metrics)

Miary użyteczności (ilościowe / jakościowe) Cechy GUI Zalety GUI Projektowanie GUI miary wydajności (ang. performance metrics) miary problemów (ang. issue-based metrics) miary fizjologiczne i behawioralne (ang. behavioral and physiological metrics) miary łączone i porównawcze (ang. combined and comparative metrics)

Cechy GUI Zalety GUI Projektowanie GUI Miary wydajności (ilościowe) wykonanie (ukończenie) zadania (ang. task success)

Cechy GUI Zalety GUI Projektowanie GUI Miary wydajności (ilościowe) wykonanie (ukończenie) zadania (ang. task success) ˆ sukces binarny (ang. binary success) oraz

Cechy GUI Zalety GUI Projektowanie GUI Miary wydajności (ilościowe) wykonanie (ukończenie) zadania (ang. task success) ˆ sukces binarny (ang. binary success) oraz ˆ poziom wykonania zadania (ang. levels of sucess)

Cechy GUI Zalety GUI Projektowanie GUI Miary wydajności (ilościowe) wykonanie (ukończenie) zadania (ang. task success) ˆ sukces binarny (ang. binary success) oraz ˆ poziom wykonania zadania (ang. levels of sucess) czas wykonania zadania (ang. time-on-task) ważne: odpowiednie sformułowanie zadania

Cechy GUI Zalety GUI Projektowanie GUI Miary wydajności (ilościowe) wykonanie (ukończenie) zadania (ang. task success) ˆ sukces binarny (ang. binary success) oraz ˆ poziom wykonania zadania (ang. levels of sucess) czas wykonania zadania (ang. time-on-task) ważne: odpowiednie sformułowanie zadania błędy (and. errors) pomiar liczby błędów popełnionych podczas wykonywania zadania (udział moderatora)

Cechy GUI Zalety GUI Projektowanie GUI Miary wydajności (ilościowe) wykonanie (ukończenie) zadania (ang. task success) ˆ sukces binarny (ang. binary success) oraz ˆ poziom wykonania zadania (ang. levels of sucess) czas wykonania zadania (ang. time-on-task) ważne: odpowiednie sformułowanie zadania błędy (and. errors) pomiar liczby błędów popełnionych podczas wykonywania zadania (udział moderatora) efektywność (ang. efficiency) wysiłek użytkownika, np. liczba wymaganych akcji

Cechy GUI Zalety GUI Projektowanie GUI Komunikatywność:

Cechy GUI Zalety GUI Projektowanie GUI Rozróżnianie modelu użytkownika (Firefox):

Cechy GUI Zalety GUI Projektowanie GUI Rozróżnianie modelu użytkownika (VLC):

Model View Controller (MVC): Model Widok Koordynator: Cechy GUI Zalety GUI Projektowanie GUI

Zanim pojawił się interface graficzny:

Douglas Engelbart SRI 1967 - myszka: http: //sloan.stanford.edu/mousesite/1968demo.html

Douglas Engelbart SRI 1967 - GUI:

Douglas Engelbart SRI 1967 - Workstation:

Xerox Alto/Star (1981):

Apple Lisa (1980-81):

DEC GEM (1984):

Windows 1 (1984):

Berkeley Softworks GEOS (C=64, 64kB RAM) (1985):

AmigaOS (1985):

MacOS X:

Linux (Ubuntu+GNOME):

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Elementy nowoczesnego pośrednictwa graficznego: wstążka (ribbon)

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Elementy nowoczesnego pośrednictwa graficznego: wstążka z Office 2010

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D przed wstążką (zakładki w menu Delphi 7)

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D przed wstążką (Lotus esuite, źródło: Wikipedia)

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Interfejs Ribbon we własnych aplikacjach:

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Interfejs Ribbon we własnych aplikacjach: ˆ Windows 7 Ribbon Control element interfejsu Windows 7, może ew. działać z Vista (patch)

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Interfejs Ribbon we własnych aplikacjach: ˆ Windows 7 Ribbon Control element interfejsu Windows 7, może ew. działać z Vista (patch) ˆ niezależne biblioteki (najczęściej płatne), np. http://www.devcomponents.com

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Interfejs Ribbon we własnych aplikacjach: ˆ Windows 7 Ribbon Control element interfejsu Windows 7, może ew. działać z Vista (patch) ˆ niezależne biblioteki (najczęściej płatne), np. http://www.devcomponents.com ˆ bezpłatna biblioteka dla C# (http://windowsribbon.codeplex.com/) korzysta z Windows 7 Ribbon control

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Interfejs Ribbon we własnych aplikacjach: ˆ Windows 7 Ribbon Control element interfejsu Windows 7, może ew. działać z Vista (patch) ˆ niezależne biblioteki (najczęściej płatne), np. http://www.devcomponents.com ˆ bezpłatna biblioteka dla C# (http://windowsribbon.codeplex.com/) korzysta z Windows 7 Ribbon control ˆ Microsoft Ribbon for WPF (działa z XP i.net Framework 3.5SP1)

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Interfejs Ribbon we własnych aplikacjach: ˆ Windows 7 Ribbon Control element interfejsu Windows 7, może ew. działać z Vista (patch) ˆ niezależne biblioteki (najczęściej płatne), np. http://www.devcomponents.com ˆ bezpłatna biblioteka dla C# (http://windowsribbon.codeplex.com/) korzysta z Windows 7 Ribbon control ˆ Microsoft Ribbon for WPF (działa z XP i.net Framework 3.5SP1) ˆ Ribbon35 (http://ribbon.codeplex.com/, http://www.staffinder.net/carbisoft/ribbon.aspx) bezpłatny komponent dla.net

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Interfejs Ribbon we własnych aplikacjach: ˆ Windows 7 Ribbon Control element interfejsu Windows 7, może ew. działać z Vista (patch) ˆ niezależne biblioteki (najczęściej płatne), np. http://www.devcomponents.com ˆ bezpłatna biblioteka dla C# (http://windowsribbon.codeplex.com/) korzysta z Windows 7 Ribbon control ˆ Microsoft Ribbon for WPF (działa z XP i.net Framework 3.5SP1) ˆ Ribbon35 (http://ribbon.codeplex.com/, http://www.staffinder.net/carbisoft/ribbon.aspx) bezpłatny komponent dla.net ˆ Ciekawostka: w Delphi od wersji 2009 komponent Ribbon jest wbudowany

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Elementy nowoczesnego pośrednictwa graficznego: wstążka (wersja web - demo)

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Elementy nowoczesnego pośrednictwa graficznego: wstążka (MS SkyDrive)

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Elementy nowoczesnego pośrednictwa graficznego: pomoc, Pan Spinacz? Formaty plików pomocy: hlp, chm, Microsoft Help Viewer (mshc), html

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Standardowe okienka dialogowe (Office 2010 na górze, Windows Aero/Vista/7 na dole)

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D MS Windows TaskDialog (źródło: msdn) (niezgodny ze standardowym okienkiem dialogowym)

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Rich Internet Application (np. Flash): Sumopaint.com

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Budowanie pośrednictwa graficznego w stylu okienkowym:

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Interfejsy oparte na WWW/HTML (jqueryui - demo):

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Webowe interfejsy mobilne (jquery mobile):

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Webowe interfejsy mobilne: Adobe PhoneGap[Build]: kompilator w chmurze - aplikacje natywne

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Windows 8 Metro: wszędzie kafelki ;)

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Windows Phone 7, 8: też wszędzie kafelki ;) LiveTiles

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Android/iOS Human Interface Guidelines, zmiana orientacji, różne rozmiary ekranu

Linux + Compiz Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D film: Ubuntu 3D Desktop

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Windows Vista/7

Microsoft Surface Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D film: Surface 2 (2011r.)

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Projektowanie wieloplatformowego GUI: FireMonkey (win32, win64, OS X, ios)

Wstążka (ribbon) Pomoc kontekstowa i Okienka dialogowe Strony internetowe, Aplikacje webowe Interakcja dotykowa Nowoczesne pośrednictwa graficzne 3D Przykłady: FireMonkey ListBoxMagic, Style

Ocena GUI Wnioski sposoby oceny pośrednictwa graficznego:

Ocena GUI Wnioski sposoby oceny pośrednictwa graficznego: ˆ Kwestionariusze z pytaniami o opinie na temat interfejsu

Ocena GUI Wnioski sposoby oceny pośrednictwa graficznego: ˆ Kwestionariusze z pytaniami o opinie na temat interfejsu ˆ Obserwowanie użytkowników przy pracy z systemem

Ocena GUI Wnioski sposoby oceny pośrednictwa graficznego: ˆ Kwestionariusze z pytaniami o opinie na temat interfejsu ˆ Obserwowanie użytkowników przy pracy z systemem ˆ Krótkie filmy/screencasty z typowym użyciem systemu

Ocena GUI Wnioski sposoby oceny pośrednictwa graficznego: ˆ Kwestionariusze z pytaniami o opinie na temat interfejsu ˆ Obserwowanie użytkowników przy pracy z systemem ˆ Krótkie filmy/screencasty z typowym użyciem systemu ˆ Umieszczanie w oprogramowaniu kodu służącego do gromadzenia informacji o najczęściej używanych udogodnieniach systemu i najczęściej występujących błędach

Ocena GUI Wnioski koncentracja na użytkowniku i jego doświadczeniu User Centered Design

Ocena GUI Wnioski koncentracja na użytkowniku i jego doświadczeniu User Centered Design łatwość użycia a konfigurowalność

Ocena GUI Wnioski koncentracja na użytkowniku i jego doświadczeniu User Centered Design łatwość użycia a konfigurowalność licencjonowanie GUI - trolle patentowe

Ocena GUI Wnioski koncentracja na użytkowniku i jego doświadczeniu User Centered Design łatwość użycia a konfigurowalność licencjonowanie GUI - trolle patentowe ˆ one click buy

Ocena GUI Wnioski koncentracja na użytkowniku i jego doświadczeniu User Centered Design łatwość użycia a konfigurowalność licencjonowanie GUI - trolle patentowe ˆ one click buy ˆ MS Ribbon

Ocena GUI Wnioski koncentracja na użytkowniku i jego doświadczeniu User Centered Design łatwość użycia a konfigurowalność licencjonowanie GUI - trolle patentowe ˆ one click buy ˆ MS Ribbon ˆ procesy Apple vs Samsung (odblokowywanie przez przesunięcie palcem po ekranie)

Ocena GUI Wnioski Dziękuję za uwagę Następny temat: analiza i projektowanie obiektowe