{"id":9767,"date":"2016-12-08T10:00:22","date_gmt":"2016-12-08T09:00:22","guid":{"rendered":"https:\/\/www.viaprinto.de\/blog\/?p=9767"},"modified":"2016-12-08T10:00:22","modified_gmt":"2016-12-08T09:00:22","slug":"flatdesignwurzeln","status":"publish","type":"post","link":"https:\/\/www.viaprinto.de\/blog\/flatdesignwurzeln\/","title":{"rendered":"Die Wurzeln des Flat Design."},"content":{"rendered":"

Das Prinzip Vereinfachung<\/strong><\/p>\n

Das Flat Design hat mehr Einfachheit in Drucksachen, Illustrationen und Webprojekte gebracht. Dies bezieht sich konkret auf zwei Aspekte: Flat Design ist in der Onlinewelt in Form von datenm\u00e4\u00dfig kleinen Grafiken entstanden, die sich in CSS beschreiben lassen. CSS (Cascading Style Sheets), <\/em>ist die Bezeichnung einer Programmier-Script-Sprache. Das hei\u00dft: Die Punkte der Au\u00dfenkonturfl\u00e4chen lassen sich \u00fcber Koordinaten definieren. Eine grafische Fl\u00e4che wird so zur mathematischen Form. Dies hat seinen Vorl\u00e4ufer in den Vektorgrafiken, die z.B. mit Adobe Illustrator erstellt werden k\u00f6nnen. Flat Design als fl\u00e4chige Gestaltung hat au\u00dferdem zu einer Neu-Besinnung auf visuelle Klarheit und Schn\u00f6rkellosigkeit gef\u00fchrt.<\/p>\n

\"Eine<\/a>
Eine fl\u00e4chige Illustration mit wenigen Farben aber einigen Details.
\u00a9Ralf Wasselowski<\/figcaption><\/figure>\n

 <\/p>\n

\"Dieselbe<\/a>
Dieselbe Illustration etwas vereinfacht und mit ausschlie\u00dflich geraden Linien. \u00a9Ralf Wasselowski<\/figcaption><\/figure>\n
\"Die<\/a>
Die Fl\u00e4chen wurden weiter vereinfacht, die Anzahl der Farben und Fl\u00e4chen reduziert. \u00a9Ralf Wasselowski<\/figcaption><\/figure>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

Von der Onlinewelt in die Welt der Drucksachen<\/strong><\/p>\n

Bevor das Web ein zentrales kommunikatives Medium geworden war, waren Corporate-Design-Richtlinien ausschlie\u00dflich bezogen auf Drucksachen entwickelt worden. Sp\u00e4ter wurden Gestaltungsrichtlinien, die f\u00fcr Webseiten galten, auch auf das Erscheinungsbild der Drucksachen \u00fcbertragen. Beispielsweise kennt jeder das Corporate Design von Google aus dem Internet. Aber kaum jemand wei\u00df, dass auch die Google-Drucksachen nach den Designrichtlinien gestaltet werden, die f\u00fcr das Web entwickelt wurden. Die klaren, farbigen Balken von Google online finden sich in den Drucksachen wieder. In Sachen Designstil bezieht sich das Flat Design auf eine aufger\u00e4umte \u00fcbersichtliche Gestaltung mit wenigen dominanten Gestaltungselementen und schn\u00f6rkellosen, klaren Groteskschriften (serifenlose Schriften).<\/p>\n

Flat Design als neuer Minimalismus<\/strong><\/p>\n

Flat Design steht in direktem Zusammenhang mit den Aspekten „Visuelle Informationsreduktion“ und „Formen-Abstraktion“. Je mehr es die moderne Informations-Gesellschaft mit einer zunehmenden Informations\u00fcberflutung zu tun hat, desto wichtiger wird andererseits Informationsreduktion. Es geht dabei ganz allgemein darum, Wichtiges und Zentrales von Unwichtigem und Nebens\u00e4chlichen zu trennen. Ein klares, \u00fcbersichtliches Grafik-Design, das den Sehgewohnheiten Rechnung tr\u00e4gt, erleichtert dies. Zudem geht es darum, Information schneller wahrnehmbar zu machen, damit man sich im Informationsdschungel zurechtfindet. Beim Illustrieren w\u00fcrde das bedeuten, im Idealfall anstatt vieler Striche und komplizierter Konturen wenige Striche und einfache Konturen einzusetzen. Oder: Ganz auf Striche zu verzichten und nur Fl\u00e4chen zu verwenden. Das Flat Design ist immer weiter gegangen, indem es diese wenigen Fl\u00e4chen auch noch winklig-geometrisch konstruiert hat. Hinzu kamen exakt waagerechte und senkrechte Au\u00dfenkonturen, feste Winkelungen und mitunter weniger Kurven in den Konturen. Auch die Schattenw\u00fcrfe des Longshadow-Design-Stils<\/a> folgen einem vereinfachten Schema. Ein Teil des illustrativen Flat Designs wirkt gar wie reiner Kubismus, der einst in der Malerei organische Formen geometrisiert und visuell in stark vereinfachte Winkel- und Kreisfl\u00e4chen \u00fcbersetzt hatte.<\/p>\n

Prinzipien der Logoentwicklung auf das Flat Design \u00fcbertragen<\/strong><\/p>\n

Das Flat Design steht in der Tradition und unter dem Einfluss verschiedener Gegebenheiten. Immer schon ging es im Grafik Design darum, eine originelle, wiedererkennbare Formensprache zu entwickeln. Das bezieht sich auf Farben, Schrifteinsatz, Proportionsregeln f\u00fcr die Gestaltung, vor allem aber auf die Gestaltung illustrativer Elemente. Zu den illustrativen Elementen z\u00e4hlen auch Logos und Key Visuals.<\/p>\n

Das Logo als Bildmarke ist immer schon eine extreme Stilisierung und Vereinfachung gewesen. Das hatte in den Anfangstagen des Grafik-Designs technische und finanzielle Gr\u00fcnde. In den Tagen des Buchdrucks konnten Fl\u00e4chen gut wiedergegeben werden, Tonwerte, Verl\u00e4ufe und r\u00e4umliche Darstellungen waren nicht so einfach zu realisieren wie heute im Offsetdruck. W\u00e4hrend heute die Vierfarbigkeit zum Standard geworden ist, schlug fr\u00fcher jede Farbe mehr deutlich zu Buche. Deswegen waren Logos oft fl\u00e4chig oder linear angelegt, enthielten aber kaum visuelle R\u00e4umlichkeit, und sie waren maximal zweifarbig.<\/p>\n

Nach der Computerisierung und der Digitalisierung der Druckvorstufe waren Schattierungen, 3D-m\u00e4\u00dfig wirkende Darstellungen oder Verl\u00e4ufe m\u00f6glich und zogen in die Logogestaltung ein. Ob Apple, BMW, Mercedes oder ThyssenKrupp – alle redesignten ihre Firmenlogos im Hinblick auf eine r\u00e4umlich wirkende Darstellung. Das danach aufkommende Flat Design ist als Gegenbewegung zu verstehen, die sich auf die urspr\u00fcnglichen Anspr\u00fcche des Grafik-Designs besonnen hat: Klarheit, Pr\u00e4gnanz, Minimalismus – f\u00fcr eine Welt, die in Informationen ertrinkt.<\/p>\n

Die Vektorgrafik erm\u00f6glicht neue Design-Ans\u00e4tze<\/strong><\/p>\n

Das Flat Design stand also in einer Tradition der visuellen Vereinfachung, die man auch schon in den 1950er- und 1960er-Jahren verst\u00e4rkt gerade im deutschen und schweizerischen Grafik-Design fand. Neu ist der Vereinfachungsgedanke des \u201cWeniger ist mehr\u201d also nicht. Doch es kam technologisch etwas anderes hinzu: die Vektorgrafik. Dies ist die konturenbasierte und mathematisch beschreibbare Konstruktion und Zeichnung von Fl\u00e4chen. W\u00e4hrend die Computergrafik der Anfangstage pixelbasiert war, konnten mit der Software Adobe Illustrator Konturen angelegt und auch nachtr\u00e4glich \u00fcber Kurvenpunkte mit ihren Anfassern zur Kurvenmanipulation ge\u00e4ndert werden. Danach konnten Konturen fl\u00e4chig oder mit Verl\u00e4ufen gef\u00fcllt werden. Die Vektorgrafik ist grunds\u00e4tzlich exakt und \u201cglatt\u201d. Sie hat die Tendenz zur Fl\u00e4chigkeit, auch wenn die Vektorgrafiken der Anfangstage vor Verl\u00e4ufen nur so strotzten.<\/p>\n

Das Zeichnen mit Vektoren hat drei Teilaspekte<\/strong><\/p>\n

    \n
  1. Die \u00c4sthetik<\/em><\/strong> glatter reduzierter Formen.<\/li>\n
  2. Die Ergonomie<\/em><\/strong> der Vektorsoftware, weil sowohl mit einem Tablet relativ traditionell gezeichnet werden kann aber auch direkt am Bildschirm gezeichnet bzw. konstruiert wird. Dies leistet einer geometrisch-konstruktiven Gestaltung Vorschub.<\/li>\n
  3. Die Datentechnik,<\/em><\/strong> weil sich Vektoren grunds\u00e4tzlich von Pixeln unterscheiden. Die nummerische Kontrolle der Anfasser- und Kurvenmodulationspunkte in der Vektor-Software setzt sich inzwischen auch in der CSS3-Webprogrammierung fort. Dort k\u00f6nnen unter Eingabe von Koordinatenwerten und Modulationsziffern Illustrationen „programmier-gezeichnet“ werden. Dies ist ein illustrativer Trend, der Dateigr\u00f6\u00dfen reduziert. Vektorgrafiken mit wenigen, einfachen Fl\u00e4chen sind auch in der Druckvorstufe erheblich kleiner als Pixelbilder.<\/li>\n<\/ol>\n

    FAZIT<\/p>\n

    Flat Design ist im Spannungsfeld zwischen \u00c4sthetik und Technik entstanden. In seinen extremsten Vereinfachungen wirkt es oft technoid. Denkbar wurde ein fl\u00e4chendeckendes Flat Design erst durch die Computerisierung und vor allem durch die Vektorgrafik, wie sie Adobe Illustrator, die Freeware Gimp oder Corel Draw bieten.<\/p>\n<\/blockquote>\n

    \n

    SERVICE<\/p>\n