Flaches Design ist überall

Wer mit aufmerksamen Blick für das Visuelle durch die Welt geht, dem wird der anhaltende Trend zum flachen Design nicht verborgen geblieben sein. Allen, die wichtigere Dinge im Kopf behalten müssen (Finanzkrise, Steuererklärung, Kinder vom Kindergarten abholen), sei hiermit mitgeteilt: die Tage der quietsch-bunten Buttons, aufdringlichen Schlagschatten und texturlastigen Oberflächen im Web sind gezählt. Die Designsprache von Webseiten und Apps wird in Zukunft minimalistischer, reduzierter und zweidimensionaler. Und das ist auch gut so.

Beispiele, bitte!

Schauen wir uns für einen Moment Apples mobiles Betriebssystem an. Wenn iOS7 diesen September auf den Markt kommt, werden sich nicht wenige Nutzer verwundert die Augen reiben: die vertraute Oberfläche des iPhones wird dann optisch aufgeräumter und ungewohnt luftig daher kommen. Strukturen aus dem „echten Leben“, wie Filz oder Leder, wird man dann vergeblich suchen. Apple wagt damit einen durchaus radikalen Bruch mit einem vertrauten und am Markt akzeptierten Interfacedesign. Die Frage ist: warum?

Vorreiter dieser Entwicklung ist interessanterweise Microsoft. Der Softwarekonzern aus Redmond – sonst eher nicht als Trendsetter bekannt – hat mit „Metro UI“ eine Designsprache entwickelt, die ganz bewusst mit bestehenden Konventionen bricht. Prägend für das in Windows 8 verwendete Interface sind die bunten Kacheln, die auf sonst gängige Farbverläufe verzichten. Und Icons, die farblich und stilistisch auf das Nötigste reduziert sind. Das ist zunächst einmal ungewohnt, funktioniert aber überraschend gut.

Was genau ist Flaches Design?

Fassen wir kurz zusammen: Flaches Design ist eine simplistische Designsprache, die auf herkömmliche dreidimensionale Effekte bewusst verzichtet. Also keine Schlagschatten oder abgeflachte Kanten, die Tiefe suggerieren sollen. Nach Möglichkeit keine barocken Verzierungen oder Ornamente. Und keine Texturen wie zerknülltes Papier oder Schiefertafeln als Hintergrund. Flaches Design ist absichtlich zweidimensional und auf das Wesentliche reduziert. Hinzu kommt ein Fokus auf meist serifenlose Typographie in UltraLight, also dünner Text ohne Schnörkel. Dieser wird gerne großflächig und mit viel Weißraum eingesetzt, gelegentlich auch als Navigationselement.

Ich habe Tasten, ich bin ein Taschenrechner

Das ist durchaus ungewöhnlich und einen kurzen Exkurs wert. Geprägt wurden die letzten Jahre nämlich von einem Trend, der auf den wenig einprägsamen Namen Skeuomorphismus hört. Skeuomorphismus ist nicht nur das am schwierigsten auszusprechende eingedeutschte Wort seit Paraskavedekatriaphobie, sondern bezeichnet darüber hinaus auch eine Stilrichtung, bei denen Objekten das Material oder die Form eines älteren, vertrauten Gegenstandes mit auf den Lebensweg gegeben wird. Im Interface-Design führt das dazu, dass ein digitaler Kalender wie ein analoger Kalender aussieht. Oder eine Notiz-App einen gelben Hintergrund mit roten Linien verpasst bekommt. Diese stilistischen Elemente erfüllen keine direkte Funktion sondern sollen in erster Linie Vertrautheit herstellen: Schau, ich habe Tasten, ich bin ganz offensichtlich ein Taschenrechner.

Schau, Mama, keine Hände

Skeuomorphismus fällt also die Aufgabe zu, dem Nutzer auf dem Weg von der kohlenstoffbasierten Welt ins digitale Neuland die Hand zu reichen. Apple hat dieses Stilmittel in der Vergangenheit ganz bewusst eingesetzt, um breite Benutzergruppen an digitale User Interfaces zu gewöhnen. Doch brauchen wir das heute noch? Seit der Einführung des iPhones sind sechs Internetjahre ins Land gegangen (also etwa 600 Menschenjahre). Der Blogger John Gruber meint, wir könnten die Stützräder langsam abschrauben:

„The primary problem Apple faced with the iPhone in 2007 was building familiarity with a new way of using computers. That problem has now been solved. It is time to solve new problems. The training wheels can now come off.“

Das Pendel schlägt zurück

Apple hat es zuletzt mit dem Einsatz skeuomorphischer Elemente vermutlich etwas übertrieben (wirklich, grüner Filz?). Und auch an einem anderen Trend haben wir uns 2013 gründlich satt gesehen: die Designelemente des Web 2.0 – also Buttons, die so haptisch wirken, dass man sie unbedingt drücken muss und Störer, die man wie zuckersüße Lollis einfach abschlecken will – sind so 2004. Der Trend zum flachen Design ist natürlich auch eine Gegenbewegung zu einem Design-Trend, der zuletzt zu barock, zu kitschig und zu grell geworden ist. Auf ein Jahrzehnt der Opulenz folgt nun ein Jahrzehnt der Reduzierung.

Historische Vorläufer

Flat Design ist nicht ohne historische Vorläufer. Zu nennen ist an dieser Stelle natürlich das Bauhaus, der Geburtsort der Klassischen Moderne. In den 1920ern wurde in Dessau eine vollkommen neuartige Formensprache in Architektur, Kunst und Design entwickelt, die den ornamentalen Ballast der vorigen Jahrzehnte über Bord warf. Der Schweizer Stil, der in den 50er Jahren mit Groteskschriften und großzügigen Weißräumen die Design-Welt revolutionierte, prägt heute insbesondere die Typographie des Flat Designs. Und nicht wenige Beobachter fühlen sich bei den neuen flachen Icons an den legendären deutschen Gestalter Otl Aicher erinnert, der mit seinen reduzierten Piktogrammen für die Olympischen Spiele 1972 in München ikonographische Maßstäbe setzte.

Vorteile von Flat Design

Flaches Design ist also ein Trend, und Teil einer längerfristigen Entwicklung des Mediums. Es ist definitiv mehr als eine Mode und hat inhärente Vorteile, die wir im Folgenden kurz in den Blick wollen: Eine Reduktion auf das Wesentliche ermöglicht eine klarere Kommunikation. Wenn alle Elemente grell sind und blinken, kann man die Aufmerksamkeit des Benutzers nicht steuern. Ein flaches Design hingegen – mit z.B. einer herausstechenden Signalfarbe für den Kaufen-Button – lenkt den Blick sofort auf dieses Element. Mit dem flachen Design verbunden ist auch eine Rückbesinnung auf bewusst eingesetzte Typographie. Das ist sinnvoll in einem Medium, dass trotz aller Multimediaaspekte dem Text mehr verbunden ist, als etwa das Fernsehen. Flaches Design verträgt sich gut mit responsiven Webseiten und harmonisiert besser mit den visuellen Eigenheiten der unterschiedlichen Betriebsysteme. In vielerlei Hinsicht ist flaches Design eine dem Medium besser angepasste Formensprache.

Nachteile von Flat Design

Natürlich gibt es auch Nachteile, die hier nicht verschwiegen werden sollen. Es ist definitiv ein Bruch mit Konventionen und das schmeckt nicht jedermann. Ganze Webseiten müssen umgestellt, Styleguides neu geschrieben werden. Gerade wer dem Digitalen nicht so zugetan ist, schätzt unter Umständen die digitalen Referenzen an die alte Welt. Ein minimales Design kann auch leicht langweilig wirken.

Nearly Flat

Nicht zuletzt deswegen wird es zu Mischformen kommen. Apples iOS 7 ist bei näherer Betrachtung gar nicht so flach, wie es zunächst scheint. Es gibt flache Ebenen, die sich über andere flache Ebenen legen und so ein Gefühl der Tiefe schaffen. Auch im Web Design wird z.B. mit Parallax Scrolling gearbeitet, um optische Tiefeneffekte zu schaffen, die gut mit einem ansonsten flachen und minimalen Stil korrespondieren. Flaches Design ermöglicht uns, neu über das Medium nachzudenken, überkommene Metaphern in den Ruhestand zu schicken und neue Bedienkonzepte zu entwickeln. Wo die Reise hingeht, ist offen – aber eines ist klar: auch im flachen Design gibt es Höhen und Tiefen.

Weiterführende Links zum Thema Flat Design

• Apple hat geschlafen
  Die Sueddeutsche hat ein Interview mit dem Designer Philipp Joyce zu Apples neuem Design für iOS 7 geführt.
• Flat and Thin are in
  Article by Adam Tayler in Smashing magazine about the flat design trend and how we got here.
• Flat Pixels
  Wonderfully comprehensive article by Sacha Greif on the battle between Flat Design and Skeuomorphism.
• Is the new Apple iOS 7 look an improvement?
  I especially enjoyed David Coles assessment of iOS 7 over at Quora. He states that the move to flat screens actually affords a ramp up in dimensionality.
• Themenseite Flat Design bei t3n
  Das t3n Magazin hat eine eigene Themenseite, auf der alle Artikel zu Flat Design gesammelt präsentiert werden.