Hallo zusammen, willkommen zu meinem Tutorial!!

 

Das Hinzufügen von Animationen zu Licht und Hintergrund ist eine der schnellen Möglichkeiten, Ihre Kunst als animierte Illustration zu präsentieren.

In diesem Tutorial zeige ich Ihnen 4 Animationstechniken aus den Funktionen von Clip Studio, mit denen Sie durch die Bewegung des Lichts, der Kameraansicht und des Hintergrunds eine animierte Illustration erstellen können.

Video-Anleitung

Die Videoversion, wenn Sie den gesamten Prozess in Aktion sehen möchten >w<

Vorbereiten der Datei

Beginnen wir mit der Vorbereitung der Datei.

Für die animierte Illustration empfehle ich, auf einer neuen Leinwand zu arbeiten, damit Sie nicht mit den Ebenen durcheinanderkommen.

Erstellen Sie eine neue Datei.

Im Projekt: [Illustration] haben Sie die Möglichkeit, eine animierte Illustration zu erstellen.

Sie können die Cels und die Bildrate einstellen.

Eine höhere Bildrate sorgt für flüssigeres Bild, verkürzt aber die Wiedergabezeit

(Diese Option ist sehr nützlich für die Clip Studio Paint Pro-Version, die eine Begrenzung von 24 Cels für Animationen hat)

 

Wenn Sie die Datei erstellen, haben Sie einen Animationsordner und die Zeitleiste aus Ihren Einstellungen.

Sie können das Zeitleistenfenster über [Fenster>Zeitleiste] öffnen.

 

Hinweis: Wenn Sie die ältere Version von Clip Studio verwenden, die diese Option nicht hat,

können Sie sie erstellen, indem Sie auf das Symbol [Neue Zeitleiste] im Zeitleistenfenster klicken und die Wiedergabezeit (Cels) und Bildrate manuell einstellen.

Löschen Sie den Animationsordner (wir verwenden ihn hier nicht)

 

Importieren Sie dann die Datei** (.csp-Format) auf die Leinwand

 

Gehen Sie zu [Datei > Importieren > Dateiobjekt erstellen]

Das importierte Objekt ist nicht transparent.

Löschen Sie die Papierebene in der Originaldatei

Datei speichern..

Das Dateiobjekt wird automatisch aktualisiert.

Jetzt können Sie das Bild verschieben, ohne die Originaldatei zu berühren,

und schon sind Sie bereit für die Animation!

 

Hinweis: Wenn die Datei beim Speichern nicht automatisch aktualisiert wird,

aktualisieren Sie sie manuell über das Menü im Bereich [Werkzeugeigenschaften] des Werkzeugs [Objekt]

Technik Nr. 1: Opazität animieren

Lasst uns einen coolen Sechseck-Hintergrund mit Lichtanimation erstellen

Ich habe ein Sechseck-Material von Clip Studio Asset heruntergeladen.

Das heruntergeladene Asset befindet sich im Ordner [Download] im Bedienfeld [Materialien].

Ziehen Sie das Material in das Ebenenbedienfeld unter die Ebene mit dem Charakterobjekt.

Treffen Sie eine Auswahl aus der Objektebene

[Rechtsklick > Auswahl aus Ebene > Auswahl erstellen]

Erstellen Sie eine neue Rasterebene

Wenn die Linie zu dick ist, können Sie die Auswahl verkleinern, bevor Sie die Farbe füllen

Durch die Verkleinerung der Auswahl bleibt eine Lücke am Rand der Leinwand.

Passen Sie die Größe so an, dass der Leinwandbereich gefüllt wird [Bearbeiten > Transformieren > Skalieren/Drehen] (oder [Strg+T])

Kopieren Sie die Ebene und wenden Sie den Weichzeichnerfilter an,

gehen Sie zu [Filter > Weichzeichnen > Gaußscher Weichzeichner]

Dadurch erhalten die Sechseckkacheln eine gewisse Tiefe.

Legen Sie beide Ebenen in einen Ordner.

Dies ist die Version ohne Licht des Hintergrunds.

Erstellen Sie als Nächstes die Light-On-Version des Hintergrunds.

Kopieren Sie den Hintergrundordner

Sperren Sie die Transparenz auf beiden Ebenen und füllen Sie mit der hellen Farbe

Jetzt haben wir 2 Versionen des Hintergrunds: Licht an und Licht aus

Wählen Sie im Fenster [Zeitleiste] den Ordner „Light-On“ aus und klicken Sie auf das Symbol [Ebenen-Keyframe aktivieren].

Erweitern Sie die Ebenenoption im Zeitleistenfenster [+]

Sie sehen die Zeitleiste für die Deckkraft.

Wählen Sie die Position für das Startbild auf der Deckkraft-Zeitleiste.

Dann stellen Sie die Deckkraft auf 0 ein

Der Keyframe wird automatisch auf der Zeitleiste angezeigt

Legen Sie das Endbild fest und klicken Sie auf das Symbol [Neues Keyframe].

Dadurch wird ein neues Keyframe mit der gleichen Einstellung wie das Startbild erstellt.

Wählen Sie die Position zwischen den beiden Keyframes,

Passen Sie die Deckkraft der Ebene auf bis zu 100 an,

der Keyframe wird automatisch erstellt!

Klicken Sie auf die Schaltfläche „Wiedergeben“, um eine Vorschau der Animation anzuzeigen.

Jetzt erhalten Sie ganz einfach den beleuchteten Hintergrundeffekt

Sie können die Geschwindigkeit der Animation anpassen, indem Sie die Position des Keyframes anpassen.

Jetzt ist es langsamer

Fügen wir auch die Lichtreflexion auf der Figur hinzu!

Treffen Sie eine Auswahl auf der Figurobjektebene und erstellen Sie eine neue Rasterebene

Gehen Sie dann zu [Bearbeiten > Auswahl umreißen] und geben Sie der Linie etwas Dicke

Auswahl aufheben und Rand verwischen.

Dadurch wird einfach die Hervorhebung am Rand des Charakters hinzugefügt.

 

Bearbeiten Sie einige Details manuell, wenn Sie möchten

Setzen Sie den Ebenenmodus auf [Add(glow)]

und schneiden Sie ihn an das Charakterobjekt an

Reduzieren Sie die Helligkeit des Charakters mit einer Ebene, die mit der Hintergrundfarbe gefüllt ist

im Modus [Multiplizieren] und abgeschnitten auf dem Charakterobjekt

Setzen Sie den Keyframe auf Licht und Schatten auf dem Charakterobjekt für ein realistischeres Ergebnis!!

Hinweis:

Wenn Sie [Ebenen-Keyframe] aktivieren, können Sie nicht auf der Ebene malen

Sie können es jedoch ein- und ausschalten, um die Ebene zu bearbeiten.

Die Keyframes bleiben gleich

Technik Nr. 2: Maskenanimation

Statt einfach zu beleuchten,

fügen wir dem Licht mit der Ebenenmaskenanimation Bewegung hinzu!

Treffen Sie die Auswahl für den  Lichtstreifen mit dem Werkzeug [Auswahl]: [Polylinie]

Auf dem Light-On-Hintergrundordner [Rechtsklick > Ebenenmaske > Maske außerhalb der Auswahl]

Die Miniaturansicht der Maske wird im Ebenenordner angezeigt.

Klicken Sie auf die Maskenvorschau und wenden Sie den Weichzeichnungsfilter an.

Wenn Sie das Ebenen-Keyframe aktivieren,

sehen Sie auch die Zeitleiste der Ebenenmaske

Fügen Sie einen neuen Keyframe hinzu für den Startframe..

und verschieben Sie die Maske mit dem [Objekt]-Werkzeug** nach links

Im letzten Frame verschieben Sie die Maske nach rechts

Fertig ist der bewegte Lichteffekt!! Super einfach!!

Wenden wir die Maskenanimation auch auf das Charakterobjekt an!!

Anstatt den gesamten Schritt zu wiederholen, kopieren Sie den Ordner mit der Maske

Löschen Sie alle Ebenen im Inneren

Deaktivieren des Layer-Keyframes

Verschieben Sie den Ordner über die Figur.

 

Verschieben Sie dann die Hervorhebungsebene in den Ordner

Sie werden sehen, dass der Ebenenmodus nicht funktioniert.

Sie müssen ihn stattdessen auf den Ordner setzen.

(Und den Ordner auch an das Charakterobjekt anheften)

Wenn Sie den Ebenen-Keyframe erneut aktivieren,

bewegt sich die Markierung zusammen mit dem Hintergrund!!

Sie können den Maskenbereich bearbeiten, damit die Hervorhebung im größeren Bereich angezeigt wird.

 

Deaktivieren Sie zuerst den Ebenen-Keyframe.

Klicken Sie auf die Miniaturansicht der Ebenenmaske und malen Sie mit der [Weichen Airbrush] um den Rand herum

Aktiviere den Ebenen-Keyframe erneut,

Jetzt sieht es besser aus!!

Ich bearbeite den Farbton auf Grün und male als letzten Schliff eine dunklere Farbe an den Rand.

Hier ist das Ergebnis

Rotationsbewegung

Sie können die Rotationsbewegung auch auf die Maske anwenden

Passen Sie beim Startframe die Größe der Maske so an, dass sie beim Drehen den Bereich abdeckt

Stellen Sie im Endframe im Bedienfeld [Werkzeugeigenschaft] den [Rotationswinkel] auf 360 ein

Die Rotationsgeschwindigkeit ist nicht gleichmäßig und nahtlos..

Dies ist passiert, weil sich der Keyframe im Modus [Smooth Interpolation] befindet.

Wenn Sie eine gleichmäßige Bewegungsgeschwindigkeit erzielen möchten,

müssen Sie den Keyframe in den Modus [Lineare Interpolation] ändern.

 

Stellen Sie den Keyframe-Modus über das Dropdown-Symbol [Keyframe hinzufügen] ein.

Wählen Sie den Keyframe aus und klicken Sie auf das Symbol [Keyframe hinzufügen], um den Keyframe-Modus zu ändern

Ziehen Sie den End-Keyframe an den Rand,

dadurch dreht sich die Maske mit der nahtlosen Schleife hinein.

Technik Nr. 3: 2D-Kamera

Der 2D-Kameraordner erstellt einfach die Kameraansicht für Objektgruppen auf der Leinwand.

Sie können mehrere Kameraordner haben, um unterschiedliche Kameraansichten für Objektgruppen auf derselben Leinwand anzuzeigen.

Sie können den 2D-Kameraordner animieren, um Kamerabewegungen für die Objekte im Ordner zu erzeugen

Erstellen Sie einen neuen 2D-Kameraordner.

Gehen Sie zu [Animation > Neue Animationsebene > 2D-Kameraordner]

Sie sehen den blauen Rand (Standardfarbe) auf der Leinwand

Legen Sie alle Hintergrundordner in den 2D-Kameraordner

Passen Sie dann die Kameraansicht (den blauen Rand) mit dem Werkzeug [Objekt] an.

Achten Sie auf die Position der Zeitleiste, wenn Sie die Kameraansicht anpassen.

 

Der Keyframe wird automatisch in der Zeitleiste des Kameraordners erstellt.

Richten Sie den Bewegungs-Keyframe in einer nahtlosen Schleife in den Kameraordner ein

Sie können eine Vorschau der Kamera anzeigen mit der Option [Sichtfeld der Kamera anzeigen] im Bedienfeld [Werkzeugeigenschaften]

Ich habe die Charakterobjekte in einen anderen 2D-Kameraordner gelegt.

So lässt sich ganz einfach etwas Tiefe vom Charakter zum Hintergrund erzeugen!!

Technik Nr. 4: Dateiobjektanimation

Erstellen wir eine kompliziertere Animation: den synchronisierten Hintergrund

Sie können ihn erstellen, indem Sie nur 1 Dateiobjekt verwenden!!

Erstellen Sie eine neue Datei.

Behalten Sie die Einstellung für die animierte Illustration bei wie bei Ihrer Animationsdatei,

und löschen Sie den Animationsordner

Erstellen Sie eine neue Ebene und zeichnen Sie ein Sechseck mit dem Unterwerkzeug [Abbildung]: [Polygon]

Schneiden Sie die Datei zu, indem Sie etwas Platz um die Sechseckform lassen,

Erstellen Sie eine Auswahl auf dem Sechseck und erweitern Sie den Auswahlbereich

Löschen Sie die Papierebene und speichern Sie die Datei

Importieren Sie die Hexagon-Datei als Dateiobjekt auf die Animationsleinwand.

Wählen Sie das Dateiobjekt mit dem Werkzeug [Objekt] aus.

Aktivieren Sie im Eigenschaftenfenster des Werkzeugs die Option [Kacheln]. 

Die Kachel ist etwas seltsam, aber wir werden das später reparieren

Zurück zur Hexagon-Datei,

Aktivieren Sie den Layer-Keyframe und erstellen Sie eine Shink-Animation in einer kurzen Schleife

Wenn Sie die Datei speichern, wird die Animation auch in der Hauptdatei angezeigt.

Das Problem bei Sechseckkacheln ist:

Sie können sie nicht einfach mit den Kacheloptionen erstellen.

Anstatt es in beide Richtungen zu wiederholen,

Drehen Sie das Objekt um 90 Grad und aktivieren Sie die Drehrichtung auf einer Seite

Dateiobjekt kopieren und manuell nebeneinander platzieren

 

Wiederholen Sie den Schritt, bis der Bereich ausgefüllt ist,

Und ordnen Sie die Objektebenen** entsprechend ihrer Reihenfolge an

 

Die Fliesen schrumpfen jetzt alle zusammen

Lasst uns die synchronisierte Bewegung machen!!

 

Klicken und ziehen Sie auf der Zeitleiste auf den kleinen Balken über der Clipleiste, um ihn nach hinten zu verschieben

Durch Verschieben des Clips wird die Animation zu einer anderen Zeit abgespielt,

aber die Kachelstreifen verschwinden aus der Zeitleiste.

Um dies zu beheben, klicken Sie mit der rechten Maustaste auf das letzte Bild und [Clip teilen]

Bewegen Sie den Clip nach vorne

Dann erweitern Sie den Clip, indem Sie das kleine Quadrat an der Ecke des Clips ziehen

Der Hintergrund ist jetzt synchronisiert!

Ich füge der Sechseckdatei eine kleine Rotationsbewegung hinzu, das Ergebnis ist auch cool!!

Mit diesen Funktionen können Sie in kürzester Zeit wunderbare Effekte für Ihre animierte Illustration erzielen!!

 

Ich hoffe, mein Tutorial gibt Ihnen einige Ideen, wie Sie diese Funktionen in Ihrem animierten Illustrationsprojekt verwenden können. Viel Spaß beim Animieren und wir sehen uns im nächsten Tutorial