http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
Multimedia-Systems:
User Interfaces
Prof. Dr.-Ing. Ralf Steinmetz
Dr. L.Wolf, Dr. S.Fischer
TU Darmstadt - Darmstadt University of Technology,
Dept. of Electrical Engineering and Information Technology, Dept. of Computer Science
KOM - Industrial Process and System Communications, Tel.+49 6151 166151,
Merckstr. 25, D-64283 Darmstadt, Germany, Ralf.Steinmetz@KOM.tu-darmstadt.de Fax. +49 6151 166152
GMD - German National Research Center for Information Technology
IPSI - Integrated Publication and Information Systems Institute, Tel.+49 6151 869869
Dolivostr. 15, D-64293 Darmstadt, Germany, Ralf.Steinmetz@darmstadt.gmd.de Fax. +49 6151 869870
15-ui.fm 1 22.October.99
Usage
Services
Systems
http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
Scope
Applications
Learning & Teaching
Content
Processing
Documents
Design
Security
Opt. Memories
Group
SynchroCommuninization
cations
...
Databases
Media-Server
User Interfaces
Programming
Operating Systems
Communications
Quality of Service
Networks
Basics
Compression
15-ui.fm 2 22.October.99
Computer
Architectures
Image &
Graphics
Animation
Video
Audio
http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
Contents
1. Motivation
2. Aspects
3. Principles and Mechanisms
Direct Manipulation
Guidelines
Graphical and Multimedia User Interfaces
4. Innovative Forms of Interaction
5. Summary and Outlook
15-ui.fm 3 22.October.99
http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
1. Motivation
Human-Computer-Interaction:
• not only
How ?
• but
How good ?
History:
• Input / Output
• from computer-oriented view (Cables, Switches, Punched Cards, Listings)
• to human-oriented view (ASCII text, Graphical Interfaces, Voice and
Gesture Commands)
This is plain text.
Challenges:
• set of functionality vs. easy usability
• professional vs. ad-hoc user
• technical feasability vs. futuristic visions
• ...
15-ui.fm 4 22.October.99
http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
User Interface - a historic example
• though no interactivity
• shows compactness and plausibility of information
15-ui.fm 5 22.October.99
http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
2. Aspects
Overview of criteria:
Background
Implementation
Aesthetics
15-ui.fm 6 22.October.99
Productivity
User
Friendliness
Usability
http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
3. Principles and Mechanisms
Direct Manipulation
Requirements:
• permanent visibility of manipulatable objects
• fast, incremental and reversible interactions
• immediate visible system reaction on user interaction
• user interactions as replacement for complex commands / sequences
Characteristics:
• usually leeds to good user acceptance
• easy to learn even by novices
• powerful and expandable for expert users
• easy to memorize
• limited need for error messages
• deterministic systems behaviour and planable operations
• tolerant and robust against errourness interactions
• gives feeling of control to the user
15-ui.fm 7 22.October.99
http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
Direct Manipulation (cont.)
Classification:
• Semantical directness
• Articulatory directness
• Operational directness
• Formal directness
Benefits:
• Easy to learn
• Consistency
• total vs. partial
Problems:
• Efficient implementation of standard operations
• Unambiguousness
• Consistency
15-ui.fm 8 22.October.99
http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
Guidelines
Just a selection of (there are often large “Style Guides”)
• Grouping of logically related functions
• Graphical symbols or sequences instead of text
• intuitive
• associative, recognizable
• Definite and up-to date information about system state
• adaptive cursors
• (in)active buttons
• ...
• Immediate reaction
• progress indicators
15-ui.fm 9 22.October.99
http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
Graphical and Multimedia User Interfaces
Camera
Loudspeakers
Microphone
This is plain text.
Mouse
Keyboard
Text Graphics Stills Video Audio
15-ui.fm 10 22.October.99
http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
Graphical and Multimedia User Interfaces (cont.)
Components (Widgets):
• Buttons
• with text
• iconic
• Menus
• simple
• pulldown
• cascaded
• Clipboard
• Cut
• Copy
• Paste
15-ui.fm 11 22.October.99
http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
15-ui.fm 12 22.October.99
Graphical and Multimedia User Interfaces (cont.)
• Navigation
• horizontal / vertical Scrollbars
• Dialogs, Windows
http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
15-ui.fm 13 22.October.99
Graphical and Multimedia User Interfaces (cont.)
Libraries and Toolkits:
• Windows - MFC
• Unix - XLib and Widget Sets
• Tcl/TK, Java AWT, Swing
Intention:
• Coding Efficiency
• Portability
• Native Look & Feel
http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
15-ui.fm 14 22.October.99
4. Innovative Forms of Interaction
Addressing all Senses
Buzzwords:
• Virtual Reality
• Computer-Augmented Reality
• Wearables (MIT)
Virtual stimuli to human senses:
• Environmental displays: the sense of vision
• holography, 3D glasses
• Auditory displays: the sense of hearing
• synthetic sounds, association of sounds with virtual objects, spatial sound
• Tactile displays: the sense of touch and movement
• realistic touch sensation, electrically induced sensation
• neglected area of research
• movement: by treadmills and similar machines (very early stage)
• The sense of smell and the other senses:
• difficult to stimulate, real-time odor synthesizer?
• hard to reach by computer displays (e .g. sense of balance and momentum)
http://www.kom.e-technik.tu-darmstadt.de
http://www.ipsi.gmd.de
© Ralf Steinmetz
5. Summary and Outlook
User Interfaces - What are they all about?
Creation of idea
Representation
using n media
Voice
Image
Text
Data
Decomposition into
media spectrum
Voice
Image
Text
Reproduction
of the idea
Understanding of idea
Communication means:
• Expression - Presentation - Perception
15-ui.fm 15 22.October.99
Data