Design im Prozess

Bezüglich meiner Recherche über die visuelle Evolution im Web, möchte ich einige Punkte festhalten, welche sich für mich als wichtige Eckpfeiler herauskristallisieren.

Bezüglich meiner Recherche über die visuelle Evolution im Web, möchte ich einige Punkte festhalten, welche sich für mich als wichtige Eckpfeiler herauskristallisieren.

Das Heranwachsen zum eigenen Medium

Im Gesamtüberblick ist eine Erkenntnis für mich besonders essenziell. Nämlich die, dass sich das Layout im Web aus einer zunächst technisch bedingten Fluidität ins Statische wandelt, um anschließend wieder dynamischer zu werden. Zunächst spricht man von der No-Layout-Ära, welche sich etwas bis 1996 hält. Zuvor gab es einfach keine Möglichkeiten und Ansätze, Layouts zu erstellen. Mit der anfänglichen Aufteilung durch Tabellen und Frames, konnten endlich mehrere Spalten angelegt werden, was letztendlich jedoch zur völligen Starrheit des Designs geführt hat. Diese Gestaltung, welche sich stark am Printdesign anlehnt und ein gescheiterter Versuch ist, die komplette Kontrolle über das Medium zu erhalten, wird durch die Einführung des iPhones im Jahr 2007 überflüssig. Nach und nach kommen mehr Endgeräte mit noch mehr Bildschirmgrößen auf den Markt, was bedeutet, dass ein neuer Weg gefunden werden muss, für ein flexibles Medium wie es das Web ist, zu gestalten. Ethan Marcotte führt 2010 den Begriff Responsive Design ein, welches in eine neue Fluidität des Webs mündet. Letztendlich ist es wichtig, das World Wide Web nicht als festen Rahmen zu verstehen, sondern als ein wandelbares Medium, welches sich an die Endgeräte unterschiedlichster Art anpassen sollte und dessen Kontrolle nicht ausschließlich in der Hand des Designers liegt.

Entwicklung einer eigenen Formsprache

Ein entscheidender Punkt ist für mich zudem die Entwicklung der Materialität im Web. In Bezug auf das GUI bei Computern, habe ich bereits von Metaphern gesprochen, die dafür verwendet werden, Technik verständlicher zu machen. Auch in Bezug auf UI-Elemente sehe ich diese Vorgehensweise zu Beginn des World Wide Webs. Zwar war die Gestaltung häufig in den technischen Möglichkeiten begründet, aber an vielen Stellen sieht man die Übertragung analoger Gegebenheiten ins Digitale. Ein Button war in einem Beispiel tatsächlich so entworfen, dass es einem roten Button aus dem Realen ähnelt. Weiter wurde beispielsweise bei der Einführung des iPhones der Stil des Skeuomorphismus verwendet. Auch hier finden sich Metahpern wieder, welche z. B. e-Books in einem Regal angeordnet zeigen. Funktional wäre diese Darstellung zwar nicht wichtig, dem Nutzer hilft das aber ungemein, um einen Bezug zum Realen herstellen zu können und das Neue zu begreifen. Skeuomorphismus unterscheidet sich dabei vom Realisums, bei dem aus ausschließlich visuellen Gründen, reale Materialitäten verwendet werden.

Später verwandelt sich dieser Stil ins Flat-Design, welcher wiederum durch das Material Design von Google abgelöst wird. Flat-Design stellt prinzipiell den Gegenentwurf vom Skeuomorphismus dar. Während zuvor versucht wurde, alles so realistisch wie möglich darzustellen, fällt beim Flat-Design jeder Bezug zum Realen weg. Jegliche Höhen und Tiefen gehen verloren, Schatten oder optische Schimmereffekte fallen gänzlich weg. Material Design hebt dagegen die Wichtigkeit hervor, auch reale Gegebenheiten mit in die Gestaltung einzubeziehen. Hier ist ein Button tatsächlich erhaben, Input-Felder dreidimensional eingelassen und Schatten sollen bei der Darstellung des Objekts helfen. Gleichermaßen geben Schattierungen einen Hinweis auf die Dimensionen.

Diese Entwicklung zeigt mir, dass das Medium allmählich eine eigene Formsprache für sich beansprucht. Nach vorheriger Imitation des Realen, welche durch das Flat-Design ins extreme Gegenteil umspringt, könnte durch das Material Design eine harmonische Mischung beider Welten entstehen.

Veränderte/Verschwundene GUI/Elemente

Eine dritte und letzte Feststellung, welche mir innerhalb des visuellen Parts wichtig ist, ist die Veränderung von grafischen Benutzeroberflächen sowie das gänzliche Verschwinden von Elemenenten durch neue Formen von Interfaces und kulturelle Lernprozesse.
Endgeräte wie das Smartphone oder Tablet brachten bereits neue gestalterische Herausforderungen mit sich. In Zukunft wird sich das Erscheinungsbild durch weitere Interfaces, welche es bereits gibt, wandeln. Hier denke ich an Voice Interfaces, Conversational Interfaces oder neue Technologien wie Augmented oder Virtual Reality. Des Weiteren steht der Mensch längst nicht mehr vor einem gänzlich neuen Medium, was bedeutet, dass UI-Elemente gänzlich verschwinden können. An vielen Stellen ist es dem Nutzer zwischenzeitlich bewusst, dass man eine Galerie anklicken oder die einzelnen Fotos am Handy durch Wischen durchblättern kann. Dazu braucht es keinen separaten Hinweis in z. B. Text- oder Icon-Form.

Beide Fälle werfen bei mir die Frage auf, inwiefern sich grafische Benutzeroberflächen verändern und auflösen können. Welche Information ist tatsächlich wichtig und was kennt der Mensch bereits? Welche Technologien können zum Einsatz kommen, um die Bedienung zu erleichtern und wie sähe eine Nutzeroberfläche im Extremfall bei fortgeschrittener Technologie aus? Wie weit muss die Kontrolle des Designers über die Gestaltung tatsächlich reichen?

Randlose Gestaltung

Frank Chimero teilt mit seinem Beitrag »The Web’s Grain« Überlegungen, wie man aus einer anderen Perspektive für das Web gestalten kann. Für besonders interessant und zugleich naheliegend halte ich seine Idee, randlos zu gestalten.

Frank Chimero teilt mit seinem Beitrag »The Web’s Grain« Überlegungen, wie man aus einer anderen Perspektive für das Web gestalten kann. Für besonders interessant und zugleich naheliegend halte ich seine Idee, randlos zu gestalten. Er vertritt dabei die Idee, zunächst Elemente ohne bekannte Größe der »Leinwand« zu arrangieren und sie erst dann in eine Box zu packen.1 Das steht dem häufigen Ansatz gegenüber, in festen Bildschirmgrößen zu denken – sei es nur klein, mittel, groß –, um diesen Raum auszufüllen.
Er ist zudem der Meinung, dass wir unsere Designs mit dem Hintergedanken entwickeln, wie sie am besten in der responsiven Ansicht zusammenbrechen. Vielmehr sollten wir uns darauf konzentrieren, wie sich die Elemente aufbauen.2

Seine Ansichten machen meiner Meinung nach durchaus Sinn, da das Web kein begrenzter Raum ist, wie wir es beispielsweise auf dem Printbereich kennen. Meinem Verständnis nach, geht es ihm jedoch nicht darum, den angezeigten Bereich ins unendliche auszuweiten, so dass man in alle Richtungen scrollen kann, sondern eher darum, dass man vorgefertigte Größen nicht als Grundlage der Gestaltung nehmen soll. Hier denke ich auch an Raster, welche viel zu häufig viel zu schnell zum Einsatz kommen. So hat sich eine Aufteilung in 12 oder 16 Spalten zwar bewährt, was jedoch nicht bedeuten muss, ein solches Raster sofort zu wählen. Vielmehr sollte sich die Aufspaltung aus dem Design heraus ergeben. Weiter finde ich seine Kritik berechtigt, dass zu viel darüber nachgedacht wird, wie Elemente im responsiven aussehen. Auch hier weiß man zwar aus der Erfahrung, welche Muster sich bewährt haben, was aber auch hier nicht automatisch zu einer Aufteilung ohne vorherige Gestaltung führen sollte. Die Verbreitung hat meiner Ansicht nach auch damit zu tun, dass weit verbreitete Frameworks wie beispielsweise Bootstrap die Anzahl der Spalten fest definieren. So können Webseiten schnell und funktional umgesetzt werden, was aus wirtschaftlicher Sicht natürlich sinnvoll ist.

Vor allen Dingen in Hinblick darauf, dass sich das Web aus seiner statischen Begrenztheit befreit und den Weg zurück zur fluiden Gestaltung findet, halte ich den Ansatz für spannend und für einen gelungenen Anreiz, um weiter über das Thema nachzudenken.

Quellen
  1. Vgl. Chimero, Frank: »The Web‘s Grain«, Stand: 2015, URL: https://frankchimero.com/writing/the-webs-grain/, Absatz 75, abgerufen am 6.4.2018.
  2. Vgl. Ebd., Absatz 78.

Mögliche Wege meiner Master-Arbeit

In meiner Zwischenbesprechung mit Alain Yimbou am 28.3.2018 geht es um den aktuellen Stand meines Master-Projekts sowie um die mögliche praktische Umsetzung. Mein Thema, das den Arbeitstitel »evolution of a medium« trägt, zielt auf die kulturellen, technologischen und visuellen Veränderungen des World Wide Webs von Beginn an.

In meiner Zwischenbesprechung mit Alain Yimbou am 28.3.2018 geht es um den aktuellen Stand meines Master-Projekts sowie um die mögliche praktische Umsetzung. Mein Thema, das den Arbeitstitel »evolution of a medium« trägt, zielt auf die kulturellen, technologischen und visuellen Veränderungen des World Wide Webs von Beginn an.

Mögliche Inhalte

Kulturell sind für mich die Verformung der Gesellschaft, die Auflösung geographischer Grenzen, die Infosphäre, die Neuordnung von Raum und Zeit sowie das Web als Abbild der Kultur interessant. Technologisch könnte man das Web als jeweiligen Prototype der nächsten Entwicklung sehen. Zudem ist die Technologie als Motor und Lösung spannend für mich. Entwicklungen im Frontend, wie beispielsweise die Erstellung von Web-Layouts mit Tabellen, Floats, Flexbox oder CSS Grid gehören dabei fast schon in den visuellen Bereich.

Während kulturelle und technologische Aspekte vielmehr eine Nebenrolle spielen werden, steht vor allen Dingen der visuelle Part im Vordergrund. Nachdem das Web anfänglich mit seinen sehr gegenständlichen UI-Elementen eher eine Übersetzung der materiellen Welt war, evolviert es zunehmend zu einem eigenen Medium. Weiter halte ich den Verlauf von einer »No-Layout-Ära« hin zu sehr statischen Layouts und zurück zu fluiden Umsetzungen für sehr wichtig. Auch hier ist zu sehen, dass sich das Web zunächst sehr am Printbereich orientiert hat, um sich dann als eigenes Medium zu etablieren. Die Veränderung der grafischen Benutzeroberflächen, basierend auf kulturellen Lernprozessen und technologischem Fortschritt, ist ein weiterer essenzieller Bestandteil.

Theoretischer Teil

In meinem theoretischen Part möchte ich mich neben der historischen Entwicklung des World Wide Webs und grafischer Benutzeroberflächen mit Informationssystemen, medientheoretischen Inhalten sowie allgemeinen Konzepten des World Wide Webs auseinandersetzen. Dieser Bereich bietet zwar nur oberflächliche Einblicke, hilft mir jedoch zur Orientierung und zur Erfassung des Gesamtkontexts.
Im Bereich der Informationssysteme werde ich mich unter anderem mit Paul Outlet, Vannevar Bushs Memex, J.C.R. Licklider, Ted Nelson, Doug Engelbart und Bill Atkinsons HyperCard beschäftigten. Im medientheoretischen Teil möchte ich Einblicke in die Theorien von Marshall McLuhan, Vilem Flusser, Luciano Floridi, Byung-Chul Han oder Felix Stalder geben. Hier muss eine weitere Auswahl oder Erweiterung zeigen, welche Inhalte tatsächlich relevant für meine Arbeit sein werden. Im allgemeinen könnten Konzepte wie z. B. das von Linked Open Data bereichernd sein.

Praktische Ansätze

In welche exakte Richtung mein praktisches Projekt gehen könnte, ist momentan noch unklar. Für ein spannendes Detail halte ich die zeitliche Einordnung. In diesem Jahr wird das freie World Wide Web 25 Jahre alt und das erste Proposal jährt sich im kommenden Jahr zum 30. Mal. Ich kann mir sowohl eine Ausstellung im World Wide Web als auch im realen Raum vorstellen, wobei wir die ausschließliche Präsentation im Web während des Gesprächs ausgeschlossen haben. Um die digitalen Ergebnisse physisch greifbarer zu machen, macht es durchaus Sinn eine Exposition im realen Raum zu entwickeln. Wie die finale Umsetzung aussehen könnte, muss sich allerdings während meiner weiteren Arbeit herauskristallisieren.

Wie in meinem Beitrag »evolution of a medium« schon ausgeführt, kann ich mir vorstellen, eigene Räume zu bauen und Elemente des Webs, wie beispielsweise den berühmten Sternenhimmel oder MIDI-Sound, ins Analoge zu transportieren. Weiter wäre die Übersetzung von UI-Elementen mithilfe von 3D-Druck denkbar. Im vergangenen Beitrag beschreibe ich mögliche weitere Komponenten, welche ich an dieser Stelle nicht weiter ausführen möchte.

Ausblick

Meine Arbeit könnte Fragen nach zukünftigen Veränderungen beinhalten. Sowie der Einsatz von Natural User Interfaces vieles in der Gestaltung verändert hat, gehe ich davon aus, dass Conversational User Interfaces, Voice Interfaces oder dergleichen massive Auswirkungen auf grafische Benutzeroberflächen haben werden. Auch das Konzept von Linked Open Data beziehungsweise die generelle – auch automatisierte – Darstellung von Informationen wird sicher noch viele, neue Herausforderungen für Gestalter mit sich bringen.
Vor allem die neueren Formen von Interfaces als auch die Verwendung von Technologien wie Eye-Tracking und Augmented oder Virtual Reality, könnten aus meiner Sicht die Auflösung aktueller Formen von grafischen Benutzeroberflächen mit sich bringen.

Inspirierende Projekte

Abschließend habe ich inspirierende Projekte zusammengefasst, welche ich innerhalb meiner Master-Dokumentation behandelt habe. Dazu gehört »Once Upon« von Olia Lialina und Dragan Espenschied, welche im Jahr 2011 soziale Netzwerke mit den technologischen Möglichkeiten von 1997 nachbauten. Weiter inspiriert mich von den beiden Netzkünstlern »One Terabyte of Kilobyte Age«, welches ein Archiv von geocities-Seiten darstellt, die kurz vor Schließung des Dienstes gesichert wurden. Bei beiden gefällt mir vor allen Dingen die visuelle Komponente, welche die visuelle Ästhetik der 90er Jahre widerspiegelt. »Grosse Fatigue« stellt für mich eine großartige, poetische Form dar, ein Thema zu behandeln. Eine beeindruckende Verbindung zwischen theoretischen Inhalten und visueller Darbietung sehe ich zudem in den Projekten »In Pieces« von Bryan James, »Pulse« von Markus Kison und »Laws of UX« von Jon Yablonski.

Für meine Abschlussarbeit möchte ich eine visuelle Form finden, welche die Inhalte direkt und ohne Umschweife kommuniziert und die Ästhetik des Webs gleichermaßen mit aufnimmt.

Räumliche Bedienumgebungen

John Underkoffler, welcher unter anderem ein Interface für den Minority Report entwickelt hat, hält einen TED-Talk über die Zukunft der Interfaces.

John Underkoffler, welcher unter anderem ein Interface für den Minority Report entwickelt hat, hält einen TED-Talk über die Zukunft der Interfaces.

Ein wichtiger Standpunkt, den er vertritt, ist der, dass wir uns grundlegende Gedanken über neue Benutzeroberflächen machen müssen.1 Seit der Entwicklung des Macintoshs und dessen Benutzeroberfläche Anfang der 80er Jahre, hat sich auf technologischer Ebene unglaublich viel verändert. Nichtsdestotrotz arbeiten wir nach wie vor mit ähnlichen Systemen.2

Er führt den Raum als wichtige Komponente an, der Computer und deren Programmiersprachen verstehen die Geometrie der realen Welt jedoch nicht.3 In einem ersten Beispiel zeigt er, wie projizierte Objekte in realen Objekten verschwinden können.4 Er zeigt damit, wie virtuelle und nicht-virtuellen verschmelzen und erklärt, dass Eingabe und Ausgabe im selben Raum stattfinden. Er führt ein weiteres Beispiel an, welches ich besonders beeindruckend finde. Das System Urp für »urban planners« ist ein Werkzeug für Architekten, welche nun mit ihren eigenen Händen im realen Raum mit digitaler Unterstützung arbeiten können. Underkoffler spricht davon, dass den Architekten und Stadtplanern damit Modelle zurückgegeben werden, welche einst durch CAD-Systeme konfisziert wurden. Auf einer projizierten Oberfläche können beispielsweise Häusermodelle verschoben werden, welche Schatten werfen. Die Tageszeit wird dabei auf einer Uhr dargestellt, welche auch als reales Modell vorhanden ist, und die manuelle Veränderung der Zeit verändert gleichermaßen den Schattenwurf. Informationen, ob es beispielsweise Probleme mit der Baubehörde geben könnte, werden umgehend mit einbezogen.5
Diesen Anwendungsfall halte ich für ein gelungenes Beispiel, wie die Verbindung zwischen virtueller und nicht-virtueller Welt sinnvoll eingesetzt werden kann. Erstaunlich ist, dass diese »räumlichen Bedienumgebungen« bereits vor 15 Jahren im MIT und Media Lab entstanden sind.6

Räumliche Bedienumgebung Urp
Urp – Urban plannersI

Ein weiteres Beispiel von Underkoffler halte ich dagegen für nicht allzu anwendbar. Ihm werden auf der Leinwand (in der realen Arbeitsumgebung vermutlich kleiner) Bilder angezeigt, welche er mithilfe eines Bedienhandschuhs frei anordnen kann. Er navigiert durch die Galerie, zoomt rein und raus und zeigt Beispiele, wie die Bilder auf verschiedene Arten, z.B. nach Farbe, sortiert werden können.7 Er zeigt, wie Bilder einfach per Handbewegung auf andere Bildschirme geschoben werden können, was vor allem bei der Kollaboration verschiedener Teammitglieder spannend ist.8

Das System an sich halte ich grundsätzlich zwar nicht für schlecht, bei der Bedienung frage ich mich jedoch, ob sie alltagstauglich ist. Mit Blick auf die Zukunft und möglicher Interfaces, sehe ich mich nicht den ganzen Tag wild gestikulierend vor einer projizierten Fläche. Ich bin überzeugt davon, dass Interfaces zunehmend den Körper mit einbinden und halte die direkte Arbeit mit Händen auch grundsätzlich für sinnvoll. Aber diese Art von Bedienung sehe ich eher in zeitlich begrenzenden Umgebungen, wie beispielsweise innerhalb einer Präsentation.

Quellen
  1. Vgl. Underkoffler, John: »Pointing to the future of UI«, URL: https://www.ted.com/talks/john_underkoffler_drive_3d_data_with_a_gesture, TC: 00:01:07–00:02:03, abgerufen am 26.2.2017.
  2. Vgl. Ebd., TC: 00:00:12–00:01:07.
  3. Vgl. Ebd., TC: 00:01:07–00:02:03.
  4. Vgl. Ebd., TC: 00:02:03–00:02:26.
  5. Vgl. Ebd., TC: 00:04:15–00:05:20.
  6. Vgl. Ebd., TC: 00:05:20–00:06:29.
  7. Vgl. Ebd., TC: 00:07:18–00:08:31.
  8. Vgl. Ebd., TC: 00:09:50–00:10:56.
Abbildungen
  1. Eigener Screenshot; Underkoffler, John: »Pointing to the future of UI«, URL: https://www.ted.com/talks/john_underkoffler_drive_3d_data_with_a_gesture, TC: 00:10:22, abgerufen am 26.2.2017.

Zurück auf Los

Frank Chimero spricht in einem Vortrag im Oktober 2017 bei der Mirror Conf in Braga über die steigende Komplexität in der Webentwicklung und wiederkehrende Verwirrtheit in Bezug auf technologische Neuerungen und Möglichkeiten. Seine Schilderung finde ich vor allen Dingen dahingehend spannend, dass es mir in vielerlei Hinsicht ähnlich geht.

Frank Chimero spricht in seinem Vortrag »Everything Easy is Hard Again« im Oktober 2017 bei der Mirror Conf in Braga über die steigende Komplexität in der Webentwicklung und wiederkehrende Verwirrtheit in Bezug auf technologische Neuerungen und Möglichkeiten. Seine Schilderung finde ich vor allen Dingen dahingehend spannend, dass es mir in vielerlei Hinsicht ähnlich geht.

Er erläutert die Veränderung bei der Entwicklung von Web-Layouts und von dem Gefühl, dass es sich alle fünf Jahre so anfühlt als würde man noch einmal von vorne beginnen,1 nachdem man sich gerade in die aktuelle Technologie eingearbeitet hat. Ab Mitte der 90er Jahre war die Gestaltung mithilfe von Tabellen üblich; später waren es Floats, Flexbox oder CSS Grid, welche auch in Kombination verwendet werden können.
Zudem spricht er von der Tatsache, dass Methoden, die Tabu waren plötzlich zu den Empfehlungen gehören. Hier nennt er das Beispiel, dass er einen Artikel gelesen hat, in dem es um die Vorteile geht, keine Stylesheets, sondern Inline-Styles zu verwenden.2 Ich selbst hing auch schon an diesem Punkt als ich das erste mal von »above the fold« hörte und eine Seite nach diesem Konzept verbessern sollte.

Ähnlich wie Chimero gab es bei mir immer wieder – wenn auch riesengroße – Lücken bei der Entwicklung von Webseiten. Nachdem ich meine ersten Webseiten im Jahr 2000 erstellte, habe ich mich jahrelang nicht mehr im Detail damit beschäftigt. Hier und da nur Versuche bis ich mich mit Beginn meiner Ausbildung 2007 wieder angenähert habe. Durch kleine statische Seiten oder die Betreuung von Seiten via Content Management Systeme wurde es wieder wärmer, doch den richtigen Sprung habe ich nicht mehr geschafft. Erst mit dem Beginn meines Studiums hatte ich immer wieder die Motivation, »das jetzt endlich richtig lernen zu wollen«. Es ging damit los, Floats richtig zu verstehen und plötzlich gab es dieses Responsive Webdesign, welches vieles durcheinander brachte: Pixel, em, rem oder Prozent? Fluid, Adaptiv, was? Und nach kurzer Pause gab es mit Flexbox plötzlich wieder etwas Neues. Ist das zusätzlich? Oder alternativ? Die meiste Zeit verbrachte ich wohl damit, zu verstehen, was wie und warum verwendet wird.

Mit meinen Kenntnissen war es bisher kein Problem, kleinere Webprojekte umsetzen, doch vor wenigen Wochen habe ich mich entschieden, tiefer eintauchen zu wollen. Ich habe damit begonnen bei #100daysofcode mitzumachen, um zu sehen, was passiert, wenn ich jetzt länger am Ball bleibe. Dabei geht es darum, sich eigene Ziele zu setzen und 100 Tage lang mindestens eine Stunde täglich zu üben und zu lernen. Es ist erstaunlich wie viel man in so kurzer Zeit lernen kann und ich hoffe trotz Master-Arbeit dran bleiben zu können. Vor allem wünsche ich mir, nicht wie bisher demotiviert zu sein, sobald es in JavaScript zu sehr ins Detail geht.

Der Vortrag von Frank Chimero inspiriert und motiviert mich dahingehend, dass es aus seiner Sicht egal sein könnte, ob man direkt aus der Schule kommt oder 20 Jahre Erfahrung mitbringt. Man könnte an der gleichen Stelle landen, nämlich im ersten Jahr, in dem man Webseiten erstellt.3 Und das ist immerhin ein hervorragender Anfang für viele weitere Jahre.

Quellen
  1. Vgl. Chimero, Frank: »Everything Easy is Hard Again«, Stand: 12.10.2017, URL: https://frankchimero.com/writing/everything-easy-is-hard-again/, Absatz 18, abgerufen am 15.2.2017.
  2. Vgl. Ebd., Absatz 26.
  3. Vgl. Ebd., Absatz 52.

Kein Vergleich grafischer Benutzerobflächen

Ursprünglich wollte ich die grafischen Benutzeroberflächen anfänglicher Systeme gegenüberstellen. So z.B. die Interfaces des Xerox Alto, Xerox Star, Apple Lisa oder Macintosh. Aus jetziger Sicht sehe ich jedoch leider keinen großen Mehrwert für meine Arbeit.

Ursprünglich wollte ich die grafischen Benutzeroberflächen anfänglicher Systeme gegenüberstellen. So z. B. die Interfaces des Xerox Alto, Xerox Star, Apple Lisa oder Macintosh. Aus jetziger Sicht sehe ich jedoch leider keinen großen Mehrwert für meine Arbeit. Ich finde die Entwicklung nach wie vor spannend und wichtig. Zudem kann ich mir vorstellen, dass ich die ein oder andere Erkenntnis daraus ziehen hätte können. Nichtsdestotrotz erhoffe ich mir mehr Erkenntnisse durch die spezielle Auseinandersetzung mit der Gestaltung im Web. Ab jetzt möchte ich mich daher verstärkt dem grafischen Research für mein praktisches Projekt widmen sowie weitere theoretische Grundlagen, speziell für diesen Bereich, schaffen.

Carbon Design System

Vor längeren bin ich bereits auf das Carbon Design System aufmerksam geworden. Da vor kurzem ein Interwiew mit Bethony Sonnenfeld, Design Lead bei IBM, veröffentlicht wurde, habe ich nochmals mit dem System auseinandergesetzt. Carbon ist ein Designsystem, das für die Produkte der IBM Cloud entwickelt wurde.

Vor längeren bin ich bereits auf das Carbon Design System aufmerksam geworden. Da vor kurzem ein Interwiew mit Bethony Sonnenfeld, Design Lead bei IBM, veröffentlicht wurde, habe ich mich erneut mit dem System auseinandergesetzt.

Carbon ist ein Designsystem, das für die Produkte der IBM Cloud entwickelt wurde. Nachdem anfänglich nur ein überarbeitetes System für IBM Bluemix eingeführt werden sollte, wuchs der Wunsch, dass Carbon ein allgemeines, produktunabhängiges System wird. Im März 2016 wurde mit dem Umbau begonnen, seit Juni 2016 gibt es die Version 6.0, im Oktober 2017 wurde die aktuelle Version 8 des Systems veröffentlicht.

Im Interview mit Jason Grant stellt Bethony Sonnenfeld die Herangehensweise bei der Überarbeitung bzw. Neugestaltung des Systems vor. Sie erläutert die Motivation und Denkweise, sowie den Prozess selbst. Zwei für mich wichtige Punkte sind dabei die Verhaltensregeln sowie die Dokumentation. Die Verhaltensregeln zeigen, auf welchen Wegen und in welcher Art und Weise bestenfalls kommuniziert wird. Das betrifft unter anderem die zwischenmenschliche Umgangsweise. So wird beispielsweise auf die Selbstverständlichkeit hingewiesen, dass man trotz unterschiedlicher Ansichten respektvoll miteinander umgehen sollte. Zusätzlich schafft eine Übersicht der möglichen Kontaktmöglichkeiten Klarheit und vermeidet eine chaotische Kommunikation auf diversen Kanälen.

Die Dokumentation klärt viele Fragen rund um das Carbon Design System. Zu jedem Element gibt es Informationen, so dass viele Fragen überflüssig werden und bestenfalls auf allen Seiten Zeit eingespart wird.1 Dabei ist nicht nur ein reibungsloser Arbeitsauflauf wichtig. Wie Alla Kholmatova in ihrem Buch »Design Systems – A practical guide to creating design languages for digital products.« schon festhält, ist es vor allem in größeren Teams wichtig, die Elemente eindeutig festzulegen. Das verhindert beispielsweise, dass doppelte Bausteine aus unklaren oder unvollständigen Vorgaben entstehen und das System inkonsistent wird.
Für einen weiteren wichtigen Punkt halte ich die Nutzung von GitHub. Der Prozess ist sehr kontrolliert festgelegt, es müssen stets zwei Designer Änderungen absegnen. Damit kann trotz der Zusammenarbeit vieler sichergestellt werden, dass das System konsistent bleibt und den Spezifikationen entspricht.
Bethony Sonnenfeld betont, dass die Auswahl eines vorhandenen Designsystems von der persönlichen Präferenz abhängt. Sie basieren beispielsweise auf verschiedenen JavaScript-Softwarebibliotheken und als Unerfahrene würde sie ein System auswählen, das eine gute, saubere Code-Basis besitzt sowie User Experience-Richtlinen anbietet. Viele Systeme zeigen laut ihr viel zu wenig Anwendungsbeispiele, so dass man es als Nicht-Designer in der Umsetzung sehr schwer hat.2 Wobei ich mir hier die Frage stelle, wie »einfach« solche Systeme wirklich angelegt werden müssen. Aus meiner Sicht sollen sie den Arbeitsablauf von Designern und Entwicklern effizienter und schneller gestalten, die Berufe an sich jedoch nicht völlig ersetzen.

Mir persönlich gefällt das Carbon Design System vor allem im Hinblick auf das synchronisierte Arbeitsmaterial für Designer und Entwickler. Für Designer gibt es beispielsweise eine Sketch-Datei, die alle Elemente enthält. Für Systeme bzw. Frameworks wie Bootstrap gibt es zwar unzählige Sketch-Dateien im Web zu finden, dabei sind aber sicherlich nicht alle vollständig, sauber angelegt und vor allem nicht stets synchron. Abschließend finde ich es sehr spannend einen näheren Einblick in den Prozess erhalten zu haben, da er verständlich macht wie lange die Entwicklung eines solchen Systems inklusive der einzelnen Versionen und Verbesserungen benötigen kann. Das wirkt zum einen abschreckend, da in dieser Zeit natürlich auch die nötigen Ressourcen bereitgestellt werden müssen. Auf der anderen Seite zeigt es den zwischenzeitlich standardisierten Ablauf vieler Produkte, die erst auf den Markt gelangen, um dann stetig verbessert zu werden.

Quellen
  1. Vgl. Sonnenfeld, Bethony, Integral: »UX Design Interview With Bethany Sonnenfeld, Design Lead at IBM for Carbon Design System«, URL: https://www.youtube.com/watch?v=HI-hvAjQc4A, TC: 00:13:50–00:15:15, abgerufen am 27.12.2017.
  2. Vgl. Ebd., TC: 00:45:40–00:47:40.
Abbildungen
  1. Titelbild: Eigener Screenshot; IBM, Download: »Carbon_Design-Kit_8.0.0.sketch« URL: https://github.com/carbon-design-system/carbon-design-kit, abgerufen am 27.12.2017.

Von der No-Layout-Ära zur wiedergewonnnen Fluidität des Webs

Vor kurzem bin ich auf den Dokumentarfilm »What Comes Next Is the Future« von Matt Griffin gestoßen. Der Film setzt sich mit der Geschichte des Webs auseinander und wird von den Menschen, die bedeutende Figuren des Webs sind, erzählt. Darunter unter anderem Tim Berners-Lee, Eric Meyer, Ethan Marcotte, Brandon Eich oder John Resig. Mit den aus Interviews gewonnen Antworten, schustert Griffin einen Film, der kapitelweise auf unterschiedliche Themen eingeht.

Auf lynda.com findet man größtenteils Tutorials aus Bereichen wie z. B. Design, Entwicklung, Fotografie oder Web. Vor kurzem bin ich auf den Dokumentarfilm »What Comes Next Is the Future« von Matt Griffin gestoßen. Der Film setzt sich mit der Geschichte des Webs auseinander und wird von den Menschen, die bedeutende Figuren des Webs sind, erzählt. Darunter unter anderem Tim Berners-Lee, Eric Meyer, Ethan Marcotte, Brandon Eich oder John Resig. Mit den aus Interviews gewonnen Antworten, schustert Griffin einen Film, der kapitelweise auf unterschiedliche Themen eingeht.

Bei meiner Recherche stoße ich auf unzählige Timelines über die Entstehung des Webs, auf originale Dokumente oder kleine Zusammenfassungen. Zudem gibt es natürlich tausende Treffer inhaltlicher Natur, die sich auf Teile des technologischen oder visuellen Aspekts konzentrieren. Insgesamt stellt mich meine Suche jedoch noch nicht zufrieden, da es nur wenige ansprechende Auseinandersetzungen mit dem Web als Medium selbst gibt. Das macht den Film von Griffin so interessant für mich. Zum einen, weil die Entwicklung von Menschen erzählt wird, die sie miterlebt und beeinflusst haben. Zum anderen werden zum Teil genau die Aspekte angesprochen, für die ich mich interessiere.

Ein wichtiger Gesichtspunkt, der das Web fundamental ausmacht, wird dabei direkt zu Beginn angesprochen. Das Web wurde letztendlich als offener Informationsraum konzipiert, in dem es für Jeden möglich sein soll, etwas zu publizieren. Das ist für Dave Rupert, Co-Gründer von Paravel, die schönste Sache am Web: Man kann jederzeit Dinge veröffentlichen, die man selbst nützlich findet und Andere können daraus wiederum neues kreieren.1 Brad Frost, welcher Atomic Design entwickelt hatte, liebt den freien Fluss der Ideen, Informationen und Gedanken und betont, dass das vor dem Web unmöglich war.2 Dieser unaufhaltsame, geistige Fluss war auch für John Perry Barlow (Cyberspace als neue Heimat des Geistes ») eine essenzielle Eigenschaft des Webs. Ähnlich wie Barlow sieht Lyza Danger Gardner, Co-Autorin von »Head First Mobile Web«, eine offene Welt. Sie spricht davon, dass das Web keine Wände besitzt und die Kosten, um daran teilzuhaben, eher gering sind.3 Jeffrey Feldmann, unter anderem Autor von »Designing Web Standards«, sieht dagegen die technischen Hürden weiter sinken. Jeder kann zumindest Twitter und Facebook nutzen und hat so die Möglichkeit sich frei zu äußern. Zudem reicht es bei mehr Interesse für einen Tumblr-Blog oder sogar eine WordPress-Seite. Er findet die Tatsache, dass man responsive Webseiten machen kann, ohne überhaupt zu wissen, was die Wörter bedeuten, sehr bemerkenswert und gut.4 Diesen Aspekt finde ich extrem wichtig, da dadurch garantiert wird, dass jeder an dieser Welt teilnehmen kann. Bei solchen Aussagen muss natürlich immer von den vielen Menschen abgesehen werden, welche noch keinen Internetzugang besitzen oder in Ländern leben, wo viele Inhalte gesperrt sind. Die Erschließung des ganzen Planeten wird sicher einer Hauptaufgabe der nächsten Jahre sein.

Chris Wilson, welcher unter anderem an der Entwicklung des ersten Massen-Browsers Mosaic beteiligt war, erinnert sich dagegen noch gut an die Erschließung des Webs in der westlichen Welt. Er spricht davon, dass »wir keine normalen Menschen waren, welche das Web nutzten«5. Zwar gab es das Internet schon vor dem Web, doch es war sehr schwierig, an Informationen zu kommen. Daher bestätigt er Tim Berners-Lee in seiner Idee, dass es wirklich einfach sein muss, Zugang zu erhalten.6 Berners-Lee sieht den Schlüssel zum Web darin, dass es ein virtuelles System geben muss, dass über allen bereits vorhandenen Systemen liegt. Dieses große Hypertext-Buch wird via Internet zugänglich.7

No-Layout-Ära

Zu Beginn des Webs waren die Inhalte eher strukturierte Informationen, als wirklich gestaltete Seiten. Jen Simmons nannte das die No-Layout-Ära und die Darstellung der Inhalte war je nach Browser unterschiedlich.8 Eric Meyer erzählt, dass sich »Seiten gestalten« eher wie ein Witz anhörte.9 Der Designer David Siegel war es schließlich, welcher mit seinem Buch »Creating Killer Web Sites« einen Weg fand, Webseiten mit Tabellen zu gestalten.10 Dass das Buch, das 1996 erschien, im selben Jahr das meistverkaufte Buch bei Amazon war11 spricht Bände. Daran lässt sich erkennen, dass der Wunsch nach Gestaltungsmöglichkeiten riesig war. Ein erster Vorschlag für Cascading Style Sheets (CSS) wurde zwar schon 1993 gemacht, doch erst im Dezember 1996 wurde das CSS Level 1 veröffentlicht.12 Im ersten Moment funktionierten die Tabellen als erstes Grid, doch wie John Allsopp erklärt, gab es das Gefühl, dass es einen besseren Weg geben muss solche Anforderungen zu erfüllen.13 Christopher Schmitt sieht in der Nutzung von CSS eine Goldrausch-Ära. Jeder arbeitete daran durch CSS-Floats bessere Layouts erstellen zu können, so dass man die Gestaltung durch Tabellen endlich hinter sich lassen kann.14 Nichtsdestotrotz waren die Tabellen ein wichtiger Schritt auf dem Weg zur besseren Umsetzung. Eric Meyer sieht viele Dinge im CSS, welche darauf basieren, was Entwickler mit Tabellen-Layouts erstellt hatten.15

Flash als Prototype für CSS und JavaScript-Libraries

Viele Standards im Web basieren auf einer ähnlichen Herangehensweise, wie es mit der Übertragung von Tabellen auf CSS geschehen ist. Bedürfnisse werden experimentell mit vorhandenen Mitteln »irgendwie passend gemacht« bis aus ihnen langfristig neue Standards heranwachsen. Weitestgehend könnte man dabei von Prototypen sprechen, welche später in verbesserte, weniger komplexe Standards übertragen werden. Eine Aussage von Kelly Goto hat mich in Bezug auf Adobe Flash überrascht, selbst wenn sie absolut einleuchtend ist. Aus ihrer Sicht war die Arbeit mit Flash ein stückweit wie Prototyping. Flash gab vielen die Möglichkeit visuell für das Web zu denken. Als Werkzeug hat Flash den Prozess ermöglicht, dass kreative Personen Ideen ausdrücken konnten.16 Laut Aaron Gustafson gab Flash zudem die Möglichkeit mehr Kontrolle über die Gestaltung zu erhalten als mit CSS. Elemente konnten animiert und vereinnahmende Nutzererlebnisse geschaffen werden.17 Val Head sieht Flash auch als gute Chance herauszufinden, was das Web benötigt. Bei der Entwicklung einer neuen JavaScript-Library startete man somit zumindest nicht bei null.18
Eric Meyer sieht dagegen in Flash das komplette Gegenteil zum grundsätzlichen Aufbau des Webs. Der Ursprungsgedanke des Webs ist, dass die weite Verbreitung über der Konsistenz steht. Flash zu nutzen bedeutet jedoch, dass man alles oder nichts haben kann: Entweder man installiert Flash und hat ein konsistentes Nutzererlebnis oder man sieht im Gegenzug nichts.19

Letztendlich wurde die Ära Flash mit dem Erscheinen des iPhones 2007 eingeläutet. Das iPhone unterstützte kein Flash und Apple war überzeugt davon, dass alle Aufgaben mit HTML5 zu lösen sind. Das war ein entscheidender Einschnitt, da die Darstellung von Inhalten nun komplett zurück in die Hände der Browser bzw. des Codes gelegt wurde. Dieser Schritt vorwärts war gleichzeitig ein positiver Schritt rückwärts Richtung Web, das offen und zugänglich sein sollte.

Die Fluidität des Webs annehmen

Während das World Wide Web ursprünglich visuell sehr überschaubar war, wurde die Gestaltung zunehmend komplexer. Der Wunsch von Gestaltern mehr und mehr Einfluss auf die tatsächliche Darstellung zu nehmen wuchs und wirkte sich auch auf die Umsetzung aus. Tabellen und Frames wurden als Layout-Elemente verwendet, die Layouts selbst wurden immer statischer.

Ein entscheidender Beitrag von CSS ist der, dass Inhalt und Gestaltung getrennt werden. Dadurch kann der Fokus beim HTML-Dokument ausschließlich auf die inhaltliche Struktur gelegt werden. Mit CSS Zen Garden entstand im Mai 2003 ein Projekt, das das Ziel hatte zu zeigen, was alles einzig mit CSS möglich war. Das HTML-Dokument blieb dabei immer gleich und zugehöriges CSS konnte eingeschickt werden. Lyza Danger Gardner spricht von einem Art ersten universellen Gefühl dafür, was diese Trennung tatsächlich bedeuten kann.20 Kelly Goto bezeichnet das sogar als großen Moment, der alles im Web änderte und das Kreativitätslevel auf eine völlig neue Ebene anhob.21

Obwohl Tantek Çelik erklärt, dass CSS vorwärts-kompatibel für verschiedene Bildschirmgrößen angelegt war und Seiten somit auf verschiedenen Bildschirmen funktionierten,22 wurde diese Kompatibilität aus meiner Sicht durch fix angelegte Layouts zerstört. Nichts sollte dem Zufall überlassen werden und alles perfekt aussehen.
Mit dem Erscheinen des iPhones wurde das Web aus Kevin M. Hoffmans Sicht stark vermenschlicht. Es war immer dabei und man hatte nicht mehr das Gefühl online gehen zu müssen. Diesen Punkt empfand Tim Berners-Lee schon zu Beginn als sehr störend (Struktureller Aufbau des Webs und die Koexistenz von Mensch und Maschine »). Gleichzeitig wuchs das Bedürfnis nach mobiler Gestaltung deutlich und krempelte alles um. Während Jonathan Snook noch davon spricht, dass es ok war, dass man sich nur um zwei Auflösungen (1024 x 768 px und 320 x 240 px) kümmern musste,23 empfand es John Allsopp langfristig als eher unüberschaubare Aufgabe. Er fragt sich, wie weit es gehen soll und wann wir damit aufhören für jedes Endgerät einzelne Versionen zu entwickeln.24
Einen fundamentalen Fortschritt erreicht Ethan Marcotte, der 2010 den Begriff Responsive Design prägte. Ihm war die Wichtigkeit von flexiblen oder fluiden Layouts bewusst. Zudem musste der mediale Inhalt innerhalb dieser Layouts funktionieren. Mit den Mediaqueries aus CSS3 erreicht er, dass alles in allem responsiv funktioniert und ebnet damit den Weg für eine neue Dimension der Webgestaltung.
Auch Macrotte betont die Tatsache, dass das Web als flexibles Medium angelegt wurde und Designer und Entwickler das Extra an Komplexität in das Medium brachten. Er sieht es als wirklich flexibles, komplett anpassbares Medium, für das wir auch so gestalten sollten.25 Aus seiner Sicht, funktioniert die Industrie umso besser, je weniger wir versuchen die Darstellung zu kontrollieren.26 Jonathan Snook fügt hinzu, dass wir das Web umso einfacher verwalten können, wenn wir die Fluidität des Webs annehmen.27

Zugänglichkeit von Informationen

Die Entwicklung von Apps habe ich bisher – abgesehen vom Aufwand für die Bereitstellung auf verschiedenen Plattformen – als eher unproblematisch angesehen.
Durch Apps wird jedoch die Zugänglichkeit von Informationen stark eingeschränkt. Aus Sicht von Tim Berners-Lee treten die Leute damit in die Falle, dass sie denken eine App ist interaktiv und schneller. Doch bei Apps für beispielsweise Magazine ist es unheimlich wichtig, dass die Beiträge nicht ausschließlich in einem Programm landen, sondern offen im Web zugänglich sind. Ein essenzieller Bestandteil des Webs ist der, dass man Inhalte miteinander verknüpft. Einen Magazinbeitrag in einer App kann man dagegen ohne URL nicht einfach verlinken oder teilen.28
Çelik sieht zudem das Problem, dass jedes Programm evaluiert wird, bevor es – teilweise Tage später – zum Download bereitsteht. Man solle sich vorstellen, wenn man bei jeder Änderung einer Webseite tagelang warten muss, bis die Änderung akzeptiert wird. Den gleichen Standpunkt vertritt Lyza Danger Gardener. Nämlich das genau das das Web ausmacht: Wenn man etwas publizieren möchte, publiziert man das – ohne Autorisierung oder Bewertung des veröffentlichten Inhalts.29 Das würde nämlich wieder die Frage aufgreifen, wer dazu überhaupt legitimiert wäre, über die Veröffentlichung von Inhalten zu entscheiden (Verformung der Gesellschaft »).

Die Einzigartigkeit der Unbeschränktheit

Dass man etwas ohne »Pförtner« publizieren kann empfindet auch Alex Russell als sehr elementar. Ob es letztendlich jemanden interessiert oder nicht, ist erstmal irrelevant. Keine Möglichkeit zu haben sich zu äußern, wäre dagegen viel schlimmer. In dieser Unbeschränktheit sieht er die Einzigartigkeit des Webs. Er sieht das Web als das demokratischste System unserer Generation.30

Tim Berners-Lee spricht davon, dass es unser Web ist und fordert uns auf, dass wir alles dafür tun müssen, dass das Web weiterhin offen bleibt. Denn das ist nach wie vor keine Selbstverständlichkeit.31

Resümee

»What Comes Next Is the Future« von Matt Griffin ist aus meiner Sicht ein großartiger Zusammenschnitt der Web-Stimmen der letzten drei Jahrzehnte. Erst während des Films ist mir aufgefallen, was für ein Privileg es ist, dass noch so viele »originale« Stimmen zu hören sind. Das Web ist so selbstverständlich in unserem Alltag verankert, dass es nicht mehr wegzudenken ist. Gleichermaßen ist es noch so jung, dass Griffin den Begründer des Webs selbst, Tim Berners-Lee, interviewen konnte. Mit Brandon Eich als Entwickler von JavaScript oder Chris Wilson als Mitentwickler des Browsers Mosaic werden weitere Menschen gezeigt, welche das World Wide Web richtungsweisend beeinflusst haben. Das Schöne daran ist, dass der Film klar macht, dass wir nach wie vor in einer enormen Entwicklungsphase sind. Vor wenigen Jahren war der Ausdruck Responsive Webdesign noch nicht bekannt, erst seit kürzerer Zeit gibt es das CSS Grid, welches die Gestaltung weiter vereinfachen soll. Das Web entwickelt sich weiter und weiter und diese Evolution mitzuverfolgen ist großartig, da man nicht weiß, was der nächste Schritt sein wird. Wie viel wird sich noch einmal fundamental ändern? Wird es das Web in seiner Form weiter geben? In welche Richtung könnte es sich verändern?

Da ich die Auseinandersetzung mit der Vergangenheit sehr wichtig finde, um die jetzige Situation in ein Gesamtbild zu bringen und weitere Veränderungen abzusehen, möchte ich weiter in diese Richtung recherchieren. Unter anderem möchte ich mich mit dem Begriff »The next Web« auseinandersetzen. Zudem bin ich durch den Film auf Ethan Marcotte aufmerksam geworden dessen Aussagen mir in vielerlei Hinsicht zusagen. Auch mit ihm möchte ich mich weiter beschäftigen.

Nachtrag

Glücklicherweise habe ich das Video nachträglich öffentlich zugänglich bei Vimeo gefunden: What Comes Next Is The Future (2016) ».

Quellen
  1. Vgl. Griffin, Matt: »What Comes Next Is the Future«, »Why the Web«, USA 2016, URL: https://www.lynda.com/Web-Development-tutorials/What-Comes-Next-Future-Creating-Web/647684-2.html, TC: 00:01:03–00:01:24, abgerufen am 16.6.2017.
  2. Vgl. Ebd., TC: 00:01:57–00:02:12.
  3. Vgl. Ebd., TC: 00:01:44–00:01:57.
  4. Vgl. Ebd., TC: 00:02:12–00:02:42.
  5. Ebd., TC: 00:00:00–00:00:34, »The web arrives«.
  6. Vgl. Ebd.
  7. Vgl. Ebd., TC: 00:00:38–00:01:27.
  8. Vgl. Ebd., TC: 00:00:00–00:00:16, »Killer websites«.
  9. Vgl. Ebd., TC: 00:02:40–00:02:45.
  10. Vgl. Ebd., TC: 00:00:38–00:01:03.
  11. Vgl. Ebd., TC: 00:01:35–00:01:46.
  12. Vgl. »Cascading Style Sheets« in: »Wikipedia, the free encyclopedia«, Stand: 8.5.2017, URL: https://de.wikipedia.org/wiki/Cascading_Style_Sheets, abgerufen am 16. Juni 2017.
  13. Vgl. Griffin, Matt: »What Comes Next Is the Future«, »Cascading styles«, URL: https://www.lynda.com/Web-Development-tutorials/What-Comes-Next-Future-Creating-Web/647684-2.html, TC: 00:00:00–00:00:15, abgerufen am 16.6.2017.
  14. Vgl. Ebd., TC: 00:00:26–00:00:48.
  15. Vgl. Ebd., TC: 00:01:27–00:01:44.
  16. Vgl. Ebd., TC: 00:01:03–00:01:23, »There can be only one Flash«.
  17. Vgl. Ebd., TC: 00:00:10–00:00:21.
  18. Vgl. Ebd., TC: 00:03:15–00:03:48, »JavaScript spreads«.
  19. Vgl. Ebd., TC: 00:02:08–00:02:45, »There can be only one Flash«.
  20. Vgl. Ebd., TC: 00:02:43–00:02:53, »Web standards«.
  21. Vgl. Ebd., TC: 00:03:19–00:03:39.
  22. Vgl. Ebd., TC: 00:04:39–00:05:00.
  23. Vgl. Ebd., TC: 00:01:28–00:01:52, »Many devices, one approach«.
  24. Vgl. Ebd., TC: 00:02:40–00:02:57.
  25. Vgl. Ebd., TC: 00:00:00–00:00:33, »Flexible by default«.
  26. Vgl. Ebd., TC: 00:01:23–00:02:10.
  27. Vgl. Ebd., TC: 00:01:01–00:01:22.
  28. Vgl. Ebd., TC: 00:00:53–00:01:08 und TC: 00:02:45–00:03:20, »Connecting and distributing«.
  29. Vgl. Ebd., TC: 00:04:35–00:05:02.
  30. Vgl. Ebd., TC: 00:02:44–00:03:23, »The next web«.
  31. Vgl. Ebd., TC: 00:00:02–00:00:13, »Growing standards«.

Sketchisketch

Erst seit kurzem arbeite ich mit der SketchApp, welches bei mir – wie sicher bei vielen – Photoshop im Bereich Interface Design ablöst. Mit dem Tool arbeitet es sich nicht nur sehr viel effizienter, sondern vor allem die Webnähe sehe ich als eindeutigen Vorteil. Momentan sehe ich SketchApp klar vorne, jedoch frage ich mich, wie schnell und gut Adobe mit XD nachziehen wird.

Erst seit kurzem arbeite ich mit der SketchApp, welches bei mir – wie sicher bei vielen – Photoshop im Bereich Interface Design ablöst. Mit dem Tool arbeitet es sich nicht nur sehr viel effizienter, sondern vor allem die Webnähe sehe ich als eindeutigen Vorteil. Während man in Photoshop Ebene für Ebene anlegt, bearbeitet und im schlechtesten Fall später wieder Ebene für Ebene ändern muss, hält SketchApp einige Ansätze bereit, durch die die Arbeit sehr viel schneller zu erledigen ist.

So gibt es beispielsweise »Textstile«, die sehr nah am CSS sind. Damit kann man Stile für Elemente wie z. B. h1, h2, etc. anlegen und ihnen zuordnen. Vor allem im Hinblick auf spätere Abänderungen sieht man hier den großen Fortschritt gegenüber Photoshop.

Auffallend ist auch, dass die komplette Bearbeitungsleiste direkt auf die Arbeit im Web schließen lässt. So gibt es Borders, Shadows, Spacing oder Opacity. Alles Begriffe, die so auch im CSS auftauchen. Zwar können diese Eigenschaften auch in Photoshop angelegt werden, aber allein schon der Begriff »Kontur« anstelle von Border zeigt, dass die Software nicht primär für Interface Design entwickelt wurde, sondern nach der Ära von fireworks eher dafür missbraucht wurde.

Die Symbole sind für mich der größte Entwicklungsschritt. Man kann zentral Symbole anlegen, die zum einen dafür sorgen, dass man gewisse »Templates« für bestimmte Gestaltungselemente hat. Zum anderen können mit den Symbolen beispielsweise Zustände angelegt werden. Während man in Photoshop Zustände händisch oder maximal noch mit Ebenenstilen angelegt hatte, um sie dann umzustellen, kann man das bei SketchApp via DropDown ändern. Einmal richtig angelegt, kann ein Zustand z. B. Stück für Stück auf active oder inactive (oder jede Begrifflichkeit der Wahl) gestellt werden.

SketchApp arbeitet sehr eng mit Invision zusammen, was vor allem im Bezug auf Prototyping sehr hilfreich ist. So können die einzelnen Artboards bei Invasion hochgeladen werden und zu einem klickbaren Prototypen zusammengeschustert werden.

Insgesamt hat die Software auch eine ganze Reihe von guten PlugIns, die die Arbeit immens erleichtern. Allein schon PlugIns, die den Export für den Entwickler – inklusive assets – ermöglichen, helfen nicht nur der reibungslosen Übergabe, sondern auch dem Entwickler bei der späteren Arbeit.

Abschließend halte ich SketchApp für einen großen Fortschritt im Bereich Interface Design und bin sehr gespannt, ob Adobe XD das Ruder nochmal herumreißen kann. Im Moment scheint mir ersteres vorne zu liegen, doch bleibt es abzuwarten, was Adobe – mit sicher etwas mehr Budget – auf den Tisch zaubert.
Nach anfänglichen Umstellungsschwierigkeiten, habe ich doch sehr schnell in die Software gefunden und bin jeden Tag froh darüber, wie sehr meine Arbeit von SketchApp profitiert. Jetzt wenn man die Software kennt, fragt man sich, wieso es nicht schon viel früher diesen logischen Schritt gab.

Generation mitten im Wandel

Im Rahmen meiner Recherche habe ich bereits wichtige Erkenntnisse des Buchs »The digital turn – Design in the Era of Interactive Technologies« festgehalten. Zwei weitere Essenzen finde ich im Essay »The end of the word as we know it» von Lustlab, sowie »Digital Culture: From open design to creating your own future« von Susanne Stauch.

Im Rahmen meiner Recherche habe ich bereits wichtige Erkenntnisse des Buchs »The digital turn – Design in the Era of Interactive Technologies« festgehalten (Empathische Interaktion »).

Zwei weitere Essenzen finde ich im Essay »The end of the word as we know it« von Lustlab, sowie »Digital Culture: From open design to creating your own future« von Susanne Stauch.

Unsere Fähigkeiten gehen durch den digitalen Wandel nicht verloren

Lustlab spricht über den aktuellen Wandel, dem vor allem auf Papier geschriebene Bücher zu Lasten fällt. Doch selbst, wenn diese nicht mehr da sein werden, wird noch immer »die Fähigkeit Geschichten aufzuzeichnen, mit geschriebener Sprache zu kommunizieren und Geschichten zu erzählen überleben«. Des Weiteren verändert sich zwar unsere Art zu lesen, doch noch »nie zuvor haben wir mehr gelesen und geschrieben als jetzt.« Zwar ist der Weg kürzer und informeller, doch pro Sekunde werden Millionen von E-Mails, Textnachrichten, Facebook-Updated oder Tweets geschrieben.1
Diese Essenz ist nicht revolutionär, doch halte ich sie für eine spannende Perspektive, die man meist nicht einnimmt. Häufig macht sich eher das schlechte Gewissen breit, nicht ausreichend (Bücher) zu lesen. Des Weiteren spricht Lustlab davon, dass unsere Erwartungen an den Wandel und die Technologie sehr zwiespältig sind: Zum einen möchten wir, dass uns Aufgaben abgenommen werden und vieles automatisiert wird, andererseits fordern wir die Fähigkeit der Individualisierung.2

Mitten im Wandel

Diese Massen-Individualisierung nimmt auch Stauch in ihrem Essay auf. Diesen Punkt erwähne ich vor allem deshalb, weil sich eine Generation und ein Zeitgeist häufig erst rückblickend sehen und verstehen lässt. Zwar kennen wir alle die Bewegungen der letzten Jahre, doch scheint das Ausmaß dieses Wandels erst aufgezählt und niedergeschrieben an Gewicht zu gewinnen.
Sie spricht davon, dass sich die kreative Avantgarde, die junge Generation, kritisch auflehnt und eine Haltung des Anti-Establishment einnimmt. Wie sie recyclebares Design entwickelt, Objekte reparieren möchte anstelle sie wegzuschmeißen. DIY und alte Handwerkskunst werden wieder beliebt, Open-Source-Projekte, Co-Working und File Sharing sind weit verbreitet. Es gibt urbane Guerilla-Aktionen, Flashmobs und vieles mehr, was uns als Designer dazu zwingt, Dinge zu überdenken, uns selbst neu zu positionieren und das wahre Potential des offenen und kritischen Denkens in unsere Arbeitsmethoden einfließen zu lassen.3
Des Weiteren spricht sie sinngemäß davon, dass die Aufgabe des Designers viel weiter geht als die des reinen »Aufhübschens«: Neben Themen wie Nachhaltigkeit (Umweltverträglichkeit, Lebenszyklen oder Materialität), reflektieren wir die Usability und Nutzerfreundlichkeit interaktiver Produkte und sollten neben dem technischen Verständnis bestenfalls noch Kenntnisse über Psychologie oder Soziologie mitbringen.4 Zwar bestand die Arbeit des Designers noch nie aus reinem Aufhübschen, doch die Themenfelder scheinen aus meiner Sicht zu wachsen und komplexer zu werden.

Stauch versucht damit die aktuelle Lage zu reflektieren, in der wir im »globalen Dorf« in einer Zeit des Teilens und der Gemeinschaft leben, selbst wenn es sich häufig nicht so anfühlt. Es ist ein Wandel im Gang und die Themengebiete der Designarbeit sind sehr komplex und unheimlich spannend. Es stehen jede Menge Möglichkeiten offen und es ist viel Platz und Bedarf für Innovationen, um diesen Wandel sowohl zu bewerkstelligen als auch weiterzutreiben.

Quellen
  1. Vgl. Lustlab: »The end of the word as we know it«, in: Junge, Barbara; Eds.: Zane, Berzina; Scheiffele, Walter; Westerveld, Wim; Zwick, Carola, »The digital turn – Design in the Era of Interactive Technologies«, Berlin 2012, S. 13.
  2. Vgl. Ebd., S. 15.
  3. Vgl. Stauch, Susanne: »Digital Culture: From open design to creating your own future«, in: Junge, Barbara; Eds.: Zane, Berzina; Scheiffele, Walter; Westerveld, Wim; Zwick, Carola, »The digital turn – Design in the Era of Interactive Technologies«, Berlin 2012, S. 263.
  4. Vgl. Ebd.

Alles nur geklaut

Das Buch »Alles nur geklaut« von Austin Kleon gehört zwar nicht konkret in die Recherche meiner Master-Arbeit. Da es jedoch viel über die generelle Arbeit als Kreativer erzählt, sollte es einen Platz in meiner Dokumentation finden.

Das Buch »Alles nur geklaut« von Austin Kleon gehört zwar nicht konkret in die Recherche meiner Master-Arbeit. Da es jedoch viel über die generelle Arbeit als Kreativer erzählt, sollte es einen Platz in meiner Dokumentation finden. Die Ideen sind zwar nicht bahnbrechend, aber bei manchen Dingen hilft es, sie einfach schwarz auf weiß zu lesen.

In 10 Kapiteln durchgeht der Autor »10 Wege zum kreativen Durchbruch«, wobei mir drei Essenzen aus dem Buch besonders hängen geblieben sind.

Die Klaukartei

Die Klaukartei ist an sich nichts Neues. Die einen nennen sie Ideenbox, die anderen ordnen sie in digitale Ordner namens »Inspiration«, wieder andere kategorisieren alles fein säuberlich auf Pinterest-Pinnwänden.
Kleon beschreibt die Klaukartei als Kartei, in der alles Platz findet, was geklaut werden muss oder einen inspiriert.1 Unter klauen versteht er jedoch nicht ein reines Klauen, sondern eher ein Ausschau halten und sich von Dingen inspirieren lassen, um sie weiterzuentwickeln.

Besonders gut gefällt mir daran die beruhigende Tatsache, die jeder kennt und dennoch im Alltag vergisst: Wir können das Rad nicht neu erfinden! Keine Design-Arbeit, keine Kunst-Arbeit – nichts entsteht aus dem Nichts.

Einfach machen

Kleon schreibt, dass er noch immer dasitzen würde, um herauszufinden, wer er ist, wenn er gewartet hätte, bis ihm klar wäre, wer oder was er ist.2
Einfach machen lautet die Devise. Wir alle haben manchmal Ängste oder sind in unserer Arbeit gehemmt. Vor allem während des Masters führe ich das darauf zurück, dass man nicht konkret weiß, worauf man hinarbeitet und ob das einen Wert hat. Es ist keine Aufgabe, die es einfach zu erledigen gilt. Die Aufgabe ist der Prozess an sich und diesen auch auszuhalten. Zwar ist die Designarbeit immer sehr prozessgerichtet und man weiß häufig nicht, was am Schluss herauskommt. Aber bei Aufgaben, wie die Gestaltung von Visitenkarten, Flyern oder ähnlichem hält sich das doch eher in Grenzen, weil das Ziel klar ist. Anders verhält es sich mit Aufgaben, die erst durch den Prozess wachsen. Obwohl man häufig erfolgreich durch solche Prozesse läuft, sei es in intensiven Arbeitsphasen, Blockseminaren oder anderen Projekten, bei denen man erstmal ins Schwammige arbeitet, fällt es immer wieder schwer sich darauf zu verlassen. Mit viel Arbeitseinsatz wird am Ende schon alles gut.

Langweiler!

Der Autor beschreibt, was für ein langweiliger Typ er ist und dass er in einer ruhigen Nachbarschaft mit der Familie lebt.3 Er beschreibt, dass man stets auf sich selbst achten soll und das halte auch ich für einen sehr wichtigen Punkt. Wir als Kreative neigen dazu viele Überstunden zu machen und in die Nacht zu arbeiten. Alles für den Spaß und schließlich ist es ja auch Hobby und Leidenschaft und ja es soll auch was gutes dabei rauskommen. Aber: Es tut manchmal auch gut ganz in geordneten Strukturen zu arbeiten, die einem Halt geben und nicht so viel Energie kosten.

Quellen
  1. Vgl. Kleon, Austin: »Alles nur geklaut – 10 Wege zum kreativen Durchbruch«, München 2013, 3. Auflage, S. 30.
  2. Vgl. Ebd., S. 35.
  3. Vgl. Ebd., S. 127.

Mehr Substanz auf der Web-Bühne

Es wird deutlich, dass das World Wide Web neue Möglichkeiten bietet, die dem einzelnen mit wenig Aufwand erlauben, eine gute Idee als Royal Flush auszuspielen. Der Kern der Sache ist für mich nicht die Frage, welches Unternehmen es durch das World Wide Web »geschafft« hat, sondern was diese durchaus noch junge Welt für nachkommende Kommunikationsdesigner bereit hält. Mit Köpfen voller Ideen, einem ästhetischem Grundverständnis Informationen zu vermitteln sowie dem nötigen Handwerkszeug scheint es die perfekte Ausgangslage zu sein.

Wie die Autoren von »Staatsfeind WikiLeaks« (Der unvollkommene Kreis ») stellt auch Andrew Keen in »Das digitale Debakel« fest, dass zwischenzeitlich kleine Gruppen die Macht über viele Menschen erlangen können.1 Während es bei WikiLeaks um Aufklärung und einer daraus resultierenden politischen Machtstellung geht, spricht Keen primär von finanzieller Macht oder unverhältnismäßiger Verteilung, die – aus meiner Sicht – durch z. B. Lobbyismus wieder in politische Macht mündet.
So beschäftigte beispielsweise WhatsApp vor dem 19-Milliarden-Dollar-Verkauf an Facebook lediglich um die 50 Mitarbeiter2 und dass Google mehr oder minder aus dem nichts in einer Garage entstanden ist, ist auch bekannt. Kleine gute Ideen werden riesig. Nur zum Vergleich: Die Daimler-AG erzielte 2014 einen Umsatz von ca. 130 Mrd. € – mit rund 280.000 Mitarbeitern.3 Wer in den gesellschaftlichen Köpfen eine größere Rolle spielt, soll jeder für sich entscheiden.
Für mich gibt es kaum etwas Langweiligeres als Zahlen oder generell Finanzen und als Laie vermische ich sicher Zahlen, die so nicht zueinander gehören. Ein Superpro wird sicher Gegenbeispiele finden und weder beruhigend noch beunruhigend ist, dass die mächtigsten Konzerne der Welt nicht Google, Facebook oder Apple heißen4. Dennoch gehört Google zu den ersten Unternehmen dieser »neuen Kategorie«, die laut Keen ihren »wirtschaftlichen Wert im Netz selbst« beherbergen.5

Nichts als Applaus für neue Ideen

Es wird in jedem Fall deutlich, dass das World Wide Web neue Möglichkeiten bietet, die dem einzelnen mit wenig Aufwand erlauben, eine gute Idee als Royal Flush auszuspielen. Der Kern der Sache ist für mich deshalb nicht die Frage, welches Unternehmen es durch das World Wide Web »geschafft« hat, sondern was diese durchaus noch junge Welt für die kommende Generation der Kommunikationsdesigner bereit hält. Mit Köpfen voller Ideen, einem ästhetischem Grundverständnis, Informationen zu vermitteln sowie dem nötigen Handwerkszeug scheint es die perfekte Ausgangslage zu sein.
Doch während unter vorgehaltener Hand versprochen wird, dass man mit einem guten Einfall so ziemlich jeden und alles erreichen kann, weiß man, dass aus den 15 Minuten Ruhm längst nur noch Millisekunden auf Pinterest-artigen Design-Blogs übrig geblieben sind – auf denen eine Idee nur noch der nächsten ähnelt.
In der Zukunft wird die Arbeit vielleicht mit Bitcoins belohnt, als Gegenwert regnet es heute selten Geld. Im Moment kann man die Web-Bühne häufig mit einem Applaus aus Likes, Retweets oder Pins verlassen. Wir verkaufen uns für billige Referenzen, verwechseln Likes mit ernst gemeinter Kritik und ich frage mich, wie ehrlich und vor allem wie wirklich das ganze Rumgeeier sein kann und zukünftig sein soll. Die alltägliche Arbeit mit realem Feedback und Kundenkontakt wirkt für mich substantieller als die Zur-Schau-Stellung im WWW. Sicher gibt es Plattformen, auf denen man sich schon jetzt ernsthaft bewegen kann und denen man sich aus meiner Sicht nicht grundsätzlich verschließen sollte. Doch eine Frage, die mich momentan beschäftigt ist, wie man zukünftig mehr Substanz und Vertrauen auf die große Web-Bühne bringen kann.

PS: Wenn wir schon mal bei vielen Zahlen waren, die nicht so ganz zusammen passen, dann noch was:
Berechne wieviel deine Daten im Internet wert sind: Financial Times-Rechner.

Quellen
  1. Vgl. Keen, Andrew: »Das digitale Debakel: Warum das Internet gescheitert ist – und wie wir es retten können«, München 2015, S. 20.
  2. Vgl. Bernau, Patrick: »19 Milliarden sind gar nicht so viel«, Stand: 20.2.2014, URL: http://www.faz.net/aktuell/wirtschaft/netzwirtschaft/der-facebook-boersengang/whatsapp-uebernahme-19-milliarden-sind-gar-nicht-so-viel-12811384.html, abgerufen am 6.11.2015.
  3. Vgl. Unternehmensvorstellung Daimler AG, URL: http://www.daimler.com/unternehmen, abgerufen am 6.11.2015.
  4. Vgl. Fehling, Jonas: »Diese 35 Firmen kontrollieren die Welt«, Stand: 18.6.2014, URL: http://www.focus.de/finanzen/news/das-netzwerk-der-macht-diese-konzernen-kontrollieren-die-welt_id_3929949.html, abgerufen am 6.11.2015.
  5. Keen, Andrew: »Das digitale Debakel: Warum das Internet gescheitert ist – und wie wir es retten können«, München 2015, S.76.

Schneller, als man als Mensch begreifen kann.

Kein »außen« und »innen«. Wir sind mittendrin und Teil vom ganzen. Doch die Technologie scheint sich schneller zu entwickeln, als wir wirklich begreifen können. Verlieren wir das Rennen? Ist es überhaupt ein Rennen?

Wir versuchen oft von »außen« auf die »digitale, vernetzte Welt« zu blicken. Wir leben in der Realität, dort im World Wide Web verlieren wir uns. Wir leben hier in der Gemeinschaft, dort verlieren sich die Menschen hinter Smartphones und Tablets. Dabei sind wir mittendrin – nicht außen, nicht innen. Wir sind Teil vom Ganzen und das Ganze Teil von uns.

Wie das Buch, gehört dieses Ding namens World Wide Web nun zu unserer täglichen Medienrealität, wenn auch mit noch weitreichenderen Konsequenzen. Sicher verändert es unsere Welt und unser Leben: Vor allem der Generation, die nicht mit zehn Jahren stolzer Smartphone-Besitzer war, fällt es scheinbar schwer sich vollständig darauf einzulassen. Aber was bringt es dem »neuen Medium« (,das dazu gar nicht mehr so neu ist) ständig mit höchster Kritik zu begegnen? Ich spreche nicht davon unkritisch zu sein und alles tatsächlich schlechte so hinzunehmen wie es ist. Sondern von der Möglichkeit angemessen darauf zu reagieren, etwas zu verbessern und den Umgang zu erleichtern. Denn wenn auch nicht neu: Das Medium ist jung. Und es scheint sich noch immer schneller zu entwickeln, als man es als Mensch begreifen kann. Für uns als Designer stehen in jedem Fall große Aufgaben bereit.

Erste Fragestellung meiner Master-Arbeit

Wie beeinflusst die Digitalität im Allgemeinen die Menschen? Welche neue Gestaltungsmöglichkeiten, -prozesse und -formen entwickeln sich für den Gestalter? Im folgenden sind die ersten Fragestellungen zu meiner Master-Arbeit zu finden. Dabei betrachte ich die Fragestellung nicht als feste Hypothese, sondern als ersten Anhaltspunkt meiner Recherchen.

In meiner Master-Arbeit möchte ich mich mit der Frage auseinandersetzen, inwiefern und inwieweit das Internet und die Digitalität im Allgemeinen die Gesellschaft beeinflusst und wie der Gestalter rückwirkend in seiner Arbeit beeinflusst und gefordert wird.

Zum einen interessieren mich dabei ästhetische und gestalterische Aspekte.
Eine zentrale Frage ist, wie sich Webdesign verändert hat, verändern kann und wird. Dabei steht eine Analyse der gestalterischen Mittel im Webdesign im Vordergrund – mit dem Ziel die Veränderungen der letzten Jahre und Jahrzehnte herauszufiltern und aktuelle Trends zu erkennen. Auch technische Innovationen sind hier die Grundlage der Arbeit als Webdesigner.

Zum anderen soll ein Fokus auf die generelle Arbeit des Gestalters gelegt werden.
Non-Profit-Organisationen wie z. B. Creative Commons können zwar einerseits als Konkurrenz angesehen werden. Andererseits werden sie – zukünftig sicher an Qualität gewinnend – vielleicht sogar die Basis, noch komplexere und konzeptionell stärkere Projekte durchführen zu können. Einen spannenden Versuch finde ich hierbei, wie qualitativ hochwertig schon heute Projekte sein können, die ausschließlich auf den Creative Commons basieren.

Des Weiteren stellt sich für mich die Frage, wie sich die Aufgaben eines Webdesigners/-programmierers in Zukunft verschieben. Versuche wie Adobe Dreamweaver, Muse oder „Homepage-Baukästen“ wie z. B. wix, nämlich Webseiten ohne tiefergreifende Gestaltungs- oder Programmierkenntnisse publizieren zu können, werden sicher ausgebaut und optimiert. Ist auch hier eine Konkurrenz zu sehen oder die Chance, noch fokussierter in anderen Bereichen – wie z. B. in der Konzeption – einzusteigen? Ist die generelle Herausforderung nicht der – ohnehin schon im Printbereich geforderte – Anspruch an Professionalität?