Wie zeichnet man isometrische Vektoren?

Ich suche vorzugsweise "eingebaute" Softwarelösungen für Illustrator CS2-5.

Ich versuche, diese isometrischen Illustrationen für eine Web-App zu erstellen. Im Moment habe ich in Adobe Illustrator manuell ein Raster erstellt und die Zeichnungen auf der Grundlage dieses Rasters erstellt - aber ich habe keine Hilfslinien, keine Schnappschüsse und ähnliches…

Das Endergebnis sollte ungefähr so ​​aussehen: http://www.twigital.co.uk/

Ich frage mich, ob Sie eine gute Software zum Zeichnen von isometrischem Material kennen, aus der ich es dann als Vektor (.eps oder .ai) ausgeben kann, damit ich es dann in Illustrator importieren und sie mit Farben und anderem Material aufpeppen kann.

Wenn Sie keine spezielle Software dafür kennen, haben Sie jemals isometrische Illustrationen in Illustrator erstellt? Irgendwelche Methoden? Irgendwelche Tipps?

BEARBEITEN:

Bitte verwechseln Sie die isometrische Zeichnung nicht mit der perspektivischen Zeichnung mit 1,2 oder 3 Punkten.

ISOMETRISCHE ZEICHNUNG:

[Das isometrische System ist nur eine Konvention / Erfindung, die für viele Dinge nützlich ist, nicht um zu reproduzieren, was die Augen in der Realität sehen, sondern wirklich nur eine Konvention, die für Messungen und andere Dinge nützlich ist.]

iso (gleich) metrisch (Messung)

In einer isometrischen Zeichnung wären alle Kanten eines Würfels in Vierergruppen parallel . (2 parallele Linien bedeuten, dass die Linien sich nie treffen, egal wie lange Sie sie zeichnen)

PERSPEKTIVISCHE ZEICHNUNG:

[Die perspektivischen Zeichenkonventionen (1 Punkt, 2 Punkt, 3 Punkt, ... und einige andere) sind immer noch Konventionen, aber sie versuchen zu imitieren und so nah wie möglich an dem zu sein, was das Auge in der Realität sieht (3D), aber so wie es ist Auf 2D (Papier / Bildschirm) ist es nie so, wie es die Realität tatsächlich ist.]

[Eine andere Sache, über die manche streiten könnten, ist die, dass wir zwei Augen haben (nur einige optische Geräte) Konventionen ähneln auch wirklich genau der Realität ... aber das ist für die Philosophie SE: P] *

In der perspektivischen Zeichnung würden sich die Kanten zu einem oder mehreren Fluchtpunkten hin verjüngen .

Mit dem Perspektivenraster in Illustrator CS 5 stehen drei Optionen zur Verfügung:

1- Punkt-Perspektive, 2- Punkt-Perspektive und 3- Punkt-Perspektive.

Nachdem ich alle Informationen von oben verarbeitet habe (Informationen aus dem Internet ... könnten falsch sein, zögern Sie nicht, darüber nachzudenken), gehe ich einfach davon aus, dass es nicht möglich ist, eine isometrische Ansicht mehrerer Objekte auf einer Leinwand (wie in der Grafik) zu erzielen Beispiel oben, twigital.co.uk (danke an George für die Erklärung, wie es in seiner Antwort gemacht wurde) mit einem Perspektivenraster, dh mit 1-Punkt-Perspektive: Linien treffen sich in einem Punkt am Horizont, 2 Punkte: Linien wird an 2 Punkten am Horizont treffen, 3 Punkte ... Sie bekommen die Idee ...

Und bei einer isometrischen Ansicht treffen sich die Linien nie , da sie parallel sind. (Ich denke, man kann es auch als isometrische Perspektive bezeichnen, deshalb bin ich ein bisschen verwirrt.)

!!! Wenn Sie das Raster manuell erstellen , können Sie lernen, wie es funktioniert, oder Sie können eines herunterladen, das bereits hier erstellt wurde . Nachdem Sie alle Schritte in diesem Lernprogramm ausgeführt haben, wählen Sie alle von Ihnen erstellten Linien aus und gehen zu Ansicht> Hilfslinien > Hilfslinien erstellen . Dies ist eine Art Antwort auf diese Frage, aber ich habe nur nach einer "eingebauten" Lösung gesucht und ...

Ich habe versucht, dies mit dem Perspektivenraster in Illustrator CS5 zu tun ... hat bei mir nicht funktioniert. Wenn jemand dies mit dem Perspektivenraster in Illustrator getan hat, erläutern Sie bitte die genauen Schritte dazu.

Einige mögen sagen, ich mache zu viel Stress auf einige Dinge oben, aber wenn Sie eine komplexe App mit Hunderten oder nur 50 zufällig positionierten (auf isometrische Weise) Objekten erstellen und die Objekte nicht perfekt isometrisch sind, erhalten Sie hässliche Ergebnisse hier und da (nicht alle Linien sind parallel und es sieht schlecht aus) oder wenn es sich um eine App für Messungen und präzise verkleinerte Projektionen handelt, werden Sie "schlechte" Zahlen erhalten ... und das wollen Sie wahrscheinlich nicht. .

Für Twigital verwendete der Designer ( Chris ) Illustrator, ein Raster und das 3D-Drehwerkzeug. Beachten Sie, dass es Voreinstellungen für isometrische Rotationen gibt.

Wenn Sie mehr als das benötigen, was Illustrator standardmäßig bereitstellt, testen Sie das CADtools-Plug-in für Illustrator , das Tools für das isometrische Zeichnen und die Bemaßung bietet.

Ich habe noch ein paar Ressourcen zu teilen. Basierend auf diesem Tutorial habe ich die obigen Schritte als Aktionen aufgezeichnet, damit Sie diese mit Tastaturkürzeln auslösen können:

• Links = CMD + Umschalt + F1
• Oben = CMD + Umschalt + F2
• Rechts = CMD + Umschalt + F3

Um diese zu erhalten, müssen Sie nur diese Datei herunterladen: Isometric.aia und im Illustrator gehen Sie zu Aktionen (Fenster> Aktionen) und aus dem Kontextmenü (das winzige Symbol oben rechts mit dem Pfeil nach unten und 2 horizontalen Linien) (=)) Wählen Sie Load Actions und navigieren Sie zu Isometric.aia

Es ist auch ziemlich einfach, die Aktionen von Grund auf neu zu erstellen.

Ich habe auch ein paar Bildschirmaufnahmen gemacht:

• Verwendung der Aktionen für isometrische Transformationen zum Erstellen einer Box - IllustratorIsometricWithTransforms.mov
• Verwendung des 3D-Extrudiereffekts zum Erstellen einer Box - IllustratorIsometricWith3DExtrude.mov
• Verwendung der 3D-Rotation zum Erstellen von zylinder- / kegelähnlichen Objekten - IllustratorIsometricWith3DRevolve.mov
• Verwendung von 3D-Extudes zum Erstellen von Bögen (Mischen von geraden und runden Formen) - IllustratorIsometricExtrudeArches.mov

Die vollständige Archedatei kann hier heruntergeladen werden: iso_arches.ai

Es gibt drei wichtige Dinge, die im Video möglicherweise nicht ersichtlich sind und sich als nützlich erweisen werden:

• Verwenden von Punktfang / einem Referenzgitter, um Objekte einfacher zu platzieren
• Verwendung einer Einheit für Module, damit verschiedene Teile zusammenpassen
• Beim Zusammensetzen von Objekten mit sich wiederholenden Teilen werden Symbole anstelle von Gruppen verwendet

um Tweaks zu vereinfachen

Illustrator CS5 hat ein großartiges neues Tool namens "Perspektive". Mit diesem Werkzeug können Sie ein 2D- oder 3D-Perspektivenraster einrichten, mit dessen Hilfe Sie Objekte zeichnen können, um ihnen eine Dimension zu verleihen. Es "klebt" Formen und Text an eine bestimmte Ebene und passt Größe und Winkel an, je nachdem, wo es platziert ist.

Hier einige Videos von Adobe, in denen genau erklärt wird, was das Tool ist und wie es ausführlich verwendet wird:

Perspektivraster definieren

Zeichnungsgrafik In Der Perspektive

Außerdem gibt es hier ein Video-Tutorial von Terry White, das sich mit ähnlichen Dingen befasst.

Und hier sind einige verschiedene 3D-Tutorials , die nicht unbedingt das Perspective-Tool in Illustrator verwenden.

Ich denke, dass dieses Tool der beste Weg ist, mit Illustrator das isometrische Gefühl zu erreichen. Wenn Sie nicht über CS5 verfügen, müssen Sie einige grobe Methoden anwenden, um Ihre eigenen Raster zu erstellen, und was nicht.

Alternativ können Sie immer versuchen, eine separate Software zu finden, die Ihren Anforderungen entspricht. Ich hoffe so oder so, das hilft!

BEARBEITEN

Zur Verdeutlichung ist das Perspektiv-Werkzeug keineswegs "Echtes 3D", sondern lediglich ein 2D-Objekt mit der Illusion von 3D (genau wie bei der Isometrie).

Nehmen Sie zum Beispiel dieses Bild . Dies ist ein isometrisches Bild, und dieses Bild kann mit dem Perspektivwerkzeug im Illustrator erstellt werden. Zugegeben, es gibt eine bessere Software dafür, aber ich denke, dies ist eine Ihrer besten Möglichkeiten, dies innerhalb von Illustrator zu tun. Das Perspektiventool ist gewöhnungsbedürftig, die Tutorials werden definitiv dabei helfen.

Ich denke, der Unterschied, den Sie zwischen den Beispielen, die ich zuvor gepostet habe, und Ihrem "isometrischen Gefühl" sehen, ist nur der Winkel des Bildes. Isometrisch ist normalerweise von oben nach unten (nur in einem Winkel), wohingegen die anderen Beispiele direkter auf das Objekt schauen. Aber genau so haben sie beschlossen, sich ein Bild zu machen.

Ich könnte zu kompliziert denken, aber so oder so dachte ich, dass ich teilen sollte.

Nun, mein erster Gedanke war Rhinoceros , eine 3D-Software (für Windows).

Mit ihm können Sie ganz einfach 3D-Text und einfache 3D-Objekte wie Würfel, Zylinder und so weiter erstellen.

Außerdem hatte ich das Make2D- Feature im Kopf . Sie können damit 2D-Zeichnungen aus 3D-Objekten erstellen.

Sie können diese Zeilen dann im .ai-Format speichern.

Hier ist ein Beispiel für ein (nicht 100% genaues) iPhone, das ich (vor langer Zeit) erstellt habe und das ich jetzt in Linien konvertiert habe und von diesen in Illustrator gebracht habe. Das Bild

Wenn Sie es mit Farbe füllen möchten, ist dies möglicherweise etwas mühsam, da Sie erst Pfade verbinden müssen, bevor Sie es füllen können. Wählen Sie 2 oder mehr Zeilen aus und drücken Sie Strg + J.

Ich denke, das perfekte Tutorial für Ihre Zwecke ist gerade auf der Digital Arts-Website erschienen . Es ist nicht nur ein "How To", es ist eine ganze Fallstudie für sich.