Wir leben in einer 3-dimensionalen Welt. Warum also solltest du mit einem flachen Design vorlieb nehmen? Isometrische Design – der neueste Designtrend – bietet dir das Beste aus beiden Welten: ein 3D-Design, bei dem es keinerlei zusammenlaufende Fluchtlinien gibt.

Ein bisschen so, als hätten Flat Design und 3D-Design ein Kind gemacht.

Lass uns dir also mal einen kleinen Vorsprung verschaffen, damit du der Erste sein kannst, der diese dynamische Technik beherrscht. Setze deine 3D-Brille auf, schnapp dir eine Tüte Popcorn und mach dich bereit, alles über isometrisches Design zu erfahren.

Inhalte

1. Warum ist isometrisches Design gerade so angesagt?
2. Die Grenzen von Flat Design
3. Was macht ein tolles isometrisches Design aus?
4. Wann du isometrisches Design nutzt
5. Wo du isometrisches Design nutzt
6. Gib ihm die Macht!

Warum ist isometrisches Design gerade so angesagt?

Isometrische Designs sind wie deine Lieblingsstars. Früher waren sie kontrastarm und langweilig, aber jetzt weißt du dank sozialer Medien und Selfies unter dem Hashtag #WokeUpLikeThis alles Mögliche über sie.

Isometric design effectively showing an office with a curved screen
Gekrümmte Bildschirme sind schwer mit Flat Design darzustellen, aber nicht mit isometrischem Design! Via Journal.

Genau wie soziale Medien geben dir isometrische Designs andere Sichtweisen. Wenn man verschiedene Seiten eines Designs sehen kann, möchte man mehr darüber erfahren. Besonders für Unternehmen, die ihren Kunden mehrere Optionen bieten, oder solche, deren Produkt oder Service großartig in 3D aussieht, sind isometrische Designs die perfekte visuelle Metapher.

Die isometrische Technik ermöglicht es dir außerdem, mehr Details mit weniger Durcheinander zu zeigen. Einen Raum in 3D zeigen zu können, eröffnet ganz neue Möglichkeiten, die man vorher nicht hatte.

Die Grenzen von Flat Design

Isometrisches Design ist eine natürliche Weiterentwicklung des Flat Designs, die dessen Einfachheit beibehalten, aber buchstäblich neue Tiefe hinzugefügt hat.

Hier sind drei Fälle, in denen Flat Design dich einschränken kann:

Flat Design ist nicht so ergonomisch wie isometrisches Design

Wenn Symbole Tiefe haben, sehen sie geprägt oder erhöht aus. Nutzer wissen genau, wo sie tippen oder klicken sollen.

Flat icons
Flache Icons können sich optisch anpassen, wodurch unklar wird, wo man klicken soll. Via DesignerMill.
Easily readable isometric icons
Klare, leicht erkennbare, isometrische Icons. Via all-free-download.com.

Einfacher ist nicht immer besser

Wenn Designs zu sehr vereinfacht sind, kann es schwer sein, komplexe, visuelle Informationen darzustellen.

flat infographic
Simple Grafiken, verwirrende Botschaft. Via all-free-download.com.
Isometric design of a warehouse
Isometrisches Design macht komplexe Lagerabläufe leicht verständlich. Design von Maxim Andreev.

Flat Design schränkt deine visuellen Optionen ein

Du hast mehr Tricks zur Verfügung, wenn du ein Design mit eine Oberseite und zwei Seiten hast, statt nur einer Vorderseite.

Flat “T” maze design
Dieses „T“ ist auf die reine Frontansicht beschränkt. Via GraphicSprings.
Isometric logo design for Trinta
Dieses „T“-Logo ist aufgrund des isometrischen Designs dynamischer. Design von ludibes.

Was macht ein tolles isometrisches Design aus?

Isometrisches Design baut auf ein paar einfachen Techniken auf. Wenn du dich mit Design auskennst, ist dieses kurze Tutorial ein toller Weg zu lernen, wie man diese Techniken umsetzt.

Wenn du anfängst, mit isometrischem Design zu experimentieren – sei es, weil du selbst Designer bist oder einfach nur ein Design benötigst –, solltest du ein paar wichtige Dinge im Hinterkopf behalten:

Die 120°-Regel

Isometrisches Design ist ein exklusiver Club. Viele pseudo-isometrische Designs geben sich als das Wahre aus. Lass dich von ihnen nicht hinters Licht führen. Es ist nur isometrisch, wenn es einen 120°-Winkel zwischen den X-, Y- und Z-Achsen gibt.

Isometric cube showing the 120º rule
Würfel im isometrischen Design der zeigt, dass es nicht isometrisch ist, wenn es nicht 120° sind. Via romerojnr.com.

Keine zusammenlaufenden Linien

Der isometrische Stil verändert, wie unsere Augen Dinge wahrnehmen. Schau mal die Straße herunter: Die parallelen Linien, die in der Ferne verschwinden, laufen in einem Fluchtpunkt zusammen. Das passiert bei isometrischen Designs nicht. Es gibt keine zusammenlaufenden Linien und die Dinge erscheinen so, wie sie sind, statt so, wie wir komischen Menschen sie sehen.

Comparison between perspective and isometric lines
Isometrisches Design zeigt die Dinge so, wie sie sind und nicht wie wir sie sehen. Via Medium.

Vermeide Unordnung

Da du in drei Dimensionen mehr tricksen kannst als in zwei, kann es verlockend sein, alles Mögliche zu machen. Aber vergiss nicht, nur weil du etwas machen kannst heißt das nicht, dass du es auch solltest. Wenn sie mit zu vielen Informationen bombardiert werden, können Nutzer leicht verwirrt und abgeschreckt werden.

Isometric typography for a German radio station
Isometrische Designs bilden auf elegante Weise aus einer Typografie eine Struktur.  Via FluxFM.

Diese Typografie für einen deutschen Radiosender nutzt die isometrische Technik auf ordentliche Weise: eine Farbe, Schattierung wo nötig und eine lesbare Schriftart. „Hör Dich Glücklich“ – schöne Botschaft, elegantes Design.

Wann du isometrisches Design nutzt

Du denkst darüber nach, isometrisches Design zu nutzen, bist aber nicht sicher, ob du solltest? So kannst du herausfinden, ob es zu deinen Zielen passt:

Isometric infographic showing paths of immigration
Isometrisches Design zeigt auf sympathische Weise, wie man in die USA einwandern kann. Via 99designs.

Wenn du einfach bleiben möchtest, aber Tiefe willst

Isometrische Symbole sind eine angesagte Kategorie des isometrischen Designs. Diese Technik erhöht die optische Attraktivität und Erkennbarkeit eines Symbols. Die Wahrscheinlichkeit, dass deine Kunden die Augen zusammenkneifen und fragen „Was ist das?“ ist geringer, wenn dein Symbol eine 3D-Struktur und Tiefe hat.

Wenn du mehr Details vermitteln willst

Klassische 2D-Karten zeigen ein Gebiet von oben. Aber wenn du die Vorderseite sehen willst? Oder eine Seitenansicht? Pech gehabt. Wenn es nur einen Weg gäbe… Ach ja, gibt es: isometrisches Design!

Wenn du zusammenhängende Informationen illustrierst

Isometric illustration of the various parts of a city
Die isometrische Technik zeigt das komplexe Stadtleben auf leicht verständliche Weise. Design by LittleFox.

Du kannst mit isometrischem Design eine ganze Nachbarschaft auf leicht verständliche Weise zeigen. Und wir reden nicht nur von Gebäuden, Gewässern und Straßen. Auch Autos, Bäume, Werbetafeln, Parkbänke, Menschen und selbst Hunde können dargestellt und so auf den ersten Blick erkannt werden.

 

Wenn du einen erfrischenden Ansatz willst

Isometrische Designs mögen gerade im Trend liegen, aber Objekte mit Form und Tiefe zu sehen, war schon immer angesagt. 1988 fanden Comiczeichner heraus, wie man mit mehr Tiefe als jemals zuvor zeichnet und sie kehrten nie mehr zurück. Warum? Weil es cooler ist, wenn Spidermans Spinnennetz direkt auf dich zukommt!

Wo du isometrisches Design nutzt

Symbole

Da sie in der Regel winzig sind, sollten Symbole so simpel wie möglich sein. Das bedeutet allerdings nicht, dass sie nicht auch Struktur und Tiefe haben können. Besonders bei Menschen mit Sehschwäche und solchen mit gutem räumlichen Vorstellungsvermögen kann es ein Symbol nutzerfreundlicher machen, wenn man die Seiten und Oberseiten sieht. Die Betrachter müssen ihre Augen nicht so anstrengen und können besser mit ihrem Gerät interagieren.

Isometric logo of a transforming letter
Die isometrische Ansicht eines „A“ zeigt, dass es auch ein „E“ ist. Design von Litlast.

Da wir so sehr an flache Symbole gewöhnt sind, wird ein isometrisches Symbol außerdem mehr auffallen und die Aufmerksamkeit des Nutzers erregen. Kombiniere diese Technik mit einem kräftigen oder kontrastreichen Farbschema und schon hast du einen echten Hingucker.

Logos

Isometrisches Design eignet sich hervorragend, wenn du etwas Cleveres mit deinem Logo anstellen willst.

Schau dir an, wie die Seite des Buchstaben „A“ zum „E“ wird. Und durch einen weiteren subtilen Trick wird auf der Unterseite das „L“ angedeutet. Großartig!

Dieses Schloss funktioniert perfekt im isometrischen Stil. Die simplen zylindrischen und quadratischen Motive eignen sich dazu, von vorn, von der Seite und von oben betrachtet zu werden.

Isometric logo of a shutter
Fensterläden sind ein perfektes Produkt für isometrisches Design. Design von AndresEs.
Isometric logo of a castle
Ein sauberes, simples und geometrisches isometrisches Design. Design von Van Alva.

Landingpages

Zu zeigen, wie Informationen sich verbreiten und bewegen, kann oftmals zum Einschlafen sein. Peppe es mit isometrischem Stil auf!

Visual representation of an isometric town that's run with digital currency
Durch isometrische Techniken werden komplizierte Konzepte verständlicher. Isometrisches Infografik-Design von Maxim Andreev.
Isometric landing page showing flow of information
Diese simple und klare isometrische Landingpage zeigt, wie Informationen fließen. Von ɪsOᴄʟAs™.
Isometric design shows goal keeping process
Isometrische Technik zeigt den Weg zum Ziel. Isometrisches Infografik-Design von KisaDesign.

Infografiken

Mit isometrischen Infografiken verstehen wir nicht nur problemlos, wie ein Büro arbeitet, sondern es gibt uns auch ein Gefühl für den Büroraum selbst.

Visual representation of an office with text describing unique selling points
Minars Hautarztpraxis zeigt, dass sich um Patienten gekümmert wird. Isometrisches Infografik-Design von Fenhrir.

Oder schaue dir diese Beispiele an. Mundchirurgie ist so schon nervenaufreibend genug. Das Letzte, was du brauchst, ist dir Gedanken um einen Parkplatz machen zu müssen, bevor du unters Messer kommst. Dieses isometrische Design überlässt nichts der Vorstellungskraft und prägt sich leicht ein.

Isometrisches Design macht es glasklar, wo man parken soll. Isometrisches Infografik-Design von Omake.
Isometrisches Design lässt einen diese Produktverpackung besser verstehen. Isometrisches Infografik-Design von Maria GR.

Selbst kreative Verpackung – wie dieser einzigartige, mehrschichtige Pizzakarton – wird durch die Kraft des isometrischen Designs leichter verständlich.

Isometrisches Design: Eine neue Art der Kreativität

Innovative Unternehmen und Designer sollten definitiv über isometrische Designs nachdenken. Sie sind ein Weg, um auf visuelle Weise deine Werte zu zeigen, ohne sie aufschreiben zu müssen. Das zeigt, dass deine Marke voll zu ihrer Philosophie steht, und vermittelt, dass du authentisch und innovativ bist.

Ein cooler psychologischer Vorteil isometrischen Designs ist, dass es den Kunden geistig über deinem Produkt oder Service platziert. Wenn du etwas direkt anschaust, hast du das Gefühl, auf einer Augenhöhe damit zu sein. Aber die erhabene Perspektive, die isometrisches Design bietet, gibt deiner Zielgruppe das Gefühl, das Sagen zu haben, da sie auf die Sache hinabsehen kann, ähnlich wie es ein Raubvogel tut.

Da du nun gesehen hast, wie isometrisches Design funktioniert, ist es an der Zeit, dein eigenes isometrisches Design zu kreieren!

Brauchst du Hilfe beim Kreieren eines großartigen isometrischen Designs?
Finde hier den perfekten Designer für dein Projekt.