5. Historische Entwicklung von Benutzungsschnittstellen
zum Buch
Interaktive Systeme
Grundlagen, Graphical User Interfaces,
Informationsvisualisierung
Band 1
Bernhard Preim
Raimund Dachselt
Springer Verlag, 2010
Historische Entwicklung von Benutzungsschnittstellen
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5-2
Historische Entwicklung von Benutzungsschnittstellen
Gliederung
• Computer zur Bewältigung der Informationsflut (V. Bush)
• Kooperation zwischen Mensch und Computer (Licklider)
• Konzepte und Prototypen der ersten interaktiven Systeme
• Kommerzielle Systeme
 Die Entwicklung des XEROX Star
 Die Entwicklung des Apple Macintosh
 Microsoft Windows und X-Windows
• Die Rolle von Smalltalk
• Die Entwicklung des WWW
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5-3
Computer zur Bewältigung der Informationsflut
“As we may think” (Bush [1945], Nachdruck 1996)
Grundannahmen:
•
•
•
•
•
•
Wachsende Flut an Informationen
Rechnergestützte Verarbeitung
Assoziatives Denken des Menschen
Entwurf von MEMEX
V. Bush (1890-1974)
Inhaltsbasierte Suche nach Information
Aufbereitung von Informationen
(Digitalisierung, Schlüsselwörter, Querverweise, Verzeichnisse)
• Flexible Eingabemöglichkeiten (Kombination von Suchbegriffen,
unvollständige Suchbegriffe)
• Integration von Lesezeichen, Notizen, Anmerkungen und
Unterstreichungen, Verbindungen erzeugen  Personalisierte Sicht auf
die Informationen
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5-4
Computer zur Bewältigung der Informationsflut
Anzeige- und Navigationsmöglichkeiten:
• Durchlesen, Durchblättern, Verzeichnisse und Indizes
• Seitenweise und abschnittsweise “springen”
Position:
• MEMEX steht auf einem Schreibtisch, aber entfernter Zugang
muss möglich sein.
Konsequenzen für die MCI:
• Orientierung an bewährten Techniken (z.B. Organisation von
Büchern) und kreative Überlegungen zu neuen
Interaktionsmöglichkeiten
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5-5
Kooperative Systeme zwischen Mensch und Computer
Stand 1960: Stapelverarbeitung von gründlich vorbereiteten
Programmen, Erzeugen von großen Datenmengen als Ausgabe
Benutzer:
Ausschließlich Programmierer
Licklider (1960) “Man-Computer Symbiosis”
Interaktive Systeme erhöhen die Produktivität beträchtlich
Interaktive Systeme erschließen neue Anwendungsfelder
(Gestaltungsaufgaben, “Ill-defined problems”)
Ziel:
Computer als kooperativer Partner, interaktive Arbeit,
Trial-and-Error-Prozesse
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5-6
Kooperative Systeme zwischen Mensch und Computer
Aufgaben:
Kurzfristige technologische Aufgaben
• Time-Sharing-Systeme zur Verteilung der Rechenzeit,
• große Speicher, schnelle Prozessoren, hochauflösende Anzeige
Langfristige Aufgaben bzgl. der Interaktion
• Verstehen natürlicher Sprache
• Erkennung von Zeichnungen und Gesten
Konsequenzen für die MCI:
• Orientierung an der Kommunikation zwischen Menschen,
• Erkennungsbasierte Benutzungsschnittstellen
• Dialogführung, Terminologie von Anwendern benutzen
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5-7
Konzepte und Prototypen der ersten interaktiven Systeme
Sketch-Pad und Sketch-Pad II
(Sutherland [1963] und Johnson [1963])
Interaktive Graphik, Light-Pen, Direkte Manipulation,
Constraints
Anwendungsgebiet CAD entstand
Quelle: http://www.cadazz.com/cad-software-Sketchpad.htm
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
Ivan Sutherland
5-8
Konzepte und Prototypen der ersten interaktiven Systeme
Nelson [1965]
• Entwicklung von Hypertext
• Computer nicht nur für Konzerne, sondern für Menschen
Technologische Fortschritte
• Entwicklung des fensterbasierten NLS-Systems mit einer Maus,
einem graphischen Bildschirm an der University of Stanford (D.
Engelbart, 1965-68)
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5-9
Konzepte und Prototypen der ersten interaktiven Systeme
Ziel der Interaktivität (Engelbart [1965], Nelson [1970]):
• Unterstützung von Menschen bei der Lösung von Problemen
• Analyse des Problemlöseverhaltens
•
•
 Hilfsmittel (Ordner, Hefte, Schreibgeräte)
 Sprache zur Kommunikation, zur Definition und Einordnung
 Methoden, Strategien und Prozeduren, um Aktivitäten
zielgerichtet durchzuführen
Ausbildung zielt darauf, Hilfsmittel, Sprache und Methoden
anzuwenden
Präzision des Ziels: Unterstützung des ausgebildeten
Menschen durch Berücksichtigung der obigen Aspekte, durch
Integration von Aufgaben
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 10
Pioniere der Entwicklung interaktiver Systeme
Douglas Engelbart
(geb. 1925)
Ted Nelson
(geb. 1937)
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
John Licklider
(1915-1990)
5 - 11
Die Entwicklung des XEROX Star
1979-1981 am XEROX Parc
Erste kommerzielle graphische Benutzungsoberfläche
Zielstellung:
• Erstellung und Verwaltung von Dokumenten (Texte, Tabellen,
Diagramme), Terminen, Nachrichten
Zielgruppe:
• Manager
Technologische Aspekte:
• Graphischer Bildschirm (Schwarz-Weiß, 612x756 Pixel),
• Fenstersystem und Mausbenutzung
Interaktionsstile:
• WYSIWYG-Textverarbeitung, Direkte Manipulation,
Desktop-Metapher, Eigenschaftsformulare
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 12
Die Entwicklung des XEROX Star
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 13
Die Entwicklung des XEROX Star
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 14
Die Entwicklung des XEROX Star
Aspekte der Realisierung:
• Einbezug von Graphikdesignern in das ..Entwicklerteam
• Iterative Entwicklung
• Prototyperstellung (Skizzen, Drehbücher)
• Aufwändige Tests (Icons, Beschriftungen, Systemnachrichten,
Dialoggestaltung, Tastatur)
Konsequenzen aus Tests:
• Weiterentwicklung der Software, der Hilfesysteme ..
und der Handbücher
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 15
Die Entwicklung des XEROX Star
Ursachen des geringen kommerziellen Erfolgs:
• Zu späte Markteinführung, zu hoher Preis, teilweise einseitige
Konzentration auf neue Interaktionstechniken
• Zu starke Verkettung der Anwendungen (monolithisch)
• Kaum Drittanbieter, weil Entwicklungswerkzeuge ..
nicht freigegeben wurden und Richtlinien fehlten
(mangelnde Offenheit)
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 16
Die Entwicklung des Apple Macintosh
1982-1984 Apple Lisa und Apple Macintosh
erste kommerziell erfolgreiche graphische Benutzeroberfläche
Ziele und Zielgruppe:
vergleichbar zum IBM PC und zum XEROX Star
Neue Interaktionstechniken:
• Direkte Manipulation mit Drag-and-Drop
• Entwicklung der Zwischenablage zur Kommunikation zwischen
den Anwendungen
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 17
Die Entwicklung des Apple Macintosh
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 18
Die Entwicklung des Apple Macintosh
Aspekte der Realisierung:
• Strikte Trennung zwischen Anwendung und Bedienoberfläche
• Nutzung von Ressourcendateien
• Entwicklung und Weiterentwicklung von Styleguides
• Quantitative Ziele bei der Evaluierung
• Konkrete und harte Termin- und Kostenvorgaben
• Konsequente Unterstützung von Drittanbietern durch
Werkzeuge und Richtlinien, so dass konsistentes
Look-and-Feel entsteht
Konsequenz: Überragender kommerzieller Erfolg;
Benutzerfreundlichkeit als das Verkaufsargument
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 19
Die Entwicklung des Apple Macintosh
Markantes, innovatives
Design. Semi-transparente
Komponenten:
• der iMac 1999
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 20
Microsoft Windows
Microsoft, Windows 3.11 (1992) und Windows XP (User
Experience) (2005)
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 21
Die Rolle von Smalltalk
Stark visuelle Programmierschnittstelle mit reichhaltiger
Interaktion
Zugeschnitten auf die schnelle Erstellung von interaktiven
Systemen → Vorgefertigte Klassen für Dialogelemente
• Integrierte Werkzeuge zur
Erstellung von Menus und
Icons
• Smalltalk und direktmanipulative Systeme sind
objekt-orientiert.
• Model View ControllerKonzept als methodische Basis
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 22
Die Entwicklung des WWW
Beobachtung (Mitte/Ende der 80er Jahre):
• Möglichkeiten des Internets kaum genutzt; lediglich e-Mail und
Dateiaustausch
Ziel:
• Dokumente wie Veröffentlichungen, Techn. Berichte leicht zugänglich
machen, Informationsaustausch
Idee:
• Nutzung von Hypertextfunktionalität zunächst intern (eine Art IntraNet)
innerhalb der Großforschungseinrichtung CERN
Vorgehen:
• Überzeugung von Kollegen/Vorgesetzten, Überarbeiten der initialen
Protokolle, strikte Beachtung dessen, was gebraucht wird
• Beantragung von Forschungsgeldern
Quelle: Tim Berners-Lee: „Weaving the Web- The Original Design and Ultimate Destiny
of the World Wide Web“, Harper Collins, 2000
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 23
Die Entwicklung des WWW
Tim Berners-Lee et al. [1992]
Realisierung der Visionen von V. Bush,
D. Engelbart und T. Nelson
Weltweit vernetztes Hypertextsystem =>
Informationsflut
Internationaler Charakter, heterogene
Benutzer, geringe Bandbreite
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 24
Web 2.0
• Neue Technologien für eine stärkere interaktive Nutzung des
•
WWW
Anteil der Hochgeschwindigkeitszugänge (DSL) hat sich massiv
erhöht
Neue Nutzungsformen durch:
Wikis, Blogs, Newsletter (RSS-Technologie)
Erfolgreiche Beispiele, wie eBay und Amazon, setzen auf
Vernetzung großer Informationsbestände und auf Beteiligung
der Benutzer (eigene Profile, Empfehlungen, …)
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 25
Ubiquituous Computing
Computer „verschwinden“ und sind
zugleich „überall.“ Sie werden mit
der Kleidung getragen, in
Kitteltaschen aufbewahrt und sind
zugleich wandgroß.
Mark Weiser, XEROX, 1991
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 26
Bedeutende technische Entwicklungen
Leistungsfähigkeit mobiler Geräte (UMTS-Standard)
Weitere Miniaturisierung von leistungsfähiger Elektronik → kleine
leichte Geräte mit kleinen Displays und sehr umfangreicher
Funktionalität → neue und komplexe Herausforderungen für
die User Interface Gestaltung.
Enorme Bandbreite an Eingabegeräten für unterschiedlichste
Einsatzszenarien (Einsatz in Fahrzeugen, Leitständen, mobiler
Einsatz, vandalismussicherer Einsatz im öffentlichen Raum).
Durch die gewachsenen Möglichkeiten wächst der Bedarf nach
einer fundierten Entscheidung.
Weiterentwicklung von Ausgabegeräten. Hochauflösende
Monitore, autostereoskopische Monitore, große
Projektionsflächen → neue Anwendungsmöglichkeiten.
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 27
Zusammenfassung
MEMEX 1945
NLS
XEROX Star
Macintosh
Ubiq. Comp.
WWW
UMTS
Web 2.0 2001
V. Bush
1968
D. Engelbart (erstes Fenstersystem)
1981
W. Verplank et al.
1984
J. Raskin et al.
1991
M. Weiser
1992
T. Berners-Lee
2000
(On-line communities, YouTube, …)
Technologisch wichtig:
Hochauflösende Farbbildschirme, Zeigegeräte
Interaktionskonzepte:
Direkte Manipulation, WYSIWYG, Desktop-Metapher
Softwaretechn. Konzepte: Guidelines, Ressourcen-Dateien, Trennung von
Applikation und Benutzungsschnittstelle
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 28
Literatur/Links
Literatur:
• Mark Weiser. The Computer for the 21st century, Scientific American,
1991, 94-104
• Tim Berners-Lee, Robert Cailliau, Jean-François Groff. The World-Wide
Web. Computer Networks and ISDN Systems 25, Band (4-5): 454-459, 1992
• Tim Berners-Lee. Weaving the Web- The Original Design and Ultimate
Destiny of the World Wide Web, Harper Collins, 2000
• C. Wurster. Computer – Eine illustrierte Geschichte, Taschen, Köln 2002
Links:
• Internet Pioneers
• History of Computing: Memex
• Original publication „As we may think“
© Bernhard Preim, Raimund Dachselt  Springer Verlag 2010
5 - 29
5. Historische Entwicklung von Benutzungsschnittstellen
zum Buch
Interaktive Systeme
Grundlagen, Graphical User Interfaces,
Informationsvisualisierung
Band 1
Bernhard Preim
Raimund Dachselt
Springer Verlag, 2010

Powerpoint - Interaktive Systeme