Vektorbasierte Pinsel und Musterpinsel für Grafikanimationen verwenden.
Erstelle mit Capture eigene Pinsel für Animationsprojekte in Animate.
Veröffentlicht am
Speichere die Beispielpinsel in deiner Creative Cloud-Bibliothek. Du musst bei Creative Cloud angemeldet sein, um die Bibliothek in deinem Konto speichern zu können.
Mit vektorbasierten Pinseln animierte Laser-Strahlen zeichnen.
In Animate sind Pinselstriche Vektorgrafiken. Du kannst Striche skalieren, verschieben, kolorieren und animieren.
Eine der großartigsten neuen Funktionen von Adobe Animate CC ist das Pinsel-Werkzeug (Paintbrush).
Es ermöglicht Ihnen, Vektorbilder und Musterpinsel in Ihren kreativen Projekten zu nutzen.
Hier haben wir eine Animation, die fast vollständig ist.
Das Einzige, was fehlt, ist der zweite Feuerschuss, der in diese Zeitspanne hier gehört.
Bevor wir uns darum kümmern, gehen wir in die Boden-Ebene und entsperren sie.
Wir werden das Pinsel-Werkzeug verwenden und einen Stil aus unserer Pinsel-Bibliothek auswählen.
Um auf die Pinsel-Bibliothek zuzugreifen, klicken wir einfach auf dieses Symbol hier, wobei unser Pinsel-Werkzeug ausgewählt ist.
Dort können wir aus einer Reihe unterschiedlicher Vektorbildpinsel wählen, die im Paket von Animate CC enthalten sind.
Ich möchte diesen hier verwenden.
Ich kann einfach darauf doppelklicken, und schon ist er als Stil im Eigenschaften-Bedienfeld geladen.
Wenn das erledigt ist und die Boden-Ebene ausgewählt wurde, kann ich hier einige zusätzliche Schatten erzeugen.
Sie merken, dass sie sehr blass sind.
Also kann ich meinen Strich ein wenig verstärken, und wir sehen, wie sich das hier darstellt.
Zusätzlich haben wir eine Reihe von Glättungsoptionen.
Das Glätten geht von 0 bis 100.
Dies ist ein Wert dafür, wie stark Animate unsere Konturen glättet, wenn wir das Pinsel-Werkzeug verwenden.
Wenn wir überhaupt keine Glättung wollen, können wir auswählen, dass Animate CC unsere Striche begradigen soll.
Hier ist also „Begradigen“ (Straighten).
Oder wir stellen ein, dass Animate CC gar nichts tun soll.
Dann werden Abweichungen aller Art in den Linien beibehalten.
Der Standard ist „Glätten“ (Smooth), wobei ein Grundmaß an Glättung angewendet wird.
Entfernen wir nun diese Vektoren hier und sperren wir unseren Boden wieder.
Dieser erste Feuerschuss wurde mithilfe des Pinsel-Werkzeugs erzeugt, ohne Anwendung irgendwelcher Vektorbildpinsel, nur ein konischer Strich mit variabler Breite.
Wenn wir also unser Pinsel-Werkzeug auswählen, können wir sehen, dass darauf gerade kein Vektorbild und keine Pinsel hier in „Strichstil“ angewendet sind.
Bei der Breite wählen wir einfach „Breitenprofil 1“ (Width Profile 1) aus, und Sie können sehen, dass es an beiden Enden konisch ist.
Auf diese Weise können Sie mit dem neuen Pinsel-Werkzeug diese schönen glatten Linien erzeugen.
Wir werden ebenfalls das Pinsel-Werzeug einsetzen, dieses Mal mit erweiterten Vektorbildpinseln, angewendet auf den zweiten Feuerschuss.
Um dies zu tun, gehen wir zurück zu Frame 65, und Sie werden bemerken, dass hier bereits einige leere Keyframes zu finden sind.
Der Pinsel existiert also nur innerhalb dieser Zeitspanne von Frames.
Öffnen wir nun unser CC-Bibliotheken-Bedienfeld.
Eine Reihe von Vektorbildpinseln wurde sogar bereits erstellt, und zwar mit Adobe Capture CC, einer mobilen App, die Sie sowohl unter iOS als auch unter Android verwenden können.
Wir wählen nun also einen dieser Pinsel aus.
Wir stellen sicher, dass das Pinsel-Werkzeug ausgewählt ist, und wählen dann diesen speziellen Pinsel aus, um ihn in unseren Stil zu laden.
Wir werden jetzt einen ersten Feuerschuss zeichnen.
Ich beginne also an der Waffe hier und ziehe ihn einfach heraus, ungefähr dorthin.
Sie sehen, dass das Objekt noch nicht wie ein Schuss aussieht.
Wir können jedoch das Auswahl-Werkzeug verwenden, um einige Eigenschaften dieses Pinsels zu ändern.
Ich kann zum Beispiel eine schöne hellrote Farbe auswählen.
Ich kann die Strichgröße auch deutlich erhöhen.
Setzen wir sie auf etwa 90.
Und damit es mehr wie ein Schuss aussieht, wenden wir darauf ein Profil mit variabler Breite an.
Ich wähle das Breitenprofil 5 aus.
Die Strichgröße nur noch ein klein wenig mehr erhöhen, und jetzt haben wir es.
Sie sehen, dass ich mit dem Auswahl-Werkzeug in der Lage bin, auch ohne Auswahl fortzufahren und den Pfad selbst zu ändern, ganz so, wie ich es mit jeder anderen Form in Animate machen könnte.
Um einen darauffolgenden Animations-Frame zu erzeugen, wähle ich Frame 66 aus und klicke auf „Einfügen“ (Insert), „Zeitleiste“ (Timeline), „Keyframe“.
Dies erzeugt eine exakte Kopie von dem Inhalt des vorherigen Frames.
Hier kann ich Einstellungen daran vornehmen.
Wenn ich zum Beispiel die Alt-Taste auf meiner Tastatur gedrückt halte und auf die Seite hier klicke, kann ich den Feuerschuss herausziehen.
Ich kann seine Farbe ändern und sogar die Strichgröße verkleinern.
Ich werde in jedem dieser Keyframes eine neue Variation dieses Vektors erstellen, um die animierten Laser-Strahlen zu simulieren.
Dies wird eine ganze Weile dauern.
Deshalb überspringe ich das und nehme etwas, was bereits erstellt wurde.
So, hier habe ich in der Ebene „beam2“ das Zeichnen für die einzelnen Keyframes erledigt und sogar etwas Animation in der Ebene „pulse“ hinzugefügt.
Wenn wir auf den ersten Frame hier klicken, sehen wir, dass die Ebene „pulse“ denselben Bildpinsel verwendet.
Ich habe diesen Schuss als Symbolart „Movieclip“ (Movie Clip) definiert, da ich möchte, dass seine interne Zeitleiste fortlaufend in einer Schleife abgespielt wird, unabhängig davon, was auf der Hauptzeitleiste passiert.
Die Feuerschuss-Animation selbst existiert nur auf der Hauptzeitleiste, wobei Frames und Animationen sich auf die Gesamtfilmlänge beziehen.
Wenn wir die Frames durchgehen, sehen Sie, dass sich der Feuerschuss manchmal verbiegt.
Also können wir das Auswahl-Werkzeug verwenden, um die Schussrichtung so zu verbiegen.
Und wir können die Farben, die Länge und so weiter ändern, während wir die Frames durchgehen.
Am Ende wird er schwächer und verschwindet.
Ich habe diese Animation vorher bereits als Video gerendert.
Sehen wir uns das an.
Fantastisch!
Im nächsten Video erfahren Sie, wie Sie in Animate CC Ihre Vektorbildpinsel in Musterpinsel umwandeln.
Glatte Pfade (1:12) – Vektorbasierten Pinsel erstellen (2:15) – Keyframes (2:30) – Pinsel in Capture (2:43) – Zweiten Laser-Strahl zeichnen (3:15) – In Keyframes animieren (3:54) – Als Movieclip-Symbol kennzeichnen (4:54)
Eigene Pinsel erstellen.
Bearbeite einen in Animate erstellten Kunstpinsel. Wandle den Kunstpinsel anschließend in einen Musterpinsel um.
Bei der Verwendung von Vektorbild- und Musterpinseln in Adobe Animate CC sind Sie nicht auf die Pinsel beschränkt, die Sie in der integrierten Pinsel-Bibliothek finden.
Sie können mit der App Adobe Capture CC auch Ihre eigenen Pinsel erzeugen und sogar Aspekte für Ihre Pinsel in Animate selbst bearbeiten.
Wir haben gerade gesehen, wie eine Animation unter umfassender Verwendung von Vektorbildpinseln erstellt wurde, die aus der App Capture CC stammen und über Creative Cloud Libraries in Animate übertragen wurden.
Öffnen wir jetzt wieder unser CC Libraries-Bedienfeld.
Sie sehen, dass wir hier unten einen „Gras-Pinsel“ (Grass Brush) haben.
Wir werden diesen Gras-Pinsel verwenden, um ein paar Grasbüschel in unserer Landschaft zu erzeugen.
Hierfür wählen wir unser Pinsel-Werkzeug aus und rufen bei geöffnetem Eigenschaften-Bedienfeld zusätzlich das CC Libraries-Bedienfeld auf, sodass wir jetzt auf den Gras-Pinsel doppelklicken können und sehen, wie er in unserem Stil-Fenster angezeigt wird.
Ich wähle nun eine schöne dunkelgrüne Farbe aus, vielleicht die von seiner Weste.
Außerdem erhöhen wir den Alpha-Wert auf, sagen wir, 82.
Das Breitenprofil soll in diesem Fall gleichmäßig sein.
Den Strich legen wir irgendwo bei 25, 27 fest.
In diesem Fall möchte ich meinen Pinselpfad begradigen.
Also wähle ich „Begradigen“ (Straighten) als „Pinselart“ (Paint Brush Mode).
Hierfür entsperren wir erneut unsere Boden-Ebene.
Wir sperren die Ebene „pulse“ und „beam2“, da wir sie nicht mehr bearbeiten werden.
Ich kann hier also einfach ein kleines Grasbüschel malen, und wenn ich es mit dem Auswahl-Werkzeug auswähle, sehen wir den Pfad.
Ich kann auch die Strichstärke anpassen, um das Büschel besser sichtbar zu machen.
Das ist jetzt nicht die beste Farbe.
Ich nehme eine andere Farbe, die besser zu sehen ist.
Eine wie diese dunkelgrüne Farbe hier.
Nun, das ist natürlich ein Vektorpfad, daher können wir Änderungen am Büschel vornehmen, indem wir mit dem Auswahl-Werkzeug einfach darüberfahren und ihn anpassen, wie wir es mit den Feuerschüssen getan haben.
Wenn wir jedoch ein Muster erstellen wollten, könnten wir natürlich eine Reihe von Büscheln malen.
Aber das wollen wir nicht.
Wir wählen alle vier Büschel aus und löschen sie.
Wir wählen erneut unser Pinsel-Werkzeug aus.
Und statt den Pinsel so zu verwenden, wie er ist, bearbeiten wir ihn zunächst.
Dafür klicken wir auf das kleine Symbol „Strichstil bearbeiten“ (Edit Stroke style), das aussieht wie ein Stift.
Hier sehen Sie eine Vorschau Ihres Bildpinsels und können ihn umbenennen, wenn Sie möchten.
Ich nenne ihn „Grass Brush Modified“.
Hier können wir ihn proportional skalieren und sehen gleich in einer Vorschau, wie er tatsächlich aussehen wird.
Wir könnten auch die Richtung ändern, in der unser Bild am Strich ausgerichtet wird.
Wir können ihn strecken, sodass er der Länge unseres Strichs entspricht, oder den Standard verwenden, also „Zwischen Hilfslinien einpassen“ (Stretch between guides).
Wenn wir wollen, könnten wir jetzt die Führungslinien so anpassen, dass die Skalierung dazwischen erfolgt.
Wir können „Ecken und Kanten nicht anpassen“ (Do not adjust corners and folds) auswählen oder „Ecken und Kanten anpassen, um Überlappungen zu verhindern“ (Adjust corners and folds to prevent overlap), indem wir diese Option hier auswählen.
Diese Optionen sind alle gut, aber sie beziehen sich auf Bildpinsel.
Sie sehen jedoch, dass wir hier ein Dropdown-Menü haben, in dem wir auswählen können, dass unser Bildpinsel in einen Musterpinsel konvertiert werden soll.
Und genau das wollen wir in diesem Fall tun.
Wenn wir zum Musterpinsel wechseln, erhalten wir eine Mustervorschau.
Außerdem können wir unser Bildmaterial spiegeln, entweder horizontal oder vertikal.
Wir haben außerdem die Option „Auf Auswahlgröße skalieren“ (Stretch to fit) und „Freiraum einfügen“ (Add space to fit).
Hier sehen Sie, dass Abstände zwischen jeder Anwendung unseres Musters hinzugefügt werden.
Wie groß diese Abstände sind und wie viele Anwendungen des Musters tatsächlich eingefügt werden, hängt davon ab, wie lang die einzelnen Pfade sind.
Wir können außerdem „Ungefährer Pfad“ (Approximate path) auswählen und sehen auch hier die Vorschau.
Wir können die Abstände prozentual ändern, also vielleicht 50 %.
Und wir sehen das hier dargestellt.
Ich werde das zurück auf 0 setzen.
Und als Letztes können wir auswählen, wie mit Ecken umgegangen werden soll.
Sie sehen, dass wir in der Vorschau zwei Ecken haben.
Und jetzt stellen wir das Bildmaterial nebeneinander (Flank artwork).
Wir können auch „Ohne“ (None) auswählen.
Dann werden die Ecken gar nicht bearbeitet.
Wir können das Bildmaterial zentrieren (Center artwork).
Sie können also in diesen Fällen sehen, dass das Bildmaterial an den Ecken zentriert ist.
Dies ist „Nebeneinanderstellen“ (Flank), die Standardeinstellung.
Wir könnten auch das Bildmaterial segmentieren (Slice artwork).
Sie können sehen, dass die Ecken hier sehr schön umgesetzt werden.
Und schließlich „Bildmaterial überlappen“ (Overlap artwork), wobei das Bildmaterial überlappt und in den Ecken gebündelt wird, so wie hier.
Ich gehe zurück und wähle die Standardeinstellung, also „Bildmaterial nebeneinanderstellen“ (Flank artwork).
So ist alles sehr schön angepasst und sieht sehr natürlich aus, da es sozusagen in die Ecken gepresst und aus ihnen heraus aufgefächert wird.
Sagen wir jetzt also „Hinzufügen“ (Add).
Danach sehen wir in unserer Stil-Vorschau, dass wir tatsächlich einen Musterpinsel verwenden.
Und wenn wir alle diese kleinen Grasbüschel hier zeichnen, sehen wir, wie sie in unserer gesamten Szene ihre Wirkung entfalten.
Wir können sie sogar ein bisschen stapeln, wenn wir das möchten, bis es gut aussieht.
Okay, und jetzt rendern wir diese Animation und sehen sie uns in der Vorschau an.
Es gibt wirklich unendlich viele Möglichkeiten für die Verwendung der erweiterten Pinsel in Adobe Animate CC.
Gras-Pinsel in Capture (0:34) – Pinsel zu Stilen hinzufügen (0:52) – Gras zeichnen und bearbeiten (1:40) – Kunstpinsel bearbeiten (2:20) – Kunstpinsel in Musterpinsel umwandeln (3:15) – Einstellungen für Musterpinsel (3:33) – Mit Musterpinseln zeichnen (5:20)
Das Ergebnis präsentieren.
Teile deine Animation in sozialen Netzwerken mit dem Hashtag #MadeWithAnimate.
