Erstelle einen Animationsloop, indem du Teile einer fertigen Illustration bewegst.

 

Du kannst die Grundlagen der Animationsfunktionen von CLIP STUDIO PAINT während des Produktionsprozesses erlernen.

Dieser Kurs ist für all diejenigen, die einen einfachen Einstieg in Animation suchen.

 

 

Der Kurs wird im Folgenden veranschaulicht.

Entscheide vor der Bearbeitung, welche Teile du bewegen möchtest, um den Eindruck der Illustration zu verbessern.

Eine weitere wirksame Methode, um ein Gefühl von Realismus zu vermitteln, ist das Zeichnen von Lichteffekten und Symbolen.

 

Das Beispiel zeigt ein Mädchen, das sich in einem dunklen Raum entspannt und Musik hört.

Licht, das in den Augen reflektiert und durch die Fenster einfällt, die Noten, der Regen und die Bewegung der Rollokordel vermitteln den Verlauf von Zeit.

 

Die Daten der Beispielillustration und die fertigen Animationsdaten können jeweils unter den folgenden Links heruntergeladen werden.

Bitte nutze diese Informationen, um die beschriebenen Funktionen zu überprüfen.

Illustrationsdaten

Animationsdaten

 

Die Illustration wird in der folgenden Reihenfolge animiert.

Das Blinzeln wird durch eine Cel-Animation mit mehreren Bildern bewegt, während das durch die Fenster und Jalousien einfallende Licht durch eine Keyframe-Animation bewegt wird, bei der jeweils Zahlen festgelegt werden.

 

Im Kurs wird die Tablet-Version von CLIP STUDIO PAINT verwendet, aber du kannst Animationen auch auf einem PC oder Smartphone mit fast identischer Bedienung erstellen.

Grundlegende Bedienungshinweise für die verschiedenen Geräte finden sich auf den folgenden Seiten:

 

„Grundlegende Operationen und Funktionen der Windows/macOS-Version“

„[Tablets] Grundlagen zur Bedienung von CLIP STUDIO PAINT“

[Smartphone] Die Grundlagen von CLIP STUDIO PAINT erlernen

[1] Organisation der Ebenen

Organisiere die Ebenen der Illustration, um die Animationsarbeit zu erleichtern.

 

Trenne die [Ebenen]-Palette für bewegte und nicht bewegte Teile.

Bei Illustrationen mit klaren Linien und Farben ist es einfacher zu arbeiten, wenn die Linien und Farben getrennt sind.

Wenn du bei der Ebenentrennung unsicher bist, trenne Charakter und Hintergründe grob voneinander.

 

In dem Beispiel wurde die folgende Ebenenstruktur verwendet.

Um die Arbeit beim Zeichnen von Unterschieden in der Cel-Animation zu erleichtern, sind die Ebenen für Charaktere und Hintergründe jeweils in „Line-Art" und „Kolorierung" unterteilt.

 

Die Ebene „Licht aus dem Fenster“ hat eine Deckkraft von 50 % und den Ebenenmodus [Schein abwedeln]. Lege Keyframes für die Deckkraft fest, um Änderungen in der Helligkeit darzustellen.

[2] Blinzeln

Erstelle eine Blinzelanimation, bei der die Augen der Figur auf und zu gehen.

Teile ausschneiden

Schneide zunächst die Augen aus dem Gesicht der Illustration aus und trenne sie von den unbewegten Teilen.

 

[Wähle in der Ebenenpalette die Ebene „Charakter - Line Art“ und die Ebene „Charakter - Kolorierung“.

Um mehrere Ebenen auszuwählen, aktiviere das Kästchen links neben der Miniaturansicht.

Wähle das Sub-Tool [Auswahlstift] aus dem [Auswahlbereich]-Tool aus.

Mit dem [Auswahlstift] kannst du eine Auswahl festlegen und gleichzeitig die Pinselgröße ändern, als ob du mit einem Stift zeichnen würdest.

 

Erstelle einen Auswahlbereich, der die Form der beiden Augen abdeckt.

Verwende das Sub-Tool [Auswahl ausradieren], um Überhänge im [Auswahlstift] zu korrigieren.

Achte darauf, dass sowohl Line-Art als auch Koloration in den Auswahlbereich passen.

Wenn du eine Auswahl getroffen hast, die der Form beider Augen entspricht, drücke im [Auswahl Launcher] auf [Ausschneiden und Einfügen].

In der [Ebene]-Palette wird eine Ebene erstellt, auf der die Augenform aus den Ebenen „Charakter - Line Art“ und „Charakter - Kolorierung“ ausgeschnitten wird.

Sobald die Ebene erstellt ist, hebe die Auswahl auf.

 

Kombiniere Line Art und Kolorierung in einem Ebenenordner

Um mehrere Ebenen als ein einziges Bild (Cel) in einer Cel-Animation zu verwenden, müssen sie in einem einzigen Ebenenordner zusammengefasst werden.

 

Lege einen neuen Ebenenordner an und speichere die Line Art des ausgeschnittenen Auges und den zwei Kolorations-Ebenen.

Ändere den Namen des Ebenenordners in „a“ und die Ebenennamen in [Charakter - Line Art Kopie] > [Augen - Line Art] bzw. [Charakter - Kolorierung Kopie] > [Weiße Augen].

Der Ordner „a“ sollte sich eins vor der Ebene „Charakter - Line Art“ befinden.

 

Hinzufügen des ausgeschnittenen Bereichs zur Zeichnung

Wenn du den Ordner „a“ ausblendest, siehst du, dass der Teil der Ebene „Charakter - Kolorierung“, auf dem die Augen gezeichnet wurden, abgeschnitten wurde und nun leer ist.

Füge der Ebene „Charakter - Kolorierung“ Haut und Haare hinzu, damit die nicht bemalten Bereiche beim Blinzeln nicht leer sind.

 

Verwende bei ausgewählter Ebene „Charakter - Kolorierung“ das Sub-Tool [Farbe von Ebene aufnehmen] des Tools [Pipette], um die Farbe abzurufen und Haut und Haare mit einem Pinsel hinzuzufügen.

Die bewegten und unbewegten Teile sind nun getrennt und bereit für die Blinzelanimation

 

Wie man eine Cel-Animation erstellt

Um eine Cel-Animation zu erstellen, musst du mehrere Bilder (Cel) vorbereiten, die als Unterschied dienen sollen.

 

Zwei weitere Bilder werden nun gezeichnet und drei Bilder werden verwendet, um eine Blinzelanimation zu erstellen.

Zeichne ein offenes Auge auf [a], ein halboffenes Auge auf [b] und ein geschlossenes Auge auf [c] und bestimme jedes als ein Cel.

Die Cel-Bedienung wird in der Palette [Zeitleiste] durchgeführt.

 

Zeitleiste

Wähle zunächst im Menü [Fenster] die Option [Zeitleiste], um die Palette [Zeitleiste]

anzuzeigen.

Drücke auf [Neue Zeitleiste], um eine Zeitleiste zu erstellen.

Wenn das Dialogfeld [Neue Zeitleiste] angezeigt wird, setze die [Framerate] auf [8] und die [Abspielzeit] auf [24] Bilder.

Die Zeitleiste ist fertig.

Jede Ebene in der [Ebene]-Palette wird als eine Spur in der [Zeitleiste]-Palette behandelt.

[Hinweis]

Die Framerate ist eine Maßeinheit dafür, aus wie vielen Bildern/Cels/Frames pro Sekunde eine Animation besteht.

Die Framerate wurde auf eine Länge von 24 Bildern bei einer Bildrate von 8 Bildern/Sekunde eingestellt, so dass das Beispiel 3 Sekunden Animation umfasst.

Eine ausführliche Erklärung der Framerate findest du in diesem Artikel.

 

Animationsordner

Erstelle als Nächstes einen Animationsordner, der die Ebenen enthält, die du verschieben möchtest.

Wenn du die Ebene im Animationsordner ablegst, wird sie wie ein Cel in der Zeitleiste behandelt.

 

Wenn du in der Zeitleiste auf die Schaltfläche [Neuer Animationsordner] klickst, wird ein neuer Animationsordner in der [Zeitleiste]- und [Ebene]-Palette erstellt.

Ändere in der [Ebene]-Palette den Namen des Animationsordners in [Blinzeln] und setze sie in der Reihenfolge eine Ebene unter die Ebene [Licht aus dem Fenster].

Speichere den Ordner [a] mit der Augenaufteilung im Animationsordner [Blinzeln].

Der im Animationsordner gespeicherte Ordner "a" wird automatisch als Cel bei Bild "1" auf der Zeitachse festgelegt.

Wenn auf der Zeitachse keine Cels angegeben sind, aktiviere den Dialog [Präferenzen] → [Animation] → [Hinzufügen von Cel zum Frame beim Hinzufügen einer Ebene].

 

Celbezeichnung vor Version 2.1

*Wenn du Version 2.1 oder eine frühere Version verwendest, musst du nach dem Speichern des Ordners "a" im Animationsordner die Cels gemäß dem folgenden Verfahren angeben.

Lege fest, wann das Cel angezeigt werden soll, indem du dich für einen Frame entscheidest.

 

Um ein Bild in der [Zeitleiste]-Palette auszuwählen, drücke oben auf [Framezahl]. Der ausgewählte Frame wird in rot angezeigt.

Wähle in der [Zeitleiste]-Palette ❶Spur und ❷Frame [1] und drücke ❸[Cels spezifizieren].

Wähle im Fenster [Ebene auswählen] die Option [a] und drücke auf [OK].

Das Cel wird im Frame registriert und eine Miniaturansicht wird in der Spur angezeigt.

 

Neues Cel erstellen

Erstelle anschließend die Cels [a], [b] und [c].

 

Wähle bei ausgewählter [Blinzel]-Spur das Bild [1] und drücke zweimal auf die Schaltfläche [Neues Cel].

Die Cels [b] und [c] werden in den Frame [2] und [3] nach der Cel [a] erstellt.

Wenn im Animationsordner ein Ebenenordner mit einer Cel-Bezeichnung vorhanden ist, wird ein neues Cel entsprechend dieser Ebenenstruktur erstellt.

 

In der [Ebene]-Palette kannst du sehen, dass die Ordner der Cels [b] und [c] die gleiche Konfiguration haben wie die Cel [a].

[Hinweis]

Durch Betätigung der Schaltflächen [Einzoomen/Auszoomen] in der Palette [Zeitleiste] wird die Breite des Frames geändert. Wenn es schwierig ist, einen Frame auszuwählen, vergrößere die Ansicht, um die Breite zu erhöhen.

 

Zwiebelschicht

Vergewissere dich als Nächstes, dass [Zwiebelschicht aktivieren] in der Palette [Zeitleiste] aktiviert ist.

Ist diese Option aktiviert, werden die Cels in den Frames vor und nach dem aktuell ausgewählten Frame halbtransparent auf der Leinwand angezeigt.

 

Wenn der Frame [2] ausgewählt wird, wird das im vorherigen Frame [1] angegebene Cel [a] halbtransparent angezeigt.

Ändere die Einstellungen für die Zwiebelschicht so, dass jeweils zwei Frames der vorherigen und nachfolgenden Cels auf der Leinwand angezeigt werden.

[Wähle im Menü [Animation] die Option [Zwiebelschichteneinstellungen] unter [Cels einblenden].

Ändere die [Anzahl der Schichten] auf [2] für [Vorheriger Frame] und [Nächster Frame].

Während der Bearbeitung der Cels [c] in Frame [3] wird Cel [a] in Frame [1] jetzt mit einer Zwiebelschicht auf der Leinwand angezeigt.

 

Differenzzeichnung

Zeichne geschlossene Augen auf der Ebene „Augen - Line Art“ des Animationscels [c], während du die offenen Augen von [a] in der Zwiebelschicht überprüfst.

 

Die Farbe der Line Art ist schwarz.

Fahre fort, indem du die halbgeöffneten Augen der [a]- und [c]-Cels in die [b]-Cels einzeichnest.

 

Zeichne dreidimensionale Augenlinien in der Ebene „Augen - Line Art“ und male das Weiße der Augen in der Ebene „Weiß der Augen“, so dass die Augen entlang der Augäpfel halb umrandet sind.

 

Die Farbe des weißen Auges wird auf der Ebene „Weiß der Augen“ in das Cel [a] mit dem Subtool [Farbe von Ebene aufnehmen] aufgenommen.

Die drei für die Animation benötigten Cels sind nun vollständig.

 

Zeitpunkt des Blinzelns anpassen

Passe den Blinzel-Zeitpunkt in der [Zeitleiste]-Palette an.

Im „Blinzel"-Track die Cel-Anordnung wie folgt einstellen:

 

Frame [1]: [a] Cel

Frame [2]: [c] Cel

Frame [3]: [b] Cel

Frame [4]: [a] Cel

 

Dazu wird [Cels spezifizieren] verwendet.

Die Reihenfolge der Cels kann auch durch Ziehen der Miniaturansichten geändert werden.

Die halbgeöffneten Augen werden nicht verwendet, wenn sich die Augen schließen. Nur, wenn sich die Augen öffnen.

Die Geschwindigkeit bei sich schließenden Augen ist schneller als bei sich öffnenden Augen, daher wird hierdurch ein natürliches Blinzeln erzeugt.

 

Drücke in der Palette [Zeitleiste] auf [Abspielen/Anhalten], um die Bewegung zu sehen.

Damit ist die Blinkanimation abgeschlossen.

 

[3] Licht vom Fenster

Keyframe-Animation von Licht aus einem Fenster mit unterschiedlicher Deckkraft

Aktivieren von Keyframes

Wähle in der [Zeitleiste]-Palette die Spur „Licht vom Fenster“ aus und schalte [Keyframes auf dieser Ebene aktivieren] ein.

 

Hinzufügen von Keyframes

Keyframes können mit dem Sub-Tool [Objekt] eingestellt werden.

Wähle Frame [1] in der Palette [Zeitleiste] aus und aktiviere das Kontrollkästchen neben [Ebenendeckkraft] in der Palette [Tooleigenschaften], um einen Keyframe zum aktuell ausgewählten Bild hinzuzufügen.

Um die Deckkraft-Keyframes in der [Zeitleiste]-Palette zu sehen, drücke auf die Schaltfläche + links neben dem Spurnamen, um das Element zu erweitern.

 

Auf der Spur erscheint ein rautenförmiges Symbol, das einen Keyframe kennzeichnet.

 

Keyframe-Einstellungen

Animiert Lichtänderungen durch Änderung des Deckkraftwerts bei jedem Keyframe.

 

Setze bei ausgewähltem Frame [1] die [Ebenendeckkraft] auf [35], für Frame [5] auf [15] und für Frame [8] auf [35].

 

Keyframe kopieren

Richte einen sich wiederholenden Lichtwechsel ein.

Ziehe den Cursor, um alle Keyframes in der Spur [Licht vom Fenster] in der [Zeitleiste]-Palette auszuwählen.

Der ausgewählte Keyframe wird mit einem roten Rahmen versehen.

Halte einen der ausgewählten Keyframes mit dem Finger gedrückt und wähle [Kopieren].

Am Computer, klicke mit der rechten Maustaste, um das Kontextmenü aufzurufen, oder wähle das Menü [Animation] > [Spur bearbeiten] > [Kopieren].

Drücke und halte Frame [9] auf der Spur [Licht vom Fenster] und wähle [Einfügen].

In der Desktop-Version wähle wie zuvor das Menü [Animation] > [Spur bearbeiten] > [Einfügen].

Fahre fort und wähle Einfügen auf die gleiche Weise für Frame [17].

Die gleiche Bewegung wird nun dreimal bis Frame [24] wiederholt.

Drücke in der Palette [Zeitleiste] auf [Abspielen/Anhalten], um die Bewegung zu sehen.

Die Animation des Lichts vom Fenster ist abgeschlossen.

 

[4] Andere Hintergrundanimationen

Andere Teile werden in ähnlicher Weise durch Cel- oder Keyframe-Animation bewegt.

Noten

Um die Atmosphäre des Musikhörens zu erzeugen, füge einen Musiknoteneffekt um den Charakter herum hinzu.

 

Erstelle einen neuen Animationsordner und verschiebe ihn an den Anfang der [Ebene]-Palette.

Der Animationsordner trägt den Namen „Notenzeichen“.

Wähle Frame [1] auf der Spur „Noten“ und drücke [Neues Cel].

Benenne das neu erstellte Cel in der [Ebene]-Palette in [a] um.

Verwende den Dekorationspinsel, um die Noten zu zeichnen.

Lade den Pinsel „Hand Drawn note♪“ von CLIP STUDIO ASSETS herunter.

 

Wähle Cel [a], setze die Farbe auf Magenta und zeichne Noten um das Gesicht des Mädchens.

Wähle als Nächstes Frame [7] und wähle [Neues Cel].

Auf Cel [a] folgt Cel [b].

Cel [b] wird auch für die Darstellung der Noten verwendet.

Kopiere das Cel so, dass es innerhalb von 3 Sekunden zweimal wiederholt wird.

 

Wähle Cel [a] und [b] in den Frames [1] und [7] durch Ziehen aus, wähle [kopieren] und [einfügen] in Frame [13].

Drücke die Abspielentaste, um die Bewegung der Noten zu überprüfen.

 

Regen

Füge eine Zeichnung außerhalb des Fensters hinzu, so dass sie sowohl zu einer Cel-Animation als auch zu einer Musiknote wird.

Die gleiche Bewegung wird dreimal wiederholt, wobei in allen vier Frames jeweils zwei Cels platziert werden.

 

Rollokordel

Füge ein Rollokordel hinzu und mache daraus eine Keyframe-Animation, die von einer Seite zur anderen schwingt.

Füge eine Keyframe-Animation zum Drehen hinzu.

 

Wenn das Sub-Tool [Objekt] ausgewählt wird, wird der Drehpunkt der Keyframe-Animation durch ein Fadenkreuz angezeigt.

Ziehe das Fadenkreuz, um das Rotationszentrum zu ändern.

Setze das Rotationszentrum auf den Drehpunkt der Jalousie und lege in der Palette [Tooleigenschaften] einen Keyframe für den [Rotationswinkel] fest.

Alle Animationen sind nun vollständig.

 

[5] Exportieren

Exportiere die fertige Animation in eine Videodatei.

 

Da GIFs nur maximal 256 Farben verwenden können, können sie in Filmdateien exportiert werden, um Abstufungen wie Helligkeit und Dunkelheit des Lichts auf schöne Weise auszudrücken.

 

Wähle das Menü [Datei] > [Animation exportieren] > [Film].

Wähle als Dateiertyp [mp4]. Dieser lässt sich leicht auf Social Media hochladen.

 

Stelle im Fenster [Film Exporteinstellungen] die Framerate auf [8] ein.

[Hinweis]

Durch die Anpassung der Framerate der Timeline kann die Vorschau während der Produktion an die Bewegung des Videos angepasst werden.

 

Beim Teilen in den Sozialen Netzwerken wiederholt sich die Animation sehr flüssig in einer Schleife.