interactiune om-calculator (retrospective & perspective)
TRANSCRIPT
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
11
InteracInteracţţiune omiune om--calculatorcalculator Retrospective & perspectiveRetrospective & perspective
Dr. Sabin-Corneliu Buraga Facultatea de Informatică
Universitatea “A.I.Cuza”
Iaşi, România httphttp://://www.infoiasi.rowww.infoiasi.ro/~/~busacobusaco//
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
22
“The difference between art and science is thatscience is what we understand well enough to explain to a computer. Art is everything else.”
Donald Knuth
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
33
CuprinsCuprins
•
Scurtă
anatomie a interfeţelor-utilizator
•
Maniere
de proiectare
•
Instrumente pentru implementare
•
Spre
viitor
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
44
Anatomia unei interfeAnatomia unei interfeţţee•
Puterea computaţională este exploatată via interfaţa cu utilizatorul– Program software ≡
interfaţă + aplicaţie
– Interfaţa-utilizator ≡
acea parte a unui program care mijloceşte interacţiunea dintre utilizator şi maşină
•
ieşirea din partea calculatorului•
intrarea de la utilizator
– Realizarea managementului resurselor aplicaţiei (semantica)
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
55
AnatomiaAnatomia uneiunei
interfeinterfeţţee
•
Modelul WIMP
(D. Engelbart
–
Stanford)– Fereastra –
window
– Pictograma –
icon
– Meniul –
menu
– Dispozitivul de manipulare –
pointing
device
•
Utilizat în majoritatea interfeţelor: Xerox PARC, Apple
Macintosh, Windows,…
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
66
AnatomiaAnatomia uneiunei
interfeinterfeţţee
•
Sisteme de ferestre– Implementează efectiv modelul– Independente de sistemul de operare (XWindow)– Incluse în nucleul sistemului (Windows)– Fereastra
≡ zonă (rectangulară) de pe ecran
•
Aplicaţia rulează într-o fereastră principală•
Interacţiune: modală
&
nemodală
– Programare orientată-eveniment (mesaj)– Pot utiliza
manageri de ferestre
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
77
AnatomiaAnatomia uneiunei
interfeinterfeţţee
•
Sisteme de ferestre– Implementarea se bazează pe componente
(controale, widget-uri) –
cod reutilizabil•
Biblioteci:
–Motif
(OSF), OpenLook
(AT&T) –
XWindow–Win32 API
–
Microsoft Windows
•
Fişiere de resurse– Se oferă
deseori medii de dezvoltare a interfeţelor
(e.g., Delphi, Elipse,
Glade, IDLE,
KDevelop, Qt
Designer,
Visual Studio,
XCode,…)
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
88
ManiereManiere de de proiectareproiectare
(Dan (Dan SafferSaffer))AborAbor--
daredare PrezentarePrezentare UtilizaUtiliza-- toriitorii ProiectantulProiectantul
User- Centered Design
Focalizare asupra necesităţilor & scopurilor utilizatorului
Ghidează procesul de design
“Translatează” necesităţile & scopu-
rile utilizatorului
Activity- Centered Design
Focalizare pe sarcini & activităţi ce trebuie realizate
Realizează activităţile permise
Creează instrumente pentru realizarea de acţiuni
Systems Design
Focalizare asupra componentelor sistemului
Stabilesc scopurile sistemului
Asigură că toate compon. de sistem să existe & să fie corecte
Genius Design
Se bazează pe abilităţile & experienţa proiectanţilor de a crea produse de succes
Sunt surse de validare
Reprezintă sursa de inspiraţie
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
99
InstrumenteInstrumente de de implementareimplementare
•
Tipuri:–Manageri de ferestre &
toolkit-uri
–Unelte grafice interactive (interface builders)
–Limbaje orientate-eveniment (event languages)
–Limbaje de tip script–Sisteme de componente
(component systems)–Instrumente speciale
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
1010
InstrumenteInstrumente de de implementareimplementare
•
Manageri de ferestre &
toolkit-uri–Oferă un model de programare de bază
•
Modelul intrărilor (input model)•
Modelul de vizualizare (imaging model)
–Modelul se bazează pe implementarea internă a sistemului (vezi Win32
API)
–Toolkit-urile
ascund detaliile de nivel scăzut•
Andrew,
Garnet, Java Swing
–Toolkit-uri
virtuale
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
1111
InstrumenteInstrumente de de implementareimplementare
•
Unelte grafice interactive (interface builders)– Precursori (anii
’80)
UIMS
–
User-Interface Management System– Implementarea interfeţei nu trebuie realizată
scriind cod convenţional, ci interacţionând cu aplicaţia (în momentul proiectării)
– Module majore:•
Design-time component (proiectare, testare)
•
Run-time component (prototipizare, exploatare)•
After-run component (evaluare)
– RAD
(Rapid Application Development): Flex Designer, Delphi, Visual Studio, Qt
Designer,…
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
1212
InstrumenteInstrumente de de implementareimplementare
•
Limbaje orientate-eveniment (event lang.)– HyperTalk
(Apple
HyperCard)
– Lingo
(Macromedia
Authorware) – Visual Basic
(Visual Studio sau Office)
•
Limbaje de tip script (interpretate)– Destinate să prelucreze, să automatizeze &
să integreze facilităţile unui sistem – Duc la dezvoltarea rapidă a prototipului interfeţei – Exemple: Tcl/Tk, JavaScript, ActionScript
etc.
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
1313
InstrumenteInstrumente de de implementareimplementare
•
Sisteme de componente (component systems)– Utilizarea componentelor prefabricate, separate,
scrise in limbaje diferite ⇒ modularizarea, flexibilitatea &
consistenţa interfeţei
– Biblioteci de componente:•
GTK –
GNOME/GIMP
ToolKit
•
JavaBeans
(Java 2 SDK)•
MFC –
Microsoft Foundation
Classes
•
VCL –
Visual Component Library
(Delphi)•
WinForms
(.NET)
•
…
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
1414
InstrumenteInstrumente de de implementareimplementare
•
Specificarea structurii, componentelor & modului de redare a interfeţei-utilizator se poate realiza via limbaje declarative, bazate pe XML–
XHTML 2.0
+ XForms, XFrames,…
•
viitoare standarde ale W3C –
www.w3.org–
XUL
(Extensible
User-Interface
Language) –
Mozilla
–
SVG
(Scalable
Vector Graphics) –
standard W3C–
X3D (Extensible
Three
Dimensions) –
standard Web3D
–
XAML (Extensible
Application
Markup
Language) et al.•
Windows Presentation
Foundation
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
1515
ViitorViitor
•
Situaţia actuală–Usability is a quality of computing– Interfaţa cu utilizatorul costă aproximativ
50%
din efortul de dezvoltare a unei aplicaţii– Lipsa unei abordări complet sistematice
în proiectarea interfeţelor (efecte: creşterea complexităţii codului, întârzierea termenelor de dezvoltare, scăderea satisfacţiei clienţilor, creşterea complexităţii actualizării software-ului)
– Ignorarea, de cele
mai
multe
ori, a
problemelor de interacţiune om-maşină
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
1616
ViitorViitor
•
Nevoia de comunicare–Noi mijloace de interacţiune & comunicare
•
între maşini•
între calculatoare & utilizatori
–Direcţii:•
comunicaţii fără fir
•
interacţiuni în medii (virtuale) distribuite, folosind diverse paradigme/tehnologii
–
P2P, sisteme de agenţi software, SOA,…•
Web-ul
social
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
1717
ViitorViitor•
Nevoia de comunicare– Capabilităţi I/O variate
•
Interfeţe independente de dispozitive•
Specificarea profilului dispozitivului
•
Standardizarea proiectării şi implementării de interfeţe independente de periferic
•
Instrumente software pentru dezvoltarea de prototipuri de dispozitive
•
Coordonarea dispozitivelor I/O distribuite şi/sau mobile şi colaborarea (inteligentă)
dintre utilizatori
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
1818
ViitorViitor
•
Nevoia de comunicare–Capabilităţi I/O variate
•
Cerinţe majore: –sincronizarea transmisiei informaţiilor–partajarea datelor–securitate, anonimitate, privacy–integrarea în hardware
(embedded computing)–asigurarea
multi-tasking-ului
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
1919
ViitorViitor
•
Nevoia de comunicare–Recunoaşterea utilizatorului
•
recunoaşterea vocii, gesturilor, parametrilor biologici, stării emoţionale
•
caracterul multi-modal al interfeţei•
adaptarea dinamică la preferinţele utilizatorilor (e.g., schimbarea input-ului)
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
2020
ViitorViitor•
Nevoia de comunicare– Recunoaşterea utilizatorului
•
probleme: incertitudinea, monitorizarea inteligentă a utilizatorilor, procesarea continuă a datelor receptate simultan via mai multe mijloace de intrare, aspectele
etice
etc.
•
dezvoltarea de instrumente care să cunoască scopul final al aplicaţiei care va utiliza interfaţa proiectată (recurgerea
la interface
design patterns, arhetipuri
de interfaţă,…)
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
2121
ViitorViitor
•
Nevoia de comunicare– Caracterul multimedia & tridimensional
•
noi tipuri de interacţiune non-WIMP (imersiunea în medii virtuale conduce
la adoptarea altor idiomuri)•
noi mijloace de operare în timp-real
•
instrumente asigurând configurabilitatea interactivă şi/sau automată a interfeţei
•
minizarea
atenţiei şi oferirea
unei ergonomii maxime
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
2222
ViitorViitor
Întrebarea de bază încă persistă:
De ce proiectarea unei interfeţe“perfecte”
este atât de greu de realizat?
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
2323
RezumatRezumat
•
Scurtă
anatomie a interfeţelor-utilizator
•
Maniere
de proiectare
•
Instrumente pentru implementare
•
Spre
viitor
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
2424
ÎÎntrebărintrebări??
InteracInteracţţiune omiune om--calculatorcalculator
Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//
2525
MultMult successucces!!