Wie werden diese wirbelnden Linienrahmen hergestellt?

Linienrahmen 1 Linienrahmen 2

Ich liebe und war schon immer fasziniert von dieser Art von wirbelndem Design.

Nachdem ich über 10 Jahre als Grafikdesigner gearbeitet habe, kann ich mir immer noch nicht vorstellen, wie diese gemacht werden. Geometrisch geschwungenes Design im Allgemeinen.

Wie verbinden sie ihre verschiedenen Teile so nahtlos? Es kann kein einzelnes Stück sein, das von Hand gefertigt wurde, da es bei der Platzierung jedes Punktes und der Feinabstimmung jedes Bézier-Griffs zu perfekt, zu geometrisch ist, um auf diese Weise gemacht zu werden.

Hat jemand von Ihnen an dieser Technik in Illustrator gearbeitet? Was ist der Ansatz?

Warum müssen Sie uns mitteilen, dass Sie mehr als 10 Jahre als Designer tätig sind? Nur neugierig, welchen Nutzen es der Frage hinzufügt.
Sie wurden ... so gezeichnet? Ich bin mir nicht sicher, wie ich darauf antworten soll. Sie sind Segmente von miteinander verbundenen Kurven. Gleiches Konzept wie bei der Verwendung französischer Kurven vor dem Computer.
@DA01 Nun, Leute unter 30 haben vielleicht noch nie französische Kurven gesehen oder mit Lineal und Zirkel auf Papier gezeichnet. Sag nur.
@joojaa eh .... ja, na ja ... OK, ich verstehe deinen Punkt. Aber würde argumentieren, dass jeder, der ein Grafikdesigner ist, haben sollte. Es ist wie ein Architekt, der nicht weiß, was ein Architektenherrscher ist. Ja, sie verwenden es nicht unbedingt, aber es kommt mit dem Revier / der Geschichte des Berufs. :)
@DA01 Sie werden feststellen, dass Menschen oft viele Dinge wissen, aber nicht in der Lage sind, dieses Wissen zu einem Ganzen zu kombinieren und es in bestimmten Fällen anzuwenden. So sollte das eine Sache sein, aber wenn man es nicht tut dann noch wichtiger es zu erklären. Alles in allem kann ich sagen, dass ich dachte, es wäre selbstverständlich, dass ein Masterstudent im 4. Jahr des Maschinenbaus Trigonometrie beherrschen würde. Anscheinend ein gutes Drittel von ihnen nicht, nicht wirklich. Aber ja, ich hatte eine ähnliche reflexartige Reaktion.
@darth_vader, es war nur ein wenig kontextbezogene und leicht humorvolle, wenn nicht lautes Material zum Lachen – Schritt für Schritt – Einführung. Ich verstehe, dass dies nicht reddit ist, aber komm schon ...
@DA01 + joojaa ja, ich habe in meinem Leben französische Kurven gesehen und sie auf Papier gezeichnet. Deshalb lautet meine Hauptfrage "Wie verbinden sie ihre verschiedenen Teile [...]". Weil ich weiß, dass es verschiedene Teile sind, die zusammengefügt sind. Meine Frage war darauf gerichtet, wie man sie dazu bringt, sich zu verhalten und sie so geometrisch genau zu erstellen, was joojaa freundlicherweise beantwortete. Es war eine Frage der Technik . Auch bei DA01 IST es möglich, etwas Ähnliches zu tun, indem Griffe an Gitterpunkten eingerastet werden. Daher mein Kommentar dazu. Ich bin überrascht, wie schnell ihr fälschlicherweise angenommen habt, dass ich mein Handwerk nicht verstehe. Nette Gemeinschaft!
(Hoppla, sieht so aus, als hättest du den Kommentar gelöscht, auf den ich antworte) @joojaa stimme absolut zu ... wenn das der Fall wäre :) Ich finde meine Frage immer noch legitim, es ist eine fortgeschrittene Technik. Es ist eine Sache zu wissen, wie man den Mesh-Verlauf verwendet. Ein ganz anderer versucht damit etwas realistisch darzustellen. Das erfordert ein tieferes Verständnis des Tools, Tipps und Tricks und Erfahrung. Dafür komme ich zu Stack Exchange. Ist es nicht das, wofür es ist?
Ja, ich glaube nicht, dass jemand die Tatsache bestreitet, dass Ihre Frage gültig ist. 9 Upvotes und 0 Downvotes, keine engen Stimmen, keine Flaggen. Es ist nur schwer zu beschreiben, wie man das macht, man tut es einfach. Es ist eine Denkfähigkeit, keine Handlungsfähigkeit, die schwer zu lehren ist. Es ist nur so, dass ich, nachdem ich sowohl Maschinenbauingenieuren als auch Industriedesignern beibringen musste, wie man Kurven entwickelt, einige Zeit investiert habe, um darüber nachzudenken.
@MrMerrick, es ist eine berechtigte Frage ... fällt aber ein bisschen auf die faule / breite Seite der Dinge. Joojaa hat sich große Mühe gegeben, ein sehr schönes Tutorial zu erstellen.
@DA01 es ist in gewissem Sinne weit gefasst: dass es in den von mir geposteten Bildern viele Formen gibt, die auf viele Arten irgendwie erstellt werden können, aber noch einmal: Die Frage ist, wie man diese scheinbar "perfekten", glatten, geometrisch korrekten Kurven in Illustrator erstellt damit Sie sich ihnen dann anschließen können. Übrigens habe ich abgestimmt und als beantwortet markiert und mich bei Jooja's für seine großartige Antwort bedankt, sobald er sie gepostet hat. Was ist Ihr Punkt damit? Ich denke, das ist eine sehr interessante Frage, da Illustrator in seinen grundlegenden Kernwerkzeugen ziemlich eingeschränkt ist.

Antworten (1)

Es gibt viele Möglichkeiten, sich dem zu nähern. Du hast Recht, eine Kurve muss nicht aus einem Stück bestehen, sie kann auch aus mehreren Stücken gebaut werden. Tatsächlich kann eine Kurve aus mehreren Kurven zusammengesetzt werden.

Ich habe eine ähnliche Frage zu Spiralkappen beantwortet , hier gilt meistens dasselbe. Wenn Sie dies tun, erstellen Sie eine anfängliche Form und drehen und spiegeln sie dann herum. Das spätere Bild ist ein großartiges Beispiel dafür. Kurven können zum Beispiel mit 2 aneinandergrenzenden Bögen gebaut werden. Möglich ist auch eine großzügige Wiederverwendung eines einzelnen gezeichneten Pfads, Versätze, Spiegelungen und Schnitte durch Kreise und Linien.

Zweitens kann das Bauteil aus einer anderen Funktion heraus gebaut werden als eine Spirale. Das Fangen mit einem manuell konstruierten Raster erzielt jedoch eine ähnliche Liniengenauigkeit. Auch hier besteht der Trick darin, die symmetrischen Teile und Liniensegmente zu spiegeln und zu drehen.

Bau einer Schleife

Bild 1 : Aufbau eines wiederholbaren Musters

Präzise Arbeit in Illustrator hängt von der Beherrschung des Linienwerkzeugs , Ellipsenwerkzeugs , Drehwerkzeugs , Spiegelwerkzeugs , Skalierungswerkzeugs und Neigungswerkzeugs ab . Von diesen ist das Linienwerkzeug am schwierigsten zu beherrschen, da die Beherrschung des Werkzeugs und des Ellipsenwerkzeugs davon abhängt, dass Sie wissen, wie man den Alt-Klick-Dialog verwendet. Und für das Linienwerkzeug gibt es 2 Gründe dafür!

benutzerdefinierte Bauanleitungen durch Offset

Bild 2 : Erstellen Sie benutzerdefinierte Bauanleitungen und Sie können sie nach Herzenslust ausschneiden und anbringen.

Wie es gemacht wird (Tutorial, auf Anfrage)

Um den Kommentar zur Herstellung zu beantworten, werde ich den Prozess der Erstellung von Bild 1 skizzieren .

  1. Zeichnen Sie Ihre primären Leitfäden.

    • Beginnen Sie mit dem Zeichnen eines Ovals und eines kleinen Liniensegments in der Mitte des Ovals. Die Linie ist da, damit ich leichter am Rotationszentrum (am Ende der Linie) einrasten kann.

      Geben Sie hier die Bildbeschreibung ein

      Bild 3 : Denken Sie daran, Ihr Rotationszentrum zu markieren, so ist es einfacher

    • Verwenden Sie das Drehwerkzeug, um die Führung zu drehen, in diesem Fall um 90 Grad, aber Sie können jeden anderen Winkel verwenden. Tipp : Alt+ Klicken platziert Pivot und öffnet einen Dialog zur numerischen Eingabe.

      Genau genommen braucht man die dritte und vierte Führung nicht, aber da die Wiederholung nur einen Tastendruck entfernt ist, mache ich sie dann trotzdem, es gibt mir eine bessere Vorstellung davon, wie die Größe sein wird. Passen Sie die Führungen jetzt an Ihre Bedürfnisse an.

      Geben Sie hier die Bildbeschreibung ein

      Bild 4 : Nehmen Sie sich Zeit, um die Führungen zu erstellen.

    • Sie müssen sich darauf vorbereiten, die Ovale an ihren Schnittpunkten einzuschneiden, und danach (oder bei) beginnt die Kurve nach unten in Richtung der Spiegellinie abzufallen. Dazu bereite ich eine senkrechte Schnittlinie und eine Spiegellinie vor.

      Geben Sie hier die Bildbeschreibung ein

      Bild 5 : Bereiten Sie die Schnittlinien vor

    • Kopieren Sie eines der Ovale und erstellen Sie eine neue Ebene, fügen Sie das Oval davor ein. Sperren Sie die Führungsebene.

  2. Konstruieren der Form.

    • Entfernen Sie die untere Hälfte des Ovals.

    • Fügen Sie am ersten Schnittpunkt des Ovals einen Punkt ein und schneiden Sie das Oval am Schnittpunkt von Oval zu Oval in zwei Teile.

      Geben Sie hier die Bildbeschreibung ein

      Bild 6 : In Stücke schneiden

    • Spiegeln Sie eine Kopie des Segments über die Spiegellinie und verbinden Sie die Kurven. Tipp : Wenn Illustrator dazwischen eine Spanne einfügt, verschieben Sie einfach einen Punkt zur Seite, löschen Sie die Spanne, gehen Sie zurück und wiederholen Sie die Verbindung. Die Kurven zeigen jetzt in die gleiche Richtung und es gibt keine zusätzliche Spanne.

      Geben Sie hier die Bildbeschreibung ein

      Bild 6 : Mit Spiegel verbinden

    • Verwenden Sie das Werkzeug „Ankerpunkt konvertieren“, um das Eckenende zu einer einheitlichen Tangente zu machen. Ziehen Sie die Tangente senkrecht zur Spiegellinie. Tipp Wenn Sie in einem ungünstigen Winkel arbeiten, können Sie den Winkel mit dem Linienwerkzeug messen und die Einstellungen verwenden, um Ihr Gitter zu drehen.

      Machen Sie die Tangente etwas kürzer als die Breite Ihrer Lücke an den nächstgelegenen Punkten (oder gleich breit). Man kann anpassen, wie rund die Kante ist, indem man eine längere Tangente macht. Ich mache die Form etwas spitzer als im Originalbeispiel, um zu zeigen, dass man die Form frei variieren kann.

      Geben Sie hier die Bildbeschreibung ein

      Bild 7 Machen Sie die Tangente symmetrisch und senkrecht zur Spiegellinie

    • Ziehen Sie den Kurvenpunkt entlang der Symmetrielinie zurück, bis Sie ein schönes asymptotisches Verhalten haben.

      Geben Sie hier die Bildbeschreibung ein

      Bild 8 Schleife anpassen.

    • Hilfslinien ausblenden und spiegeln/drehen und verbinden.

      Geben Sie hier die Bildbeschreibung ein

      Bild 9 Endbild.

Post scriptum

Nach all dieser Arbeit möchte ich sagen, dass die Funktion graphisch dargestellt wird:

x=20*cos(t)-10*sin(5*t+PI/2)
Y=20*sin(t)+10*cos(5*t+PI/2)

Ergäbe:

Geben Sie hier die Bildbeschreibung ein

Viele Möglichkeiten, die Katze zu häuten, denke ich.

Tolle Antwort, danke! Ich würde immer noch gerne einen etwas tieferen Einblick in die Technik sehen, mit einer schrittweisen Reproduktion einiger der Formen, die ich gepostet habe, sehr, sehr neugierig auf einige von ihnen und welche Art von Arbeitsablauf (welche booleschen Werte zu verwenden sind, Werkzeugtechniken , etc) dauert es. Aber das ist zu viel verlangt. Danke nochmal für einen schönen Beitrag. Das mit den Spiralkappen hilft auch.
@MrMerrick Fertig
Vielen Dank, dass Sie sich die Zeit und Mühe genommen haben, @joojaa zu antworten. Das fehlende Puzzleteil für mich war die Verwendung dieser Hilfssymmetrielinien, an denen ich Punkte entlang ihnen ausrichten kann, um die Formen zu verfeinern. Ich bin es gewohnt, mit gespiegelten Dingen zu arbeiten, um geometrische Kunstwerke zu erstellen, aber wenn es um Kurven und fließendere Arbeiten geht, hatte ich Probleme, sie glatt aussehen zu lassen. Ich werde Zeit investieren, um dieses Bogenwerkzeug zu zähmen. Darf ich noch 2 abschließende Fragen stellen? 1- was meinst du mit der Beherrschung der Linienwerkzeuge? Ich verwende nur Alt, um es entweder in die entgegengesetzte Richtung seines Ursprungs wachsen zu lassen, oder Alt + Klicken, um den Erstellungsdialog aufzurufen. Ist es das?
und 2- Auf Ihrer Abbildung 2, wie machen Sie diese Wellenlinien so schrecklich glatt? Ist das einfach ein Bogenwerkzeug oder ist es tatsächlich Punkt für Punkt eingeschränkt (Halten der Umschalttaste beim Platzieren und Ziehen der Punkte) Bézier? Dies ist das weiteste, was ich mit dem Bogenwerkzeug + Blend erreicht habe , was lächerlich ist.
@MrMerrick ist ein Single-Span-Bezier. Verwenden Sie das Lichtbogenwerkzeug sowieso nicht, es ist nutzlos. Die gleiche Nutzlosigkeit gilt für alle anderen Formwerkzeuge außer Spirale, Linie und Ellipse. Trotzdem ist das Ellipsenwerkzeug nicht optimal. Der neue Illustrator hat auch ein neues Kurvenwerkzeug, das besser ist als Beziers. B-Splines und Spirokurven sind einfach überlegen.
@MrMerrick ok, ich denke, es gibt eine Frage, wie man Tangente und Krümmung zweier Kurven anpasst. Ich sitze gerade auf einem Floß aus Fässern, die im Meer schwimmen, und habe keinen Illustrator dabei.
keine Sorge :) JA! B-Splines sind für diese Aufgabe so viel besser, ich kann nicht verstehen, warum sie noch nicht ihren Weg in den Illustrator gefunden haben, scheint so einfach zu sein. Ich werde dieses neue Tool im Illustrator ausprobieren, danke für die Hinweise. Ich kann viel bessere Ergebnisse erzielen, wenn ich nur das Stiftwerkzeug + meine Augen verwende als mit dem Bogenwerkzeug.
Als Referenz ist hier ein neuer Versuch , Ihre Formen mit dem neuen Krümmungswerkzeug + Mischung von Illustrator zu reproduzieren. Viel besser als das Bogenwerkzeug, aber immer noch nicht ganz da. Darf ich fragen, mit welcher Software du die Beispiele erstellt hast? Ich kann anscheinend keine soliden Ratschläge finden, wie man solche Dinge in Illustrator angeht. Aber ich sehe solche Dinge überall gemacht, also kann es gemacht werden. Fragen Sie sich, wie die Leute das machen, fragen Sie sich, was die Technik hinter einem reibungslosen Fluss zwischen Kurven in Illustrator ist.
@MrMerrick Um perfekt parallele Kurven zu erstellen, besteht eine Möglichkeit darin, einen Strich zu machen, ihn dick zu machen und ihn dann in eine Form umzuwandeln. Sie haben jetzt eine vierseitige Form mit parallelen Ober- und Unterseiten. Lösen Sie die Seiten und Sie können dann das Mischwerkzeug verwenden, um mehrere Zwischenlinien perfekt parallel zu machen.
@DA01 Sicher, aber Multilke-Offsets sind weniger fehleranfällig. Blend kann keine Punkte hinzufügen, wenn die Genauigkeit zu niedrig ist, und kann nicht alle hinzugefügten Punkte kompensieren.
@ DA01 Ja, darüber mache ich mir eigentlich keine allzu großen Sorgen. Meine Frage bleibt: Wie kann man glatte, "geometrisch korrekte" Kurven erstellen und sie in Illustrator gut verbinden, wie in den Beispielen von joojaa. Ich stimme zu, es ist eine weit gefasste Frage, vielleicht können wir uns einfach auf dieses Beispiel konzentrieren, diese Wellenlinien? Ich kann sie nicht mit den nativen Tools von Illustrator replizieren.
@MrMerrick, es würde helfen, wenn Sie posten, was Sie getan haben und was Ihrer Meinung nach nicht mit dem funktioniert, was Sie haben. Vielleicht als separate Frage. Im Allgemeinen sind jedoch weniger Punkte oft besser als mehr, stellen Sie sicher, dass die Ziehpunkte Ihrer Punkte aufeinander ausgerichtet sind.
Vielen Dank für Ihre kürzliche Zusammenarbeit +1.