Inkscape 207 – Vektor Isometric, Basics & Tips
Isometric Art kennt sicherlich jeder. Ob von Games oder Abbildungen in öffentlichen Verkehrsmitteln etc. findet man viele Beispiele. Bevor ich praktische Beispiele aufbaue, gebe ich hier erste Tips und Tricks die den Einstieg erleichtern.
Skills: Easy
Plugin: Nein
Gibt man bei der Suchmaschine seiner Wahl den Begriff Isomertic Art ein, findet man eine Menge Beispiele für diese Kunstform. Erweitert man den Suchbegriff um Isomertic Art Bitmap (Pixelbilder) oder Isomertic Art Vector (Vektorgrafiken) unterscheiden sich die Ergebnisse schon voneinander, wobei da auch die Suchmaschinen schon einiges durcheinander würfeln. Auf jeden Fall dürften die Ergebnisse bei Vektorgrafiken (meist) glatter ausschauen.
Perspektivisch vs Isometrisch
Das menschliche Auge sieht perspektivisch. Der Vordergrund groß, alles was dahinter ist verkleinert sich (strahlenförmig). Das lässt sich sehr schön konstruieren. Die Beispielanimation zeigt eine solche Konstruktion.
Verändert der Betrachter seine Position, geht beispielsweise nach links, muss das Strahlensystem, die Perspektive neu konstruiert werden. Das ist bei der isometrischen Ansicht nicht der Fall, dort orientiert sich alles an einem Raster!
Die isometrische Darstellung zeigt das Objekt auch 3 dimensional, jedoch ohne perspektivische Verkürzungen/Verzerrungen. Dabei ist diese Ansicht sogar noch leichter zu konstruieren, da es auf dem einen Raster basiert und sich alles danach ausrichtet. Daher können im Gegensatz zur Perspektive die gleichen Objekte in der Isometrie an jeden beliebigen Platz versetzt werden (siehe Animation unten).
Das bringt es mit sich das isometrisch konstruierte Objekte an jedem Ort auf der Arbeitsfläche aneinander gesetzt und zusammengestellt werden können, um beispielsweise um Gebäude aufzubauen (siehe Animation unten).
Das wiederum eignet sich dann sehr schön für Games und als Grafiken. Inkscape bietet für diesen Anlass ein passendes Hilfslinien-Gitter, an dem man sich orientieren und konstruieren kann.
Über Datei – Dokumenteinstellungen kann das Gitter eingestellt werden. Zuerst wählt man den Typ des Gitters: Axonometrisches. Dann den Button Neu drücken und das Finetuning für das Raster vornehmen (siehe Animation unten).
Dieses Gitter ist sichtbar und die Linien magnetisch, wodurch sich Pfade und Objekte an den Eckpunkten ausrichten können (siehe Bild unten).
Interessant ist hierbei auch, das sich ein Würfel durch ein einziges Rauten-Element aufbauen lässt. Man versetzt einfach den Drehpunkt der Raute entsprechend, dupliziert diese Raute mit STRG-D und rotiert diese Kopie an die gewünschte Stelle. Mit gedrückter STRG-Taste beim Rotieren rastet der Vorgang in 15° Schritten ein, was die Arbeit nochmal erleichtert (siehe Animation unten).
Ein so konstruierter Würfel besteht aus den Winkeln 30° und 60° Grad und nichts anderes. Diese Zahlen lassen sich schnell und sauber einstellen und es lässt sich gut damit rechen (siehe Bild unten).
Auch wenn isometrische Vektorgrafiken nicht sehr viel mit der Klötzchen Bauweise zu tun haben, ist der Aufbau dennoch interessant. Bei den Klötzchen wird alles, ganze Flächen, aus Würfeln gebaut. Bei den isometrischen Vektorgrafiken bestehen beispielsweise Häuser aus ganzen Rechteckflächen, wenn auch die Winkel an den Enden, oben und unten dem Raster folgen.
Exkurs – Andere Bauweise (…andere Baustelle)
Im Netz kursieren zur isometrischen Konstruktion noch andere Vorschläge. Beispielsweise lässt sich eine Raute auch über ein Quadrat konstruieren (siehe Animation unten).
Messe ich nun nach, beträgt der Winkel nicht mehr 30° Grad, sondern 26,56 Grad (siehe Bild unten).
Auch damit ließen sich Gebäude, Boden-Elemente und dergleichen zusammensetzen, aber diese Grad Zahl basiert auf einer etwas anderen Technik (siehe Bild unten).
Die heutigen isometrischen Darstellungen sind aus der Pixel Art (Bilder aus reinen Pixeln, keine Flächen) entstanden. Pixel Art ist die klassische Kunstform, deren Darstellungen sich an die damaligen Anforderungen und Darstellungsformen, Anzahl der Farben etc. der Computer-Hardware ausgerichtet haben. Darauf basierend wurden solche Motive in der Vektorgrafik auf das isometrische System mit den Winkeln 30° und 60° Grad übernommen.
In der Pixelart verlaufen schräge Linien aus einzelnen Pixeln sauberer in einem Winkel von 26,x° Grad. Daher ist diese Bauweise beziehungsweise der Aufbau basierend auf der Grad Zahl 26,x° Grad eine etwas andere Baustelle, nicht falsch, aber vordergründig im Game-Bereich angesiedelt. Wer das nachlesen möchte, kann das hier in englischer Sprache tun.
Wer sich für reine Pixel Art interessiert, Beispiele dazu sehen möchte, kann gerne die Kunstwerke im klassischen Pixel Art-Forum betrachten.
Isometrische Kreise und Grundflächen für Items
Nun möchte man natürlich gerne nicht nur quadratische Elemente bauen, sondern auch isometrische Ovale in seine Grafiken einbauen (Baumstämme, Säulen, Türme, Brunnen etc.). Die entsprechenden Rundungen lassen sich auf einfache Weise geometrisch konstruieren (siehe Bild unten).
In einem nächsten Teil werden dann verschiedene Elemente gestaltet, die sich als Prototypen verwenden lassen. Auf diese Weise lassen sich diese Elemente zu ganzen Bauten, Flächen und vielen anderen Objekten zusammensetzen.
