Die Anfänge der grafischen Benutzeroberfläche

Xerox Alto – Computer History Museum

Während meinen Nachforschungen bezüglich der grafischen Veränderungen im Web, gelange ich unweigerlich an den Ursprung der meisten heutigen GUIs. Obwohl das GUI grundsätzlich vom Webdesign zu unterscheiden ist, ist es für mich zum einen wichtig, die Ursprünge dessen zu erkunden, was uns heutzutage die Gestaltung im Web überhaupt ermöglicht. Zum anderen ist für mich der damalige Umgang mit gestalterischen Elementen spannend, welcher noch mehr von der Technologie bestimmt wurde als heute.

Die Entwicklung des Konzepts der GUIs wird üblicherweise dem Forschungszentrum Xerox Palo Alto Research Center (Xerox PARC) zugeschrieben. Das ist zwar grundsätzlich richtig, jedoch kann diese Entwicklung nicht gänzlich isoliert betrachtet werden – ihr gingen jahrzehntelange Forschung voraus.

Sketchpad und Spacewar! als Inspiration für Doug Engelbart

Frühe interaktive, grafische Anwendungen wie Ivan Sutherlands »Sketchpad« (1962) oder das von Steve Russell am MIT entwickelte Spiel »Spacewar!« (1962) waren Teil dieser Evolution. Vor allem Sketchpad soll Doug Engelbart in seiner Arbeit inspiriert haben,1 welcher erst 1968 das oN-Line System (NLS) demonstrierte. Das NLS unterstütze dabei schon viele Eigenschaften moderner Computer wie beispielsweise Bitmap-Grafiken, Videokonferenzen, Textverarbeitung oder die kollaborative Bearbeitung von Dokumenten in Echtzeit. Des weiteren erinnert die Benutzung der von ihm erfundenen Maus sowie die Verwendung von Fenstern an heutige Verhältnisse.2

Sketchpad Ivan Sutherland
Der Erfinder Ivan Edward Sutherland bedient sein Programm Sketchpad, welches 1962 innerhalb seiner Dissertation entstanden ist. Sketchpad gilt als erstes Programm mit grafischer Benutzeroberfläche. Mithilfe eines Lichtgriffels, einem Vorläufer der Maus als Eingabegerät, konnte direkt auf dem Bildschirm gezeichnet werden.II
In der Zusammenfassung in einer seiner Schriften heißt es: »Es wurde verwendet, um elektrische, mechanische, wissenschaftliche, mathematische und animierte Zeichnungen zu zeichnen«3.
Spacewar! von Steve Russell
Steve Russells Erfindung »Spacewar!« auf dem PDP-1, welches als eines der ersten grafischen Computerspiele gilt und 1962 fertiggestellt wurde. Auch hier wird der Lichtgriffel als Eingabegerät genutzt.III

Xerox Alto mit dem WIMP Interface

Ein interessanter Verlauf ist der, dass – durch die Reduzierung staatlicher Finanzierungen – viele von Engelbarts Team zum neu gegründeten Xerox PARC wechselten. Dort wurde 1973 mit dem Xerox Alto der erste wirkliche Computer mit einer grafischen Benutzeroberfläche fertiggestellt. Das grafische Konzept orientierte sich dabei an bekannten Mustern, weshalb der 2D-Bildschirm als Oberfläche eines Schreibtisches dargestellt wurde. Innerhalb von einzelnen Rahmen wurden die Programme angezeigt, welche wir heute als Fenster bzw. auch im deutschen als windows kennen. Aus der realen Welt wurden weitere Hilfsmittel wie ein Kalkulator oder die Uhr übernommen, welche frei platzierbar waren. Diese Metapher wird auch »Schreibtisch-Metapher« genannt.4 Bis heute werden Metaphern dieser Art genutzt – noch immer verwenden wir einen sehr abstrahierten Schreibtisch mit Ordnern oder einem Papierkorb. Beides war in dieser Version jedoch noch nicht vorhanden.

Das Alto Team verwendete für seine Gestaltung Windows, Icons, Menüs sowie Zeiger (Pointer). Diese Art wird als WIMP Interface bezeichnet und ist bis heute weitestgehend in Verwendung. Zudem bot Alto wiederverwendbare, grafische Bausteine wie Buttons, Chechboxen oder Tabs an, aus denen GUI-Anwendungen entwickelt werden konnten. Auch sie waren an Objekte der realen Welt angelehnt.5

Grafische Benutzeroberfläche des Xerox Alto
Das Dynabook, entwickelt von Alan Kay, gilt als konzeptioneller Vorläufer des Xerox Alto. Die Grafik zeigt die grafische Benutzeroberfläche des Xerox Alto, welche – dem Bildschirm entsprechend – vertikal statt horizontal ist. Die Grafik zeigt, dass das GUI bereits aus einzelnen, sich überlappenden Fenstern sowie Symbolen bestand. Alan Kay und sein Team entwickelten als Softwareumgebung die objekt-orientierte Programmiersprache SmallTalk. Um mit Dokumenten, Anwendungen und Co. interagieren zu können, konnten Symbole, Dialogfelder und Dropdown-Menüs angeklickt werden.IV

Xerox Star – Cut, Copy, Paste

Vom Xerox Alto gab es nur 2000 Exemplare, mit denen intern oder an Universitäts-Laboren gearbeitet wurde. Sie wurden nie kommerziell verkauft und 1981 kam die Folgeversion Xerox Star mit verbesserter Hard- und Software auf den Markt. Bei dieser Version wurde die Schreibtisch-Metapher weiter ausgereizt, so dass Dateien wie Papier aussahen und in Ordnern oder virtuellen Aktenschränken verstaut werden konnten.6 Auch weitere Funktionen, die wir heute verwenden, wurden mit dem Xerox Star eingeführt. Es sollte die Möglichkeit bestehen, Veränderungen unsichtbar zu machen, was mit Cut, Copy und Paste gelang. Die Idee dahinter war zudem, dass ausgedruckte Dokumente ein perfektes Abbild realer Versionen sein sollten. Das wurde »What-You-See-Is-What-You-Get« (WYSIWYG) genannt7 und ist bis heute ein weit verbreiteter Terminus.

Grafische Benutzeroberfläche des Xerox Star
Grafische Benutzeroberfläche des Xerox StarV

Im folgenden Verlauf möchte ich mich zwar weiterhin mit der Entwicklung grafischer Benutzeroberflächen beschäftigen und etwas detaillierter auf die Interfaces selbst eingehen. Insgesamt wird die Beobachtung aber eher oberflächlich bleiben, da mein Fokus sehr klar auf der Evolution im Web selbst liegt.

Quellen
  1. Vgl. Philbin, Carrie Ann, CrashCourse: »Graphical User Interfaces: Crash Course Computer Science #26«, Stand: 30.8.2017, URL: https://www.youtube.com/watch?v=XIGSJshYb90, TC: 00:01:58–00:02:36, abgerufen am 12.1.2018.
  2. Vgl. Ebd., TC: 00:02:36–00:02:53.
  3. Sutherland, Ivan Edward: »Sketchpad: A man-machine graphical communication system«, Stand: September 2003, URL: http://www.cl.cam.ac.uk/techreports/UCAM-CL-TR-574.html, abgerufen am 12.1.2018.
  4. Vgl. Philbin, Carrie Ann, CrashCourse: »Graphical User Interfaces: Crash Course Computer Science #26«, Stand: 30.8.2017, URL: https://www.youtube.com/watch?v=XIGSJshYb90, TC: 00:03:03–00:04:36, abgerufen am 12.1.2018.
  5. Vgl. Ebd.
  6. Vgl. Ebd., TC: 00:06:30–00:07:00.
  7. Vgl. Ebd., TC: 00:07:05–00:07:48.
Abbildungen
  1. Titelbild: Hicks, Michael: »Xerox PARC Alto with mouse and chorded keyset.«, Stand: 3.11.2013, via Wikimedia Commons, abgerufen am 13.1.2018, Lizenz: CC BY 2.0.
  2. Von Kerry Rodden gescanntes Originalfoto von Ivan Sutherland: »Sketchpad Dissertation: Ivan Sutherland operating the Sketchpad system.«, Stand: 1.1.1963, via Wikimedia Commons, abgerufen am 13.1.2018, Lizenz: CC BY-SA 3.0.
  3. Ito, Joi: »Spacewar! auf einer PDP-1 des Computer History Museums.«, Stand: 12.5.2007, via Wikimedia Commons, abgerufen am 13.1.2018, Lizenz: CC BY 2.0.
  4. parc – A Xerox Company: »Smalltalk GUI«, URL: https://www.parc.com/newsroom/media-library.html, abgerufen am 13.1.2018.
  5. Baecker, Ronald M.; Buxton, William; Greenberg, Saul; Grudin, Jonathan: »Reading in Human-computer Interaction: Toward the Year 2000«, Burlington (MA) 1995, S. 57.