Spaces. Smartes Cloud Hosting für anspruchsvolle Webprojekte. Loslegen und Spaces testen. Von Mittwald.
Dieter Petereit 19. April 2019

Mal was anderes: Mondrianismus im Webdesign

Kennst du Mondrian? Nein, wirst du ver­mut­lich sagen. Das ist unwahr­schein­lich. Zumindest sein Kunststil wird dir bekannt vor­kom­men. Schau selbst.

Der Namensgeber: Piet Mondrian

Piet Mondrian war ein nie­der­län­di­scher Maler und Erfinder des Neo-Plastizismus, einer Kunstform, der er nahe­zu reli­giö­sen Status zuschrieb. Mondrian gehör­te zu den Begründern der abs­trak­ten Malerei und inspi­rier­te etwa Walter Gropius zur Erfindung des welt­be­rühm­ten Bauhaus-Architekturstils.

Mondrians mosa­ik­ar­ti­ge Malereien hast du mit Sicherheit schon gese­hen. Dieses Werk etwa heißt “Komposition mit Rot, Gelb, Blau und Schwarz” und stammt aus dem Jahre 1921.

Piet Mondrian [Public domain], via Wikimedia Commons

Etwa seit Anfang der Zwanziger bis zu sei­nem Tode im Jahre 1944 wid­me­te sich Mondrian die­ser Konzentration auf Primärfarben und kla­re Linien. Seine Formensprache inspi­riert Künstler, aber auch Architekten bis zum heu­ti­gen Tage.

Mosaik als Gestaltungsraster

Mosaikartige Gestaltungsraster bie­ten sich indes nicht nur in der Architektur an, auch im Design zumeist recht­ecki­ger Medien, wie Bildschirmen, erreichst du per Mosaik die bes­te Ausnutzung des vor­han­de­nen Raums. So ist es kein Wunder, dass sich Screendesigner Inspiration beim nie­der­län­di­schen Neo-Plastizisten holen.

Das Konzept der unter­schied­li­che Kachelung des Bildschirms griff zunächst Microsoft für sein mobi­les Betriebssystem auf und wei­te­te es spä­ter auf die Desktop-Variante aus. Metro-Design, spä­ter in Modern Design umbe­nannt, reprä­sen­tier­te eine Benutzeroberfläche, die als Mosaik ange­legt war. Je grö­ßer die Kachel zur jewei­li­gen Interaktion war, des­to wich­ti­ger war sie ent­we­der für den Benutzer oder die Funktionalität im Allgemeinen.

Dabei konn­te es durch­aus auch zu star­ker farb­li­cher Kontrastierung der ein­zel­nen Kacheln zuein­an­der kom­men. Zwingender Bestandteil des Konzeptes war das, anders als bei Mondrian, aller­dings nicht.

Mondrianismus als Design-Stil

Es bedarf im Grunde kei­ner nähe­ren Erläuterung, war­um sich Mondrians Strukturkonzept auch für das Design von Websites anbie­tet. Gerade in Zeiten respon­si­ver Websites und des Box-Modells von CSS, in jün­ge­rer Zeit durch Features wie Flexbox und CSS Grid pro­mo­tet, ist das Mosaik fast schon das logi­sche Gestaltungsmodell.

Wenn wir nun kache­li­ge Designs mit Animationen ver­bin­den, die sich in recht­eckig abge­grenz­ten Bildschirmbereichen natür­lich beson­ders gut iso­lie­ren und somit gezielt anwen­den las­sen, kön­nen dabei beein­dru­cken­de Layouts ent­ste­hen.

Etliche Designer zei­gen auf Dribbble, wie das aus­se­hen kann.

Twisted by Shota 

Mondrian by Stugbear

Video Reveal by Gil 

lan­ding page by Zak Steele-Eklund for Studio VØR 

Anxiety by Modis

Girsu by Zak Steele-Eklund for Studio VØR

Noch mehr Beispiele für Mondrianismen, teils auch recht ent­fern­ter Natur, fin­dest du drü­ben bei den Kollegen von Muzli Design Inspiration.

Wie gefällt dir die­ser Design-Stil? Für wel­che Projekte wür­de er sich am ehes­ten eig­nen?

(Der Beitrag erschien erst­mals im Herbst 2017 und wird seit­dem aktu­ell gehal­ten. Das letz­te Update erfolg­te im April 2019.)

Dieter Petereit

Dieter Petereit

ist seit 1994 im Netz unterwegs, aber bereits seit über 30 Jahren in der IT daheim. Seit Anfang des neuen Jahrtausends schreibt er für diverse Medien, hauptsächlich zu den Themenfeldern Technik und Design.

2 Kommentare

  1. Ist das Kunst? Oder kann das in den Müll. Bunte Vierecke…naja..

  2. Mir gefällt so eine Art von Design sehr.
    In dem Artikel sind tol­le Beispiele auf­ge­führt. Wäre natür­lich super, wenn man die­se run­ter­la­den könn­te

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.