Categories
Inkscape Tutorials

Inkscape 234 – festliches Emblem mit Text an Pfad

Ein schönes Emblem zu den Festtagen und dazu noch überraschend einfach im Aufbau. Geht man etwas systematisch an die ganze Sache heran, kommt man mit einer beeindruckend geringen Anzahl an Objekten und Arbeitsschritten aus.

Skills: Easy
Plugin: Nein
Download: Fertiges Emblem mit Paket als Vektor SVG-Datei. Download via Medifire.

 

Das gesamte Emblem (Paket nicht mitgerechnet) basiert auf 1 Rechteck, 2 Sternformen 4 Ellipsen/Kreise und je nach Bedarf 4 Textzeilen. Das einzige Objekt, das zweimal verwendet wird, ist das Rechteck. Diese Teile und etwas Mühe reichen aus um dieses schöne Motiv selbst zu gestalten.

Inkscape XMAS Emblem
Final – Example

 

Hilfslinien

Bei diesem Bild ist es hilfreich sich zwei Hilfslinien aus den Linealen am Seitenrand zu ziehen, um ein Zentrum zu haben, wo sich die Elemente daran ausrichten. Das Dokument wird über Datei Dokumenteinstellungen auf ein Maß von 1000 x 1000 Pixel gebracht (Maßeinheiten ebenfalls auf Pixel einstellen). Dementsprechend können die Hilfslinien auf 500 Pixel horizontal und vertikal gebracht werden.

Hilfslinien anlegen
Hilfslinien anlegen

 

Kreisformen aufziehen

Die erste Kreisform wird aufgezogen und über Ausrichten und Verteilen in die Mitte des Dokuments gesetzt. Die Größe bleibt euch überlassen. Man sollte nur im Verlauf darauf achten, dass die Abstände proportional bleiben (siehe Bild unten).

Kreis im Zentrum
Kreis im Zentrum

Dieser Kreis wird mit dem Shortcut STRG-D oder Bearbeiten – Duplizieren kopiert. Das Duplikat befindet sich exakt über dem Original. Über die Anfasser skaliert ihr diese Kreisform leicht nach außen (siehe Bild unten).

Zweiter Kreis (für Text)
Zweiter Kreis (für Text)

Diesen Vorgang wiederholt ihr nun noch 2 Mal, bis sich auf dem Arbeitsbereich 4 Kreise befinden (siehe Bild unten).

Alle Kreisformen
Alle Kreisformen

Die Kreise haben folgenden Zweck: Der innerste Kreis ist das Zentrum. Dort wird später das Paket platziert. Der nächste Kreis ist der Pfad für den oberen Text. Es folgt der Kreis für den unteren Text und am Ende ganz außen der Kreis für der das Emblem mit Außenkontur bilden. Zur besseren Übersicht können der innerste und der äußere Kreis schon mit einer Füllung versehen werden. Der äußere Kreis erhält zudem eine Kontur.

Die Kreise sind jetzt so anzuheben beziehungsweise abzusenken das die Pfadkreise für den Text (keine Füllung, nur Kontur) obenauf noch sichtbar sind (siehe Bild unten).

Kreise anordnen
Kreise anordnen

Schrift

In diesem frühen Stadium kann schon der Text angebracht werden. Für den Text sind vier separate Zeilen vorbereitet. Ob man Happy oder Merry verwendet hängt davon ab ob man die englische oder die amerikanische Schreibweise bevorzugt (oder auf Deutsch schreibt 😉 ). Bezieht man sich nur auf die Weihnachtszeit kann man die Textzeile für oben und unten verwenden (siehe Bild unten).

4 separate Texte
4 separate Texte

Beide Kreise müssen vor dem Einsatz über Pfad – Objekt in Pfad umwandeln in Pfade konvertiert werden!

Der innere Kreispfad ist für den Text oben. Der Text wird sich auf den Pfad setzen. Nun ist der Pfad zu markieren, dann der Text, dann Text – Text an Pfad ausrichten angewendet. Der Text befindet sich nun auf dem Pfad. Klickt ihr den Pfad zweimal und rotiert ihn, wird der Text mitlaufen und kann so ausgerichtet werden (siehe Bild unten).

Innerer Kreis und Text
Innerer Kreis und Text

Der äußere Kreis muss gespiegelt werden damit sich die Pfadrichtung umkehrt. Dazu klickt ihr den Pfad und drückt Taste H um ihn horizontal zu spiegeln.

Der äußere Kreis ist für den Text unten. Es wird der Kreispfad markiert dann die gewünschte Textzeile und wieder Text an Pfad ausrichten ausgeführt. Der Text sollte sich jetzt innerhalb des Kreises befinden. Rotiert ihr den Kreis, bewegt sich auch hier der Text mit (siehe Bild unten).

Äußerer Kreis und Text

Es fällt auf das der Text im inneren sehr gestaucht ausschaut. Da bedarf es etwas Feinarbeit. Mit dem Textcursor setzt ihr euch zwischen zwei Buchstaben, haltet die ALT-Taste gedrückt und verwendet die Pfeiltasten links und rechts um den Buchstabenabstand zu verändern (sogenanntes Kerning).

Sitzt alles gut markiert ihr die Textzeilen und konvertiert über Pfad – Objekt in Pfad umwandeln. Die Führungspfade können gelöscht oder vorsichtshalber für alle Fälle zur Seite verschoben werden (siehe Bild unten).

Konvertierter Text
Konvertierter Text

 

Die Bänder

Für die Bänder unterhalb des Emblem liegt ein Rechteck bereit. Über Pfad – Objekt in Pfad umwandeln wird das Rechteck in Pfade konvertiert. Mit dem Pfad bearbeiten-Werkzeug werden die beiden unteren Nodes markiert und über den Plus-Schalter oberhalb des Arbeitsbereichs ein Node in der Mitte hinzugefügt. Diesen Node könnt ihr nach oben verschieben (siehe Bild unten).

Node hinzufügen
Node hinzufügen

Günstig ist es jetzt den Drehpunkt dieser Form nach oben rechts an die Ecke zu versetzen. Im Rotationsmodus kann der Drehpunkt verschoben werden (siehe Bild unten).

Drehpunkt versetzen
Drehpunkt versetzen

Das Band ist so anzuordnen das es mit der rechten Außenkante an der Hilfslinie und leicht in das Emblem (aber später darunter) hineinragt (siehe Bild unten). Genau an der Hilfslinie deshalb weil wenn ihr nun STRG-D zum duplizieren anwendet wird sich das Objekt genau auf der anderen Seite platzieren (siehe Bild unten).

Rechteck platzieren + Duplizieren
Rechteck platzieren + Duplizieren

Außerdem können die Bänder jetzt nach außen rotiert werden und der Drehpunkt an der Kante erlaubt ein komfortables und genaues Arbeiten (siehe Bild unten).

Objekte ausrichten (rotieren)
Objekte ausrichten (rotieren)

Sternformen

Jetzt noch zwei Sterne und das Emblem ist so gut wie fertig. Für den großen Stern außen werden 32 Ecken festgelegt. Für die Sterne zur Deko im Emblem reichen 5 Ecken aus (siehe Bild unten).

Sternform 32 Ecken
Sternform 32 Ecken

Abschließend könnt ihr allen Objekten eine finale Farbe zuweisen, alles ordentlich ausrichten und anordnen und fertig ist das festliche Emblem. Ahja, das Paket in der Mitte nicht vergessen.

Final XMAS Emblem
Final – Example

Schöne Weihnachtszeit!

 

Categories
Inkscape Tutorials

Inkscape 233 – Isometrisches Geschenkpaket

Es gibt immer mehrere Wege, die zum Ziel führen. In diesem Tutorial werden zwei Varianten aufgezeigt wie ihr euch ein isometrisches Geschenkpaket erstellen könnt. Die erste Bauweise ist eine Handzeichnung, die zweite über Plugin.

Skills: Easy [2.3]
Plugin: Bauweise 2 – Axonometric Projection. Download über die Inkscape Plugin-Seite.
Download: Download des Paketes als Vektor SVG-Datei ohne Emblem. Download via Mediafire.

 

In diesem Tutorial wird ein Geschenkpaket auf zwei verschiedene Bauweisen gebaut. Einmal per Hand über das axonometrische Seitengitter das Inkscape bereitstellt. Für die zweite Bauweise wird das Plugin Axonometric Projection genutzt.

isometric XMAS Gift In Inkscape
Final Example

 

Bauweise 1 – Handarbeit

Um das Paket von Hand zu bauen, verwendet man am besten das axonometrische Hilfsgitter von Inkscape. Dazu ruft an die Dokumenteneinstellungen auf und stellt beim Reiter Gitter das axonometrische Gitter ein. Hattet ihr euch schon ein Hilfsgitter auf dem Arbeitsbereich anzeigen lassen, so müsst ihr das erste Gitter in diesen Einstellungen löschen.

Zurück auf dem Arbeitsbereich zeichnet ihr euch jetzt mit dem Pfadwerkzeug eine erste Raute. Diese Raute wird über Bearbeiten – Duplizieren oder dem Shortcut STRG-D dupliziert (siehe Animation unten).

 

Raute zeichnen + duplizieren
Raute zeichnen + duplizieren

Die Raute muss als Nächstes gegen den Uhrzeigersinn gedreht und anschließend positioniert werden (siehe Animation unten).

Gegen Uhrzeigersinn drehen
Gegen Uhrzeigersinn drehen

Dieses Objekt wird wiederum über Bearbeiten – Duplizieren oder dem Shortcut STRG-D dupliziert, horizontal gespiegelt (Taste H) und auf der gegenüberliegenden Seite positioniert (siehe Animation unten).

Duplizieren, spiegeln, positionieren
Duplizieren, spiegeln, positionieren

Danach bringt ihr auf einer Seite ein Geschenkband an. Am Raster kann man sich gut orientieren und die Form mittig platzieren (siehe Bild unten).

Streifen für Geschenkband
Streifen für Geschenkband

Ein gespiegeltes Objekt wird an der gegenüberliegenden Seite angebracht. Eine weitere Kopie wieder gegen den Uhrzeigersinn gedreht und auf der Oberseite platziert. Eine letzte Kopie des Oberteils muß einfach nur gespiegelt werden (siehe Animation unten).

Weitere Teile duplizieren
Weitere Teile duplizieren

Zoomt man genügend in das Bild hinein kann man sich auch für den Aufbau der Schleife gut am Raster orientieren. Eine erste Trapezform wird mit dem Pfadwerkzeug gezeichnet und der Drehpunkt des Objektes wird ans innere Ende, auf die innere Kontur verschoben (siehe Animation unten).

Erstes Schleifenteil
Erstes Schleifenteil

Mit dem Pfad bearbeiten-Werkzeug zieht ihr jetzt die Seitenteile der Schleifen noch oben, damit sie fülliger erscheinen (siehe Animation unten).

Schleifen modellieren
Schleifen modellieren

Das erste Schleifenteil kann nun dupliziert und gespiegelt werden. Das Objekt lässt sich über das Raster leicht vorne rechts platzieren (siehe Animation unten).

Duplizieren, spiegeln, platzieren
Duplizieren, spiegeln, platzieren

Mit den hinteren Objekten wird auf die gleiche Weise verfahren (siehe Animation unten).

Hintere Schleifenteile
Hintere Schleifenteile

Das innere der Schleife besteht aus einem Rechteck. Der obere Bereich wird einfach angehoben (siehe Animation unten).

Innenteil aus Dreieck
Innenteil aus Dreieck

Hier kann dieser Teil jetzt unterbrochen werden. Der Rest der Arbeit besteht hier nur noch darin Farben zuzuweisen und hier und da kleine Optimierungen vorzunehmen. Daran knüpfen wir später wieder an.

 

Bauweise 2 – Mit Plugin

Für die zweite Bauweise wird das Plugin Axonometric Projection benötigt. Die Verwendung dieses kleinen Tools erlaubt es fast ausschließlich in der normalen 2D-Ansicht zu arbeiten.

Ausgangspunkt sind drei Quadrate. Diese drei Objekte decken das gesamte Paket ab, es sind die Oberseite, Seite links und Seite rechts (siehe Bild unten).

Paket aus Quadraten
Paket aus Quadraten

Die eingefärbten Flächen dekorieren wir zusätzlich mit einem einfachen Muster aus Sternen. Alle Objekte müssen anschließend über Pfad – Objekt in Pfad umwandeln konvertiert und dann Seite für Seite gruppiert werden (siehe Bild unten).

Objekte in Pfade konvertieren
Objekte in Pfade konvertieren

Die nächsten Schritte werden an Kopien dieser 3 Quadrate vollzogen!

 

Axonometric Projection – Isometric Projection

Dann wird eine Seite gewählt, beispielsweise die Frontseite links und über Erweiterungen – Axonometric Projection – Isometric Projection aufgerufen (siehe Bild unten).

Plugin starten
Plugin starten

Im Dialogfenster kann die Seite bestimmt werden. In diesem Fall wird Isometric left-Hand Side gewählt und die Vorschau aktiviert. Das Ergebnis schaut gut aus. Das Muster stört die Berechnungen nicht, die Sterne werden gleich mit angepasst (siehe Bild unten).

Isometric Left Hand Side
Isometric Left Hand Side

Um die nächsten zwei Seiten mit dem Plugin zu bearbeiten, muss das Tool nicht geschlossen werden. Jeder Akt für jede Seite wird mit Anwenden beendet. Dann kann gleich das nächste Objekt gewählt werden, die Ansicht eingestellt und wiederum Anwenden gedrückt werden. Bis alle Seiten abgearbeitet sind (siehe Bild unten).

Fertiger Würfel
Fertiger Würfel

Den Würfel kann man beiseiteschieben oder löschen. Auf die originale werden jetzt Bänder aufgetragen. Alle Teile für jede Seite gruppiert und Kopien davon angelegt (siehe Bild unten).

Bänder anbringen
Bänder anbringen

Wird danach wieder das Plugin angewendet wird man sehen das auch das funktioniert (siehe Bild unten).

Paket mit Bändern
Paket mit Bändern

Das macht wagemutig. Auf der Oberseite werden Trapezformen (aus Pfaden erstellt) in der Hoffnung angebracht das auch die Schleifen vom Plugin mit verarbeitet werden (siehe Bild unten).

Schleifen anbringen
Schleifen anbringen

Wie man im Bild unten sehen kann funktioniert das, aber die Schleife wirkt platt und kein bisschen füllig. Kein Wunder. Das Plugin verzerrt zwar die Seiten aber modelliert keine Formen aus (siehe Bild unten).

Paket mit Schleife
Paket mit Schleife

Für den nächsten Schritt ist es gut zu wissen, dass die obere Fläche über das Plugin im Uhrzeigersinn gedreht wird. Dementsprechend können die Schleifen über die Pfade bearbeitet werden bis massige Schleifen entstehen (siehe Bild unten).

Schleifen ausarbeiten
Schleifen ausarbeiten

Das Ergebnis ist gar nicht mal schlecht. Nur es fehlt etwas Innenleben. Beziehungsweise der untere Bereich der Schleifen (siehe Bild unten).

Füllige Schleifen
Füllige Schleifen

Um das zu ändern dupliziert ihr einfach zwei Schleifen auf einer Achse, spiegelt sie, färbt sie dunkler als die Oberseite ein und senkt die Teile unter die Oberseiten ab (siehe Animation unten).

Oberseite kopieren und ausrichten
Oberseite kopieren und ausrichten

Auch auf dieses Objekt wird wieder isometric Projection angewendet. Das Ergebnis nach dem Plugin ist ganz gut, zumindest die Richtung stimmt. Durch die Verzerrung wirkt die Schleife nicht mehr ganz so üppig wie in der Ansicht oben (siehe Bild oben – unten).

Richtung stimmt
Richtung stimmt

In der Isometrischen Ansicht können die Teile der Schleifen über die Nodes der Pfade ausgearbeitet werden (siehe Animation unten).

Nodes bearbeiten, modellieren
Nodes bearbeiten, modellieren

Stück für Stück solltet ihr die Teile der Schleifen ausarbeiten bis sie so geworden sind wie ihr sie haben möchtet (siehe Bild unten).

Schleifenteile formen
Schleifenteile formen

Farben und weitere Elemente

Das Stadium der ersten Bauweise ist das die Unterseiten der Schleifen fehlen. Die lassen sich leicht modellieren und anbringen. Hier noch die Farbwerte der Einzelteile der Einfachheit halber in Hex-Werten (inklusive Alpha).

Farbwerte Liste
Farbwerte Liste

Die Verläufe der Schleifen sind lineare Verläufe und die Farbtöne leichte Abwandlungen der oben auflisteten Farben (siehe Bild oben).

An den Kanten oben links, oben rechts und vordere Kante können noch Konturen aufgebracht werden die in jedem Fall heller herausstechen können. Dank der Eigenschaften der Vektorgrafik kann das Motiv in jede beliebige Größe skaliert werden.

isometric XMAS Gift In Inkscape
Final Example

Im Bild oben seht ihr verschiedene Größen des Paketes. In der Version ganz rechts fällt auf das vor dem Skalieren übersehen wurde die Konturbreite automatisch anzupassen. Diesen Fehler macht ihr natürlich nicht. Das kann verhindert werden indem Konturen in Pfade umgewandelt werden. Oder über den entsprechenden Button der aktiviert werden sollte (siehe Bild unten).

Kontur skalieren
Kontur skalieren

Hinweis: Je größer das Motiv, desto mehr treten Details zum Vorschein. Es muss eventuell nachgearbeitet werden. Insbesondere wenn die hellen Kanten aufgetragen wurden, ist die Kontur in Pfade zu konvertieren und exakt an die Kanten anzupassen, weil es bei einer starken Vergrößerung mehr auffällt wie gearbeitet wurde. Besser ist in diesem Fall sogar das Brechen der Kanten bei den Flächen vorzunehmen und an die Konturen anzupassen.

Auch, wenn man sein Bild ausdrucken möchte empfiehlt es sich (klassischerweise) Konturen in Pfade umzuwandeln.

 

Categories
Inkscape Tutorials

Inkscape 232 – Orientalische Muster 3

Im dritten und letzten Teil dieser kleinen Serie wird ein weiteres interessantes Muster konstruiert. Betrachtet man das Motiv länger sieht man überall Sterne. Damit alles sauber und planmäßig verläuft sind einige Dinge zu beachten.

Skills: Easy+
Plugin: Nein
Download: Einzelteile in verschiedenen Konstruktionsstadien. Download via Mediafire.

 

Bei dieser dritten Variante an Muster gibt es einige kleine Ungereimtheiten, die man bemängeln könnte, aber sie ist auf diese Weise gut nachvollziehbar und recht einfach zu konstruieren. Letztendlich ist es ein schönes Muster, wenn man die winzigen Problemzonen nicht kennt und/oder bemerkt.

Inkscape Oriental Pattern 3 Example
Final Example

Voreinstellungen

Damit alles reibungslos verläuft sollte aktiviert werden das die Kontur beim skalieren ebenso skaliert wird (siehe Bild unten).

Kontur skalieren
Kontur skalieren aktivieren

Die Snapping-Funktion erleichtert das Ausrichten und platzieren der Objekte (siehe Bild unten).

Snapping aktivieren
Snapping aktivieren

Unsere Standardeinstellungen sind in den meisten Fällen das Einrasten am Rand des Dokumentes, am Seitengitter und an den Hilfslinien. Hin und wieder stört es zwischendrin, dann kann das Einrasten kurzzeitig deaktiviert werden (siehe Bild unten).

Dokumentenrand, Gitter, Hilfslinien
Dokumentenrand, Gitter, Hilfslinien

 

Das Muster

Das Muster besteht im Grund aus lediglich zwei Objekten. Ein 6-Eck und ein Stern mit 6 Spitzen. Beide ohne Füllung aber mit Kontur (siehe Animation unten).

Sechseck und Sternform
Sechseck und Sternform

Als Abstandhalter wird das äußere Sechseck dupliziert und mit gehaltener SHIFT und STRG-Taste skaliert. SHIFT + STRG erlaubt das skalieren aus der Mitte heraus. Dies ist der Punkt weshalb das skalieren der Kontur wichtig ist (siehe Bild unten).

Abstandhalter anbringen
Abstandhalter anbringen

Das innere Sechseck wird noch einmal dupliziert und gemäß dem Abstandhalter nach außen verschoben. In diesem Fall nach rechts oben. Die Kontur ist dann über Pfad – Objekt in Pfad umwandeln zu konvertieren. Bitte nicht den Fehler machen Pfad – Kontur in Pfad umwandeln einzusetzen (siehe Bild unten).

Duplikat verschieben
Duplikat verschieben

Alle Nodes des Sechsecks werden nun gelöscht, bis auf die, die rechts oben die Strecke bilden (siehe Bild unten).

Nodes löschen
Nodes löschen

Im Rotationsmodus wird der Mittelpunkt des Balkens ins Zentrum der Zeichnung versetzt (siehe Animation unten).

Drehpunkt versetzen
Drehpunkt versetzen

Auf diese Weise können Duplikate des Balkens rund um das Objekt verteilt werden. Der Abstandhalter wird nicht mehr benötigt (siehe Animation unten).

Balken duplizieren und rotieren
Balken duplizieren und rotieren

 

Objekte zerschneiden

Diese Balken müssen jetzt zerschnitten werden damit sie später gut zusammenpassen. Mit dem Pfad-Werkzeug wird zuerst eine kurze Strecke gezeichnet. Das Snapping hilft hier sich an den Nodes einer Seite des Sechsecks zu orientieren. So bleiben wir im Winkel.

Mit gehaltener SHIFT und STRG-Taste muss diese Linie über den unteren Anfasser soweit aufgezogen werden das die Strecke über die Balken außen hinausragen (siehe Animation unten).

Linie zum schneiden ziehen
Linie zum Schneiden ziehen

Auch bei dieser Linie versetzt ihr den Drehpunkt in das Zentrum der Zeichnung (siehe Animation unten).

Drehpunkt versetzen
Drehpunkt versetzen

Und auch von diesen Linien werden Duplikate rund um das Objekt verteilt (siehe Bild unten).

Linien duplizieren und rotieren
Linien duplizieren und rotieren

Der folgende Schritt ist wichtig. Alle diese Schneidelinien müssen gemeinsam markiert und darauf Pfad – Kombinieren angewendet werden. Die Balken hingegen sind jetzt über Pfad – Kontur in Pfad umwandeln zu konvertieren und danach über Pfad – Vereinigen zusammenzufassen.

Nun markiert ihr beide Objekt (Linien und Balken) und wendet Pfad – Division an. Eure Balken sollten sich daraufhin in kleine Einzelteile zerlegen (siehe Bild unten).

 

Zerschnittene Balken
Zerschnittene Balken

Die Seitenteile der Balken werden gelöscht und so entstehen angewinkelte Bereiche. Theoretisch sollten diese Enden beim Muster erzeugen gut zusammenpassen (siehe Animation unten).

Endstücke löschen
Endstücke löschen

Mit den gruppierten Einzelteilen zu einem einzigen Element kann durch aneinanderreihen das Muster entstehen (siehe Animation unten).

Muster durch aneinanderlegen
Muster durch aneinanderlegen

 

Problembehebung

Der ganz leichte Versatz der Dreiecke die ein wenig höher (beziehungsweise niedriger) liegen als die Sechsecke kommt dadurch das bei diesem Beispiel übersehen wurde die Linien zum Schneiden an die äußere Kante statt in die Mitte der Kontur zu setzen (siehe Animation unten).

Mitte - Ungünstig
Mitte – Ungünstig

Schneidelinien außen an die Balken versetzt. Der Balken gewinnt an Länge, wenn auch nicht viel aber gerade genug um die Linie auszugleichen (siehe Bild unten).

Schneidelinie außerhalb anlegen
Schneidelinie außerhalb anlegen

Die Kontrolle zeigt: einwandfrei!

Final - Example
Final

Dies war der dritte und letzte Teil dieser Miniserie. Es ist immer wieder interessant welche unterschiedlichen Lösungsansätze man finden kann. Viel Erfolg.

Categories
Inkscape Tutorials

Inkscape 231- Orientalische Muster 2

Das zweite Muster ist ebenso schnell aufgebaut wie das vorherige aus dem Beitrag Inkscape 230. Dieses Geflecht wird aus einem einzigen Trapez erstellt. Berechnet werden muss lediglich ein Wert des Objektes damit alles zusammenpasst.

Skills: Easy
Plugin: Nein
Download: Einzelteile in verschiedenen Konstruktionsstadien. Download via Mediafire.

 

Bei dem Muster in diesem Beitrag muss darauf geachtet werden das Höhe und Breite einem bestimmten Verhältnis entsprechen. Es ist eine einfache Rechnung, die man in Inkscape über die Maßeingabe ausführen kann.

Inkscape Oriental Pattern 2 Example
Final Example

Einfache Mathematik

Für dieses Beispiel wurde ein Balken aus einer Rechteckform gezogen der eine Breite von  220 Pixeln hat. Die Höhe spielt hier erst einmal keine Rolle, sie wird errechnet. Die Breite von 220 muss durch 2.3 geteilt werden. Das Ergebnis ergibt die Höhe des Balkens (siehe Bild unten).

Einfache Rechenaufgabe
Einfache Rechenaufgabe

Im Prinzip kann man also ein Quadrat von 220 x 220 Pixeln aufziehen und bei Inkscape oben in der Bemaßung dem Wert der Breite /2.3 anhängen (siehe Bild unten).

Rechnen über die Eingabe
Rechnen über die Eingabe

Inkscape errechnet das Ergebnis und passt den Balken dementsprechend an. Die Höhe ist in diesem Fall 95,65. Es ist günstig den Wert bis auf die beiden Nachkommastellen auszuschreiben denn so wird am Ende alles bestens zusammenpassen (siehe Bild unten).

Höhe = Breite / 2.3
Höhe = Breite / 2.3

Im Rotationsmodus wird der obere mittlere Anfasser bei gehaltener STRG-Taste beim Scheren zweimal einrasten (ergibt 30° Grad) lassen. Der Drehpunkt der so entstandenen Trapezform muss nun vom Zentrum des Objektes an die linke obere Ecke versetzt werden (siehe Animation unten).

Scheren und Drehpunkt versetzen
Scheren und Drehpunkt versetzen

Ein Duplikat dieser Form wird dupliziert und gegen den Uhrzeigersinn gedreht. Das Trapez sollte sich in aufrechtem Zustand auf die obere Kante des Originals setzen (siehe Animation unten).

Drehen und rotieren
Drehen und rotieren

Ein Duplikat  der Kopie wird dann wiederum gegen den Uhrzeigersinn gedreht und befindet sich somit an der linken äußeren Kante des Original (sehe Bild unten).

Weiteres Duplikat
Weiteres Duplikat

Das war’s auch schon. Dieses Gebilde kann jetzt gruppiert und Duplikate davon als Muster ausgelegt werden (siehe Bild unten).

Muster durch Duplikate
Muster durch Duplikate

Im Prinzip eine einfache Sache und man wird auf keinerlei Probleme stoßen. Wenn man sich an die Zahlen hält!

Tut ihr das nicht und probiert andere Werte (Verhältnis Höhe zu Breite) so wird das Muster nicht so zusammenpassen wie es gewünscht ist. Es lässt sich dann zusammenlegen, irgendwie, aber nicht an den Eckpunkten einrasten die nötig sind um zu einem guten Ergebnis zu kommen. Die Bereiche, die ein Sechseck ergeben sollen, werden keine Sechsecke sein und es entstehen zusätzlich dreieckige Lücken (siehe Bild unten).

Günstig und weniger günstig
Günstig und weniger günstig

Es hängt also alles von einem einzigen Wert ab. Ganz anders als bei Variante 1 aus dem vorangegangenen Beitrag wo relativ frei gearbeitet werden konnte.

 

Categories
Inkscape Tutorials

Inkscape 230 – Orientalische Muster 1

Mit diesem Beitrag startet eine kleine Serie zu orientalisch anmutenden Mustern und Ornamenten in drei Parts. In diesem ersten Teil soll ein relativ einfaches aber schönes Pattern auf der Basis eines Sechsecks erstellt werden.

Skills: Easy
Plugin: Nein
Download: Einzelteile in verschiedenen Konstruktionsstadien. Download via Mediafire.

 

Dieses erste Muster zum warm werden erfordert zwar auch Genauigkeit, kann aber recht unbeschwingt und ohne Kopfzerbrechen begonnen werden. Nicht alle Teile enden exakt ineinander was gewisse Freiheiten lässt (siehe Bild unten).

Oriental Pattern 1 - Final Example
Final Example

Voreinstellungen

Trotz aller Unbeschwertheit ist es ratsam sich das Snapping zu aktivieren (siehe Bild unten).

Einrasten aktivieren
Einrasten aktivieren

Die Einstellung am Dokumentenrand, an dem Seitenraster und an den Hilfslinien einrasten ist hier empfohlen (siehe Bild unten).

Seitenrand, Seitenraster und Hilfslinien
Seitenrand, Seitenraster und Hilfslinien

 

Konstruktion

Ohne das es genau auf das Maß ankommt sind doch ein paar Bedingungen zu erfüllen. Das erste Rechteck hat in diesem Beispiel eine Breite von 210 Pixel und eine Höhe von 16 Pixel. Das Rechteck ist am linken Seitenrand zu positionieren. Dank des Snappings wird es sich problemlos dort ausrichten lassen (siehe Bild unten).

Rechteck am linken Seitenrand
Rechteck am linken Seitenrand

210 geteilt durch 2 macht 105. Eine vertikal verlaufende Hilfslinie ist demnach auf Position x-Achse 105 Pixel zu platzieren (siehe Bild unten).

Hilfslinie setzen
Hilfslinie setzen

Nun wird ein Sechseck aufgezogen. Die Kante oben sollten sich links am Seitenrand und der unteren Ecke des Rechtecks befinden. Die rechte Kante sollte dort liegen, wo sich Hilfslinie und rechte Kante des Rechtecks kreuzen (siehe Bild unten).

Sechseck ausrichten
Sechseck ausrichten

Im Rotationsmodus wird das Rechteck über den oberen mittleren Anfasser geschert. Mit gehaltener STRG-Taste geschieht das in 15° Grad Schritten. Ihr lasst es zweimal einrasten (30° Grad). Dadurch versetzt sich das Rechteck links und muss wieder auf Position gebracht werden (siehe Animation unten).

Scheren und Position korrigieren
Scheren und Position korrigieren

Ihr solltet in diesem Stadium den Mittelpunkt/Drehpunkt des Rechtecks von der Mitte nach links unten versetzen (siehe Animation unten).

Drehpunkt versetzen
Drehpunkt versetzen

Anmerkung: Es wäre/ist auch ohne das Rechnen und die Hilfslinie möglich die Länge des Balkens frei zu bestimmen. Das Objekt muss nur über die Oberlänge des Sechsecks hinausragen.

Über den Shortcut STRG-D oder Bearbeiten – Duplizieren legt ihr ein Duplikat des Rechtecks an und rotiert es ebenfalls mit gedrückter STRG-Taste. Danach wird die linke Spitze versetzt wie in der Animation unten zu sehen ist (siehe Animation unten).

Rotieren und platzieren
Rotieren und platzieren

Diesen Vorgang wiederholt ihr so lange bis ihr einmal um das Sechseck herum seid und alle Seiten abgedeckt sind (siehe Bild unten).

Vorgang wiederholen
Vorgang wiederholen

Das Sechseckobjekt wird nicht mehr benötigt. Die Form gruppiert ihr und könnt vom ersten Element Duplikate anlegen. Aus diesen Duplikaten wird das Muster ausgelegt (siehe Animation unten).

Muster aus Duplikaten
Muster aus Duplikaten

Wer es ohne die Konturlinien haben möchte, dupliziert sich das Original einmal und schiebt es vorerst beiseite. Entfernt beim Original die Kontur und bei der Kopie die Füllung (siehe Bild unten).

Zwei Objekte, Füllung und Kontur
Zwei Objekte, mit Füllung und Kontur

Wurden die Balken über Pfad – Objekt in Pfad umwandeln konvertiert können die Nodes der oberen Kanten markiert werden und mit dem entsprechenden Werkzeug die Kontur an dieser Stelle unterbrochen werden (siehe Bild unten).

Kontur öffnen/schließen
Kontur öffnen/schließen
Bereich öffnen
Bereich öffnen

Beide Teile müssen dann wieder zentriert werden (siehe Bild unten).

Objekte deckungsgleich
Objekte deckungsgleich

Jetzt lässt sich das Muster auslegen und hat keine Kanten dort wo sich die Balken treffen (siehe Bild unten).

Durchgängige Balken
Durchgängige Balken

 

Für schlaue Füchse

Der aufmerksame Betrachter wird wohl bemerken das es zu diesem Muster noch eine zweite Möglichkeit der Konstruktion, nämlich über Dreiecke gäbe. Wäre ohne weiteres machbar (siehe Animation unten).

Alternative Bauweise
Alternative Bauweise

Muster ausknobeln ist Fun.

 

Categories
Inkscape Tutorials

Inkscape 229 – Schrift & Knoten aus Tauen

Angelehnt an das Tutorial Inkscape 143 aus dem Jahre 2017 wird hier detailliert das Erstellen einer Schrift aus Seilen beschrieben. Auf diese Technik aufbauend können auch Knoten dargestellt werden. Auch dazu sind Beispiele vorhanden.

Skills: Intermediate
Plugin: Nein

 

Die Technik, die hier angewendet wird, um ein Element zu zeichnen, aus dem dann ein Tau entsteht, unterscheidet sich nicht von der Vorgehensweise aus dem Jahr 2017.

Nautical Font - Example
Nautical Font – Example

 

Vorbereitungen

Als Erstes muss man sich eine geeignete Schrift aus seinem Sortiment heraussuchen oder eine Schrift downloaden. Größere Seiten die Schriften anbieten verfügen meist über eine Filtermöglichkeit sich 100 % freie Schriften anzeigen zu lassen. Die Hier verwendete Schriftart ist Freestyle Script.

Ein Schriftzug der nachgezeichnet werden muss legt ihr auf einer separaten Ebene bei 30 % Deckkraft ab (siehe Bild unten).

Schriftzug auf Ebene
Schriftzug auf Ebene

Danach zieht man sich ein einfaches Rechteck auf, das ungefähr der Breite der Schrift entspricht (siehe Bild unten).

Rechteck prüfen
Rechteck prüfen

Dann wird dieses Rechteck wieder horizontal ausgerichtet und von einem Quadrat überdeckt das leicht oben und unten übersteht (siehe Bild unten).

Seilelement vorbereiten
Seilelement vorbereiten

Im Rotationsmodus (Objekt zweimal anklicken) wird mit gehaltener STRG-Taste das Objekt über den mittleren Anfasser oben geschert. Ist die Form dreimal eingerastet stimmt der Winkel (siehe Animation unten).

Objekt scheren
Objekt scheren

Nun müsst ihr beide Objekte markieren und Pfad – Überschneidung anwenden. Übrig bleibt die ausgestanzte Form die das erste und einzige Element ergibt welches modelliert werden muss (siehe Animation unten).

Pfad - Überschneidung anwenden
Pfad – Überschneidung anwenden

Mit dem Pfad bearbeiten Werkzeug können die Konturen oben und unten nun abgerundet werden. Um die Form sauberer zu gestalten, kann man anschließend die Handles (Hebel) verwenden (siehe Animation unten).

Element formen
Element formen

Das Element ist sicher am Seitenrand abzulegen und das Dokument zu speichern, denn hin wund wieder stürzt Inkscape beim Verwenden von Pfadeffekten ab.

 

Schrift nachzeichnen

Das Thema lautet hier Muster an Pfad. Egal was man versucht es wird nicht gelingen eine Schrift in einen einfachen (!) Pfad zu konvertieren. Daher muss die Schrift mit dem Pfadwerkzeug nachgezeichnet werden.

Es beginnt mit dem Buchstaben N. Es ist von vorneherein klar, dass die Bereiche der Ecken zu spitz sind als das dort ein Seil gebildet werden könnte. Daher werden für den Buchstaben N drei Pfade gezeichnet (siehe Animation unten).

N aus drei Pfaden
N aus drei Pfaden

Alle drei Pfade erhalten nachher den gleichen Pfadeffekt (siehe Animation unten).

Drei separate Pfade
Drei separate Pfade

Über Pfad – Pfadeffekte ruft man sich nun das Pfadeffekt-Fenster auf. Dort klickt ihr auf das Pluszeichen um eine Auswahl zu treffen (siehe Bild unten).

Auswahlfenster öffnen
Auswahlfenster öffnen

Hier ist klar, man muss Muster entlang Pfad wählen. Die Ansicht entspricht der Inkscape Version 0.92.x. Verwendet ihr Inkscape 1.0 sieht die Umgebung etwas anders aus (siehe Bild unten).

Muster entlang Pfad
Muster entlang Pfad

Vor allem anderen müsst ihr euer Seil-Element nun auswählen und mit STRG-C (für Kopieren) in die Zwischenablage bringen!

In dem Muster entlang Pfad-Setting klickt ihr dann das kleine Clipboard. Bedeutet: Das Muster-Element aus der Zwischenablage wird verwendet. Musterkopien muss auf Wiederholt eingestellt sein und der Abstand ist so weit zu verringern bis alle Teile auf dem Pfad sauber beieinander liegen (siehe Bild unten).

Pfadeffekt Settings
Pfadeffekt Settings

Alle Teile sollten weder ineinander verlaufen noch Lücken zwischen den Mustern aufweisen. Mit dem Pfad bearbeiten-Tool kann der oberste Node des Pfads noch versetzt werden. Wahrscheinlich rückt auch bei euch noch ein Element nach. Besser oben ein Element mehr als zu wenig. Kann man immer noch verändern (siehe Bild unten).

Pfad nachträglich bearbeiten
Pfad nachträglich bearbeiten

Auf diese Weise arbeitet ihr euch Pfad für Pfad durch die Buchstaben. Immer wenn ihr denkt Bereiche seien zu spitz, um eine Kurve zu bilden, setzt ihr einen neuen Pfad an. Das wird beim A, beim U und beim N der Fall sein. Der Querstrich des T ist ebenfalls separat.

Die Elemente sind derzeit noch kombiniert und haben keine Füllfarbe, daher kann es sein das es eicht chaotisch ausschaut (siehe Bild unten).

Unbearbeiteter Buchstabe
Unbearbeiteter Buchstabe

Man kann sich schon eine Vorschau schaffen indem man die Teile entsprechend anhebt und/oder absenkt und mit einer Füllfarbe einfärbt (siehe Animation unten).

Anheben, einfärben, absenken
Anheben, einfärben, absenken

Das N besteht aus drei Pfaden. Jeder Pfad hat Seilelemente. Die Elemente können über Pfad – Objekt in Pfad umwandeln und danach mit Pfad – Zerlegen aufgetrennt und jedes einzelne Objekt bearbeitet werden (siehe Bild unten).

Objekte auftrennen
Objekte auftrennen

Beim N beispielsweise ist das wichtig um die Enden etwas gefälliger zu formen. Dazu können wieder die Handles an den Nodes mit dem Pfad bearbeiten-Tool verwendet werden. Bei anderen Buchstaben können/werden es andere Bereiche sein, die man nachzuarbeiten hat (siehe Animation unten).

Kritische Bereiche nachbearbeiten
Kritische Bereiche nachbearbeiten

Unten im Bild noch einmal die Pfade wie sie für die einzelnen Buchstaben gezeichnet wurden. A kommt zweimal vor, muss man also nur einmal bauen. Ebenso das T. Buchstabe A, U,N (klein) und K bestehen aus jeweils zwei Pfaden (siehe Bild unten).

Aufbau der Pfade
Aufbau der Pfade

Ein Buchstabe nach dem anderen mit dem Pfadeffekt versehen. Man sieht schon jetzt das es bei einigen Buchstaben eng wird (A, U,L und N). Das wird nachgearbeitet (siehe Bild unten).

Alle Buchstaben abarbeiten
Alle Buchstaben abarbeiten

Im Bild unten wurden Buchstaben schon weitläufiger verformt. Noch sind die Pfade nicht aufgelöst, sondern sind noch zu bearbeiten. Hier und da rückt ein Seilelement nach, was aber gewollt ist. Das N wurde zugunsten der Klarheit vereinfacht. Der Querstrick des T ebenfalls (siehe Bild unten).

Nachbearbeitete Buchstaben
Nachbearbeitete Buchstaben

Wie sich die Pfade im Laufe der Optimierungen verändert haben zeigt das Bild unten. Gezeichnet waren sie zu Anfang anders. Die Form heiligt die Mittel (siehe Bild unten).

Oben mit, unten ohne Seil
Oben mit, unten ohne Seil

Erst jetzt können die Pfade wie oben schon beschrieben über Pfad – Objekt in Pfad umwandeln konvertiert und anschließend über Pfad – Zerlegen voneinander getrennt werden (siehe Bild unten).

Pfadeffekt konvertieren
Pfadeffekt konvertieren

An manchen Stellen gibt es bei verschiedenen Buchstaben kritische Bereiche, die ihr nun leicht mit dem Pfad bearbeiten-Werkzeug ausbessern könnt (siehe Animation unten).

Problemzonen beseitigen
Problemzonen beseitigen

 

Knoten erstellen

Auf die gleiche Weise könnt ihr bei Knoten vorgehen. Oftmals reicht ein einziger Pfad aus der nur kopiert und meist horizontal gespiegelt werden braucht. Manche Knoten bestehen sogar nur aus einem Pfad mit Schlaufen (siehe Bild unten).

Knoten aufbauen
Knoten aufbauen

Im Beispielbild oben wurden keine Bereiche abgesenkt beziehungsweise angehoben. Aber löst ihr den Pfadeffekt auf, also trennt alle Einzelteile voneinander können bestimmte Bereiche durch Anheben/Absenken den gewünschten Effekt bringen und es scheinen lassen als würden die Seile verknotet sein. Es handelt sich hier immer nur um einige wenige Elemente, die derart verschoben werden.

 

Categories
Inkscape Tutorials

Inkscape 228 – Last Minute Halloween Design

Angefertigt wird eine schnell erstellte Halloween-Grafik die selbst in letzter Minute noch machbar ist. Ein Handabdruck wird getraced und so optimiert, dass die Menge der Nodes Inkscape bei der Bearbeitung nicht zum Absturz bringt.

Skills: Easy
Plugin: Nein
Download: Handabdruck als JPG mit 2080 x 2285 Pixel (72dpi) und Inkscape File. Download via Mediafire.

 

Um einen Handabdruck herzustellen, benötigt man lediglich einen Schul-Malkasten, die schwarze Farbe und einen Pinsel. Der Abdruck wird dann eingescannt und in Inkscape importiert.

Example
Example

 

Die Hand – Trace Vorgang

Nachdem die Hand in Inkscape importiert wurde wird der Trace-Vorgang über Pfad – Bitmap nachzeichnen gestartet.

Importierte Hand (STRG-i)
Importierte Hand (STRG-i)

Da die Hand später über eine große Anzahl von Nodes verfügt, wird der Helligkeitswert hoch eingestellt, damit nicht zusätzlich unnötig viele Punkte entstehen (siehe Bild unten).

Trace Settings
Trace Settings (Inkscape 0.94.2 Ansicht)

In Inkscape 1.0 schaut sie Ansicht leicht anders aus und auch der Wert ist ein anderer (siehe Bild unten).

Trace Settings (Inkscape 1.0 Ansicht)
Trace Settings (Inkscape 1.0 Ansicht)

Nach dem Trace liegt eine Zeichnung auf der Arbeitsfläche und die Vorlage kann entfernt werden (siehe Bild unten).

Fertige Zeichnung der Hand
Fertige Zeichnung der Hand

Derzeit besteht die Zeichnung aus 11.405 Nodes die stark reduziert werden können (siehe Bild unten).

Zeichnung mit 11.405 Nodes
Zeichnung mit 11.405 Nodes

Zum Reduzieren können mehrere Schritte abgearbeitet werden. Erster Schritt ist Pfad – Vereinfachen. Danach hat die Hand schon nur noch 1.511 Nodes und sieht immer noch gut aus (siehe Bild unten).

Pfad - Vereinfachen
Pfad – Vereinfachen

Danach folgt Pfad – Zerlegen. Das hat zur Folge, dass alle Teile voneinander getrennt werden und als Nebeneffekt, das alle Teile schwarz eingefärbt werden was einige Details entfernt, beziehungsweise unsichtbar macht. Die Teile liegen aber noch im Bild, nur eben schwarz eingefärbt (siehe Bild unten).

Pfad - Zerlegen
Pfad – Zerlegen

Aus der Hand-Mitte verschiebt man den vormals hellen Bereich des Handtellers und wendet dann, ohne diesen Bereich, auf die Hand und Einzelteile Pfad – Vereinigen an. So werden weitere Nodes durch unnötige Kleinteile entfernt.

Anschließend wird das Mittelstück wieder an seinen Platz verschoben und Pfad – Differenz angewendet. Der Handteller wird wieder ausgeschnitten (siehe Animtion unten).

Handteller ausarbeiten
Handteller ausarbeiten

Rund um die Hand befinden sich noch einzelne Nodes die nicht benötigt und gelöscht werden können (siehe Animation unten).

Verwaiste Nodes entfernen
Verwaiste Nodes entfernen

Was nun vorliegt ist der Handteller und die einzelnen Teile der Finger (siehe Animation unten).

Tiele der Hand
Tiele der Hand

 

Nachbearbeiten mit Tweak-Tool

Nun kommt das Tweak-Tool zum Einsatz (siehe Bild unten)

Die Welle - Das Tweak-Tool
Die Welle – Das Tweak-Tool

Eingestellt ist Teile des Pfades in eine beliebige Richtung verschieben, die Genauigkeit (nicht im Bild sichtbar) ist auf 50 gesetzt (siehe Bild unten).

Teile verschieben
Teile verschieben

Nun kann man unten, entlang des Hand Tropfen aus dem Hanteller heraus ziehen. Ein einfaches Oval wird über Pfad- Objekt in Pfad umwandeln konvertiert und der obere Node nach oben verschoben (siehe Animation unten).

Tropfen formen
Tropfen formen

Diesen Tropfen kann man sich beliebig duplizieren (STRG-D) und dann aus der Hand modellierten Gerinnsel anhängen und über Pfad – Vereinigen zusammenfügen (siehe Animation unten).

Tropfen ausarbeiten
Tropfen ausarbeiten

Über Ansicht – Umriss/Normal kann man kontrollieren ob sich noch unbemerkte verwaiste Nodes im Umfeld der Hand befinden (siehe Animation unten).

Nodes kontrollieren

 

Beschriftung

Wer möchte kann seine Hand nun noch beschriften. Als Font dient hier die kostenlose Schrift Zombie (siehe Bild unten).

Font: Zombie
Font: Zombie

Man kann die Schrift dann beispielsweise über Text – An Pfad ausrichten einem Kreispfad anhängen. Verläuft die Schrift unter der Hand muss der Pfad allerdings vorher mit Taste H horizontal gespiegelt werden (siehe Bild unten).

Text - An Pfad anheften
Text – An Pfad anheften

Bevor man den Text weiter verarbeiten kann muss er über Pfad – Objekt in Pfad umwandeln konvertiert werden, dann muss man mit SHIFT-STRG-G die Gruppierung aufgehoben und alle Teile über Pfad – Vereinigen wieder zusammengeführt werden. Danach kann auch der Text mit dem Tweak-Tool verformt werden (siehe Bild unten).

Text bearbeiten
Text nachbearbeiten

Happy Halloween!

Categories
Inkscape Tutorials

Inkscape 227 – Pfade, Halloween Cartoon Ghosts

Zum diesjährigen Halloween gibt es ein Tutorial zum Thema malen mit Pfaden und dynamischen Linien. Im Downloadpaket zum Beitrag befinden sich Skizzenzeichnungen mit verschiedenen Geistern die zur freien Verfügung als Vorlagen genutzt werden können.

Skills: Easy
Plugin: Nein
Download: Halloween Download-Special Inkscape-Datei plus Geister-Skizzen zum Nachmalen. Download via Mediafire.
Verwendete Schriftart: Zombie – von Rotodesign bei Dafont.com und ausgezeichnet als 100% free.

 

In schnellen Schritten wird in diesem Beitrag auf Besonderheiten beim Zeichnen von Pfaden mit Formen (Dreieck Anfang, Ellipse etc.) hingewiesen und in Windeseile ein dazu passender Schriftzug erstellt.

Final Example
Final Example

 

Dokument und Ebenen

Bei dieser Arbeit dreht sich alles um Pfade. Mit Pfaden wird die Kontur erstellt, die Hintergrundfarbe und die Schattierungen angelegt.

Im ersten Schritt ist die Vorlage mit STRG-I oder über Datei – Importieren in das Bild zu laden. Diese Vorlage wird in eine extra Ebene verlegt die verschlossen wird. Die Deckkraft der Ebene kann man nach Belieben reduzieren.

Dann wird eine weitere Ebene erstellt und in Kontur umbenannt. Auf dieser Ebene werden die Kontur-Pfade gezeichnet. Später kommen eine Color-Ebene für Kleinteile und Schatten, sowie eine BG-Ebene für den Hintergrund hinzu.

 

Pfade zeichnen

Als dynamische Linien bezeichnet man Striche, in diesem Fall gezogene Pfade, die sich verjüngen. Mit Verjüngen ist gemeint das diese Striche mal stärker mal dünner zu den Enden werden. Das verleiht Zeichnungen eine gewisse Dynamik.

Es wird das Pfad-Werkzeug aktiviert und in den Einstellungen oberhalb des Arbeitsbereichs kann man zwischen verschiedenen Optionen wählen. Hier sind lediglich Dreieck Anfang, Dreieck Ende und Ellipse interessant (siehe Bild unten).

Linien Form einstellen
Form einstellen

Im folgenden Bild sind 3 Linien abgebildet. Jede dieser Linien wurde von unten nach oben gezeichnet. Man beachte die Unterschiede. Links wurde Dreieck Anfang verwendet, in der Mitte Dreieck Ende und rechts die Ellipse angewandt (siehe Bild unten).

Verschiedene Linien
Verschiedene Linien

Man sieht oben im Bild deutlich den Unterschied. Noch besser zu erkennen ist es, wenn man die Linienstärke verändert. Jede dieser Linie verfügt neben den normalen Nodes über zusätzliche Anfasser, über die sie Stärke reguliert werden kann (siehe Bild unten).

Nodes für Eigenschaften
Nodes für Eigenschaften

Es sollte gleich dazu gesagt werden das jede dieser Strecken nur über zwei Nodes gezogen sind. Ein nicht ganz uninteressanter Hinweis, wie man noch sehen wird (siehe Bild unten).

Linien verändern
Linien verändern

Auf diese Weise, mit diesen Varianten von Linien wird die Geister-Vorlage Strich für Strich nachgezeichnet. Dabei wechselt ihr je nach Bedarf die Form der Linie (siehe Animation unten).

Konturen zeichnen
Konturen zeichnen

Auch diese Strecken außer den wurden bis hier her mit nur zwei Nodes gezeichnet. Außer den elliptischen, die bestehen bei Arm und Kopfaufsatz aus drei Nodes. Dies kann aber zur Folge haben das die Linien zu leblos und stellenweise etwas dünn wirken.

Gut zu wissen ist daher, das es bei dieser Art Linien darauf ankommt, wo sich zusätzliche Nodes befinden. Die Animation unten sollte das Ganze deutlich machen. Es beginnt mit zwei Nodes (Anfang und Ende), dann betrachtet den Effekt bei unterschiedlich platzierten Nodes (siehe Animation unten).

Position der Nodes
Position der Nodes

Man sieht also, das solche Linien die über zusätzliche Nodes an bestimmten Stellen verfügen, noch zusätzlich beeinflusst werden können. Zusätzliche Nodes, die sich nah beim Anfang der Linie befinden, verringern sogar die Stärke, während Nodes am Ende den gesamten Verlauf verstärken.

Auf diese Weise sollte es einfach sein den Character komplett nachzuzeichnen.

Alle Konturen zeichnen
Alle Konturen zeichnen

Für die Farbe des Geistes wurde die gesamte Form mit einem einfachen Pfad ohne Form noch einmal nachgezeichnet und mit Farbe gefüllt.

Color Ebene
Color Ebene

 

Der Schriftzug

Der Schriftzug ist ebenso einfach. Es wurde ein Text geschrieben und dann über Pfade – Objekt in Pfad umwandeln konvertiert. Danach muss die Gruppierung mit SHIFT-STRG-G oder über Objekt Gruppierung aufheben aufgehoben werden. Gleich danach werden alle Teile wieder mit Pfad – Vereinigen zusammengefügt. Dann eine Kopie des Textes anlegen und beiseite schieben.

Einer der Schriftzüge erhält eine Farbe nach Wahl und eine angemessen starke Kontur.

Der nächste Schriftzug wird über eine Schablone zerschnitten. Dazu malt ihr drei Linien mit dem Freihandlinien-Werkzeug bei einer geringen Glättung (circa 19) drei Linien im unteren Bereich jeder Zeile (siehe Bild unten).

Linien Zeichnen
Linien Zeichnen

Diese drei Linien werden über Pfad – Kombinieren zusammengefasst. Dann wählt man zusätzlich den Schriftzug aus und wendet Pfad – Division an. Der Schriftzug sollte sich dadurch in Einzelteile entlang den Linien auflösen. Die oberen Teile des Text können dann entfernt werden (siehe Animation unten).

Text zerlegen
Text zerlegen

Der verbliebene Rest wird dunkler eingefärbt als der eigentliche Schriftzug und darüber platziert. Dadurch wird der Text lebendiger und erhält etwas Tiefe (siehe Bild unten).

Happy Halloween!
Happy Halloween!

Halloween kann kommen. Wir hoffen euch gefallen die Skizzen der Geister und werdet daraus schöne Inkscape-Zeichnungen anfertigen.

 

Categories
Inkscape Tutorials

Inkscape 225 – Muster und gekachelte Klone

Im Beitrag Inkscape 224 wurde ein Zaun konstruiert und eine detailreiche Bauweise beschrieben. In diesem Teil geht es darum sich ein nahtloses Muster (Seamless Pattern) zu erstellen und über Gekachelte Klone den Zaun aufzubauen.

Skills: Easy
Plugin: Nein

 

In diesem Tutorial wird ein einfacher Maschendrahtzaun, optisch in einer vereinfachten Version konstruiert. Die Maschen aus Inkscape 224 bestanden aus mehreren Einzelteilen (siehe Bild unten).

Inkscape - Simple Fence
Vereinfachte Version

Es spricht aber nichts dagegen sich die Masche, zumal man sich nur einmal die Arbeit machen muss, ebenso detailliert wie im vorherigen Beitrag zu gestalten. Hier soll nur eine alternative Bauweise vorgestellt werden.

 

Der Aufbau

Es beginnt damit das man sich ein neues Dokument einrichtet. Breite und Höhe betragen 100 × 100 Pixel. Anschließend wird ein Quadrat aufgezogen, es erhält abgerundete Ecken, wird um 90 ° Grad rotiert und erhält eine Kontur von 7 Pixeln Stärke. Erst dann erhält die Raute die Abmessungen 200 × 200 Pixel (siehe Bild unten).

Muster
Muster

Vorzugsweise sollte das Dokument mit Hilfslinien versehen worden sein, damit das Muster und ein Duplikat sich einfacher ausrichten lassen können (siehe Bild unten).

Rauten ausrichten
Rauten ausrichten

Man könnte jetzt natürlich versucht sein den Konturen beziehungsweise Pfaden einfach zusätzliche Nodes hinzuzufügen (STRG-ALT-Klick mit Pfad bearbeiten-Werkzeug) und die Linie zu unterbrechen, um eine Überschneidung zu schaffen (siehe Bild unten).

Lücke schaffen
Lücke schaffen

Wie man im Bild unten unschwer erkennen kann entstehen auf diese Weise zwar Lücken, aber die Enden passen nur grob zueinander. Könnte man ausgleichen aber es ist zu viel Feinarbeit nötig (siehe Bild unten).

Unpassende Enden
Unpassende Enden

Außerdem hätte man zu diesem Zweck auch den Pfadeffect Knot wählen können der die Arbeit sich neue Nodes zu schaffen mit einem Klick erledigt hätte (siehe Bild unten).

Knot Pfadeffekt für Lücken
Knot Pfadeffekt für Lücken

 

Saubere Variante

Nur unwesentlich mehr Arbeit, aber sehr viel sauberer ist es hingegen die beiden Konturen in Pfade zu konvertieren (Pfad – Kontur in Pfad umwandeln) (siehe Animation unten).

Pfade konvertieren
Pfade konvertieren

Man kann dann beide Objekte markieren und Pfad – Differenz anwenden und erhält eine zerschnittene Seite mit Unterbrechungen (siehe Animation unten).

Pfad - Differenz
Pfad – Differenz

Das so entstandene Objekt kann danach dupliziert (STRG-D) und horizontal gespiegelt werden (Taste H). Platziert man vorher den Drehpunkt des Objektes im Bildzentrum, dann wird das Duplikat gleich perfekt aufgerichtet (siehe Animation unten).

Duplizieren und Spiegeln
Duplizieren und Spiegeln

Für die nächsten Schritte werden die beiden Werkzeuge Nodes öffnen und schließen genutzt (siehe Bild unten).

Öffnen, schließen
Öffnen, schließen

Jetzt gilt es die Lücken zu schließen. Dazu werden bei zwei Enden eines Drahtes die Nodes geöffnet (siehe Bild unten)

Nodes öffnen
Nodes öffnen

Und dann die gegenüberliegenden Nodes verbunden. Am Ende sollte sich die Lücke schließen (siehe Animation unten).

Verbindung schließen
Verbindung schließen

Dieser Vorgang wird bei beiden Schnittbereichen versetzt wiederholt (siehe Bild unten).

Masche erzeugen
Masche erzeugen

Abschließend werden alle Teile der Drähte entfernt, die über das Dokument hinaus stehen. So entsteht der Prototyp der Maschen (siehe Bild unten).

Bereiche säubern
Bereiche säubern

Beide Teile werden nun gruppiert und ein Duplikat der Gruppe einmal versetzt unten rechts angelegt. Diese beiden Teile werden noch einmal gruppiert (siehe Animation unten).

Duplizieren, positionieren
Duplizieren, positionieren

Jetzt könnt ihr Bearbeiten – Gekachelte Klone anwenden. Ihr braucht lediglich die Anzahl der Reihen und Spalten anzugeben und die Verschiebung pro Zeile und Spalte einzutragen.

simple Fence Pattern
Ergebnis

Wie gesagt spricht nichts dagegen sich eine Kachel/Muster auch hier detailliert wie in Inkscape 224 zu gestalten.

 

Categories
Inkscape Tutorials

Inkscape 224 – Zaun, Muster aus Pfaden für Beginner

In diesem Beitrag wird ein Maschendrahtzaun in Inkscape konstruiert und durch duplizieren, anheben und oder absenken zu einem zusammenhängenden Geflecht aufgebaut. Ebenfalls wird der neue Pfadeffekt Fillet/Chamfer eingesetzt aber auch eine Alternative dazu vorgeschlagen.

Skills: Easy
Plugin: Nein
Inkscape Version: Inkscape 1.0 Beta (optional)
Download: Inkscape Datei mit dem fertigen Zaunmuster und Warning-Schild. Download via Mediafire.

 

Das Beispielbild zeigt das vorläufige Ziel dieses Tutorial. Am Ende des Beitrags gibt es noch Tips für ganz Fleißige, die den Zaun gerne noch mit zusätzlichen Details verschönern möchten.

Fence in Inkscape
Zaun-Muster

 

Das Quadrat

Ein Maschendrahtzaun basiert meistens auf quadratischen Flächen auf. Daher wird als Erstes eine Rechteckform aufgezogen und um 90 ° Grad rotiert.

Quadrat aufziehen
Quadrat aufziehen

Dieses Quadrat dient als Vorlage für einen Winkel der nachher exakt mit anderen zusammenpassen sollte. Daher ist das Snapping (Einrasten in Inkscape) einzuschalten (siehe Animation unten).

Winkel nachzeichnen (einrasten)
Winkel nachzeichnen (einrasten)

Der Winkel wird dann mehrmals mit STRG-D Dupliziert und immer an das nächste untere Ende angelegt. Auch hier hilft das Einrasten für die Passgenauigkeit (siehe Bild unten).

Duplikate anlegen
Duplikate anlegen

Noch liegen alle zusammengelegten Objekte einzeln vor. Um das zu ändern werden alle Teile gemeinsam markiert und über Pfad – Kombinieren zusammengefasst. Sie sind jetzt noch kein komplett vereintes Objekt.

Dort wo die Teile beieinander liegen werden nämlich immer noch an den Ecken zwei Nodes angezeigt (Information unterhalb des Arbeitsbereich). Daher sind beide Nodes gemeinsam zu markieren und über den entsprechenden Button zu vereinigen (siehe Animation unten).

Merge Nodes
Knoten vereinigen

Wurden alle Nodes verschmolzen besteht das Objekt real nur noch aus einem Stück.

 

Fillet/Chamfer (Abrunden/Fasen)

Erfreulicherweise verfügt Inkscape 1.0 übe einen neuen Pfadeffekt Fillet & Chamfer (Abrunden/Fasen) genannt. Diesen Effekt mit den im Bild unten zu sehenden Einstellungen auf die Form angewendet runden die Ecken ab (siehe Bild unten).

Fillet & Chamfer
Pfadeffekt Abunden/Fasen

Hinweis: User die noch nicht mit Inkscape 1.0 arbeiten müssen auf der Strecke stattdessen in gleichmäßigem Abstand vom Eckpunkt händisch Nodes setzen. Neue Nodes können einer Strecke mit gedrückter STRG-ALT-Taste und einem Mausklick gesetzt werden. Der Eckpunkt ist dann zu löschen und die Kurve über die Handles zu formen.

Es gibt für User die vielleicht vorerst bei Inkscape 0.92.4 bleiben möchten ein ähnliches Plugin, das letztendlich, in etwas vereinfachter Weise, das Gleiche erledigt. Es nennt sich Roundet Corners ist nach der Installation unter Erweiterungen – Pfad modifizieren – Roundet Corners zu finden und kann bei Inkscape gedownloadet werden.

Ob Fillet & Chamfer oder handgemachte, abgerundete Ecken sollten dann alle spitzen Winkel abgerundet sein (siehe Animation unten).

Abegrundete Ecken
Abgerundete Ecken

Heran gezoomt sieht man die sauber entstandenen Bereiche deutlich (siehe Animation unten).

Clean Corners
Clean

 

Zerschneiden vorbereiten

Was benötigt wird sind an den runden Ecken geschnittene Einzelteile. Dazu zieht man eine feine Linie mit einer Konturstärke von 0,1 Pixel. Man wird davon kaum was sehen, aber die geringe Stärke ist nötig um keine Lücken durch die Schnitte entstehen zu lassen (siehe Bild unten).

Haarlinien in Eckbereichen
Haarlinien in Eckbereichen

Die Linie ist zu duplizieren und auf alle Eckbereiche zu verteilen. Dann werden alle Haarlinien gemeinsam markiert und über STRG-+ (STRG-Pluszeichen) zu vereinigen (siehe Animation unten).

Linien positionieren
Linien positionieren

Ihr könnt jetzt beide Objekte auswählen und über Pfad – Pfad Zerschneiden in Einzelteile zerlegen (siehe Animation unten).

Pfad - Pfad zerschneiden
Pfad – Pfad zerschneiden

Dank der feinen Kontur die zum Schneiden genutzt wurde liegen alle Teile fast wie unberührt beieinander. Die Kontrolle zeigt: Es handelt sich um Einzelteile (siehe Animation unten).

Erfolgreich zerlegt
Erfolgreich zerlegt

Bisher bestehen alle entstandenen Objekte aus einfachen Pfaden, also Konturen. Das war bisher auch gewünscht, wird sich aber zumindest teilweise in den nächsten Schritten ändern. Da mehrere Schichten übereinander gelegt werden müssen, um einen guten Effekt zu erzielen, müssen die Teile zusammenhängen drei, besser viermal dupliziert und getrennt voneinander platziert werden (siehe Bild unten).

Duplizieren und trennen
Duplizieren und separieren

 

Finales Bearbeiten

Beginnen wir mit der Feinarbeit bei der dunkelsten Variante der Objekte. Sie sollen die Outlines der Drähte bilden. Dazu wird ein erstes Teilstück genommen und über Pfad – Kontur in Pfad umwandeln konvertiert (Step 1). Bei dem so entstandenen Polygon wird die Füllung entfernt (Step 2) (siehe Animation unten).

Pfad konvertieren
Pfad konvertieren

Danach werden jeweils immer die beiden Nodes an den Enden markiert und die Linie unterbrochen (entsprechende Pfad bearbeiten-Buttons befinden sich oberhalb des Arbeitsbereich) (siehe Bild unten).

Pfade öffnen
Pfade öffnen

Diese Form bestehend aus zwei parallelen Linien kann dann über den Draht gelegt werden (siehe Bild unten).

Konturen für die Drähte
Konturen für die Drähte

In dem Beispielaufbau hier treten zwei unterschiedliche Varianten von Teilstücken auf. Die oberen beiden Teile, die ansonsten identisch sind, nur gespiegelt und die inneren Drähte mit zwei Bogenformen an zwei Enden. Beide Formen müssen auf die gleiche Weise wie oben beschrieben bearbeitet werden (siehe Bild unten).

Bogenformen bearbeiten
Bogenformen bearbeiten

Um ein Verschieben zu vermeiden, solltet Ihr immer zwei zueinander gehörende Teile, Draht und Außenkontur gruppieren (STRG-G) (siehe Animation unten).

Paarweise gruppieren
Paarweise gruppieren

 

Maschen auslegen – Teile anheben

Die so vorbereiteten Teilstücke können jetzt alle gemeinsam ausgewählt, dann dupliziert und über den Shortcut H horizontal gespiegelt (vertikal spiegeln wäre dementsprechend Taste V) und verschoben werden (siehe Animation unten).

Duplizieren, spiegeln und verschieben
Duplizieren, spiegeln und verschieben

Nun müsst Ihr nur noch der Reihe nach die Einzelteile durchgehen und immer versetzt die Drähte anheben unter denen andere Drähte hindurchlaufen und so die typischen Maschen ergeben (siehe Animation unten).

Muster durch Anheben bilden
Muster durch Anheben bilden

 

Zusätzliche Details

Ein Beispiel dafür wie man den Drahtzaun noch durch zusätzliche Details anreichern kann ist im Bild unten gegeben. Zum einen sind zusätzliche Linien für Highlights angebracht und zum anderen wurden überlaufende Bereiche mit Schatten unterlegt (siehe Bild unten).

Detailreiche Variante
Detailreiche Variante

Auch diese Schritte lassen sich im Vorfeld planen und in die Gruppe von gemeinsamen Objekten pro Teilstück gruppieren. Das ist der Punkt wo angemerkt wurde sich drei oder besser 4 Duplikate der noch unbearbeiteten Einzelteile anzulegen.

Eine Beispieldatei mit einer solchen Ecke, fertig vorbereitet zum Anschauen und nachmachen, könnt Ihr Euch ebenfalls hier via Mediafire downloaden.