Metlivi Blog

So animierst du die Deckkraft eines maskierten Schattens auf einem sich verformenden Charakterteil

Um einen maskierten Schatten auf einem sich verformenden Charakterteil zu animieren, gib dem Schatten ein eigenes Artwork, lass ihn der Verformung des Teils folgen und animiere seine Deckkraft unabhängig. Die Maske legt fest, wo der Schatten erscheinen kann; die Deckkraft des Schattens bestimmt, wie stark er erscheint.

Diese Anleitung richtet sich an Ersteller von 2D-Charakteren, die bereits ein verformbares Teil haben und dessen Schattierung weich ausblenden möchten, ohne dass sie verrutscht oder sich das Basis-Artwork ändert. Sie verwendet den Parameter-Workflow von Live2D Cubism und erläutert anschließend die entsprechenden Steuerelemente in Spine.

29. Oktober 20267 Min. LesezeitVon Metlivi Editorial Team
Abschnitt 1

1. Schatten, Begrenzung und Bewegungssteuerung trennen

Bevor du Animationen hinzufügst, identifiziere drei Elemente: das Basis-Artwork, ein separates Schatten-Overlay und die Verformung, die das Teil bewegt. Für ein Beispiel-Setup nennen wir sie PartBase, PartShadow und PartWarp. Diese Namen dienen der Organisation und sind keine integrierten Objekte.

Wähle das Schatten-ArtMesh aus und prüfe die Felder Deformer, Clipping ID, Draw Order und Opacity. Cubism zeigt diese als separate Eigenschaften an, sodass du Anbindung, Maskierung, Ebenenreihenfolge und Transparenz einzeln prüfen kannst. Platziere den Schatten in der Zeichenreihenfolge über dem Basis-Artwork und gib ihm vorübergehend eine ausreichend hohe Deckkraft, damit du ihn gut erkennen kannst. Live2D: Inspector-Palette

Lege vor dem Rigging fest, was die Deckkraft bewirken soll. Wenn der Schatten bei einer bestimmten Beugung immer dunkler werden soll, kann es sinnvoll sein, sie an diese Bewegung zu koppeln. Wenn du ihn bei gleichbleibender Pose ausblenden möchtest, verwende einen unabhängigen Schattenparameter. Die folgenden Schritte verwenden diese unabhängige Steuerung.

Abschnitt 2

2. Den Schatten der Verformung des Teils folgen lassen

Lege PartBase und PartShadow unter den Warp-Deformer, der für ihre gemeinsame Bewegung zuständig ist. Warp-Deformer in Cubism können mehrere untergeordnete Objekte gemeinsam verformen. Dadurch eignen sie sich, um ein Overlay mit dem darunterliegenden Artwork zu verbinden. Erstelle oder vergrößere den Deformer so, dass er das Artwork während der vorgesehenen Bewegung vollständig abdeckt. Live2D: Warp-Deformer

Prüfe die Verformung bei gleichbleibender Deckkraft des Schattens. Bewege das Teil von einer extremen Pose zur anderen und sieh dir auch die Zwischenstellung an. Achte auf markante Merkmale: Bleibt die geschwungene Kante des Schattens neben derselben Kontur, und bleibt sein schmales Ende mit demselben Bereich verbunden?

Ein gemeinsamer übergeordneter Deformer übernimmt die Verformung, die er selbst anwendet. Er stellt nicht sicher, dass separate Scheitelpunktänderungen am Basis-ArtMesh auch auf den Schatten übertragen wurden. Wenn das Overlay verrutscht, prüfe, wie die einzelnen Objekte tatsächlich geformt werden. Verschiebe die gemeinsame Bewegung, soweit praktikabel, in ihren gemeinsamen Deformer oder passe die Formen des Schattens so an, dass sie dem Basis-Artwork folgen.

Abschnitt 3

3. Den Schatten auf die Silhouette des Teils beschneiden

Wähle PartBase aus und kopiere seine ArtMesh-ID. Wähle PartShadow aus und füge diese ID in das Feld Clipping ID des Schattens ein. Dadurch wird das Basis-ArtMesh zur Quelle der Schnittmaske und der Schatten zum beschnittenen Artwork. Lass Reverse mask für einen gewöhnlichen Schatten innerhalb des Teils deaktiviert. Live2D: Schnittmaske, Live2D: Inspector-Palette

Führe diesen praktischen Begrenzungstest durch: Lass das Schatten-Artwork etwas über die Silhouette des Basis-Artworks hinausragen und scrubbe dann durch die Verformung. Das beschnittene Ergebnis sollte innerhalb der vorgesehenen Begrenzung bleiben. So lässt sich ein Maskierungsproblem von einem Overlay unterscheiden, das schlicht zu früh endet.

Beschneidung und Verformung lösen unterschiedliche Probleme. Eine korrekte Begrenzung kann überflüssiges Artwork verbergen, während die innere Form des Schattens trotzdem verrutscht. Prüfe sowohl die äußere Silhouette als auch die Position des Schattens darin, bevor du fortfährst.

Abschnitt 4

4. Einen unabhängigen Schatten-Deckkraftparameter erstellen

Erstelle einen regulären Parameter namens ShadowOpacity mit einem Minimum von 0, einem Standardwert von 0 und einem Maximum von 1. Dieser Bereich ist eine beispielhafte Designentscheidung. Bei Cubism-Parametern lassen sich Minimum, Standardwert und Maximum konfigurieren; ihre registrierten Formen interpolieren zwischen den Keys. Live2D: Über Parameter

Gehe bei einem Schatten-ArtMesh ohne vorhandene Pose-Keyforms wie folgt vor:

  1. Wähle PartShadow aus.
  2. Wähle ShadowOpacity in der Parameter-Palette aus.
  3. Wähle „2 Keyforms hinzufügen“ und bestätige Keys bei 0 und 1.
  4. Setze bei Parameterwert 0 die Deckkraft des Schattens im Inspector auf 0 %.
  5. Setze bei Parameterwert 1 seine Deckkraft auf einen beispielhaften Höchstwert von 40 %.
  6. Scrubbe zwischen den Keys und prüfe, ob sich nur die vorgesehene Schattierung ändert.

Das dokumentierte Keyform-Verfahren von Cubism beginnt damit, das Objekt und den Parameter auszuwählen und zwei oder drei Keyforms hinzuzufügen. Hier wird die Deckkraft des ausgewählten ArtMesh bearbeitet. Lass das Basis-Artwork während dieser Änderungen abgewählt. Live2D: Keys zu Parametern hinzufügen/aus Parametern löschen, Live2D: Inspector-Palette

Wenn der Schatten bereits mehrere Pose-Keyforms hat, empfiehlt es sich, einen eigenen Deformer nur über dem Schatten einzufügen und ihm den Deckkraftparameter zuzuweisen. Diese vorgeschlagene Hierarchie hält die Ausblendsteuerung von den vorhandenen Formänderungen des Schattens getrennt. Deformer in Cubism unterstützen neben der Verformung auch Deckkraftanpassungen. Live2D: Warp-Deformer

Abschnitt 5

5. Den Parameter über die Zeit animieren

Speichere das Modell, lade es in eine Animationsszene und klappe die Gruppe Live2D Parameters der Modellspur auf. Gib für jeden gewünschten Frame einen Wert für ShadowOpacity ein. Cubism erstellt Timeline-Keys, wenn du Parameterwerte änderst, und interpoliert bei der Wiedergabe zwischen diesen Keys. Live2D: 6. Animationen erstellen

Verwende für einen beispielhaften Test mit 30 fps die folgenden Werte. Sie beschreiben ein Einblenden, ein kurzes Halten und ein Ausblenden; sie sind keine verbindlichen Zeitvorgaben.

Frame Wert von ShadowOpacity Gewünschtes Ergebnis
0 0 Schatten unsichtbar
12 1 Schatten erreicht den eingestellten Höchstwert
24 1 Schatten bleibt auf dem Höchstwert
36 0 Schatten wird ausgeblendet

Animiere die Verformung des Teils über denselben Zeitraum. Wiederhole dann das Ausblenden, während das Teil in seiner am stärksten komprimierten Pose bleibt. Wenn du beides getrennt prüfst, lässt sich leichter feststellen, ob eine unerwünschte Änderung von der Form oder vom Ausblenden herrührt.

Öffne den Graph Editor, um den Übergang des Parameters zu prüfen und sein Timing anzupassen. Stelle außerdem sicher, dass Modellspur und Wiedergabebereich den gesamten Test abdecken. Im Animationstutorial von Cubism wird erläutert, dass eine kürzere Spur dazu führen kann, dass das gesamte Modell verschwindet, bevor die Szene endet. Live2D: 6. Animationen erstellen

Abschnitt 6

6. Unstimmige Deckkraft und Kantenartefakte diagnostizieren

Gehe diese Diagnoseschritte durch, bevor du weitere Keys hinzufügst. Die Reihenfolge ist eine praktische Ableitung aus den getrennten Steuerelementen oben.

Symptom Zuerst prüfen Nächster Schritt
Auch das Basis-Artwork wird ausgeblendet Ausgewähltes Objekt und untergeordnete Objekte der Deckkraftsteuerung Steuerung auf den Schatten beschränken
Schatten verrutscht beim Beugen Gemeinsame Verformung und separate Mesh-Änderungen Bewegung korrigieren, bevor du die Deckkraft änderst
Schattenstärke ändert sich zwischen Pose-Keys Gespeicherte Deckkraft auf vorhandenen Keyforms Diese Formen auf unbeabsichtigte Werte prüfen
Schatten ragt über das Teil hinaus Clipping ID und Verfügbarkeit der Maske Vorgesehene Schnittquelle wiederherstellen

Wenn vorhandene Keyforms unterschiedliche Deckkraftwerte enthalten, kannst du mit der Funktion „Mehrere Keys bearbeiten“ von Cubism die Deckkraft für einen ausgewählten Bereich gesammelt ändern. Wähle nur die Formen aus, die denselben Wert erhalten sollen, aktiviere Opacity und prüfe vor dem Anwenden die betroffenen Objekte. Behalte beabsichtigte Unterschiede bei, statt alle Formen unterschiedslos zu überschreiben. Live2D: Funktion „Mehrere Keys bearbeiten“

Prüfe bei einem blassen Rand die durchscheinende Kante der Maske. Live2D dokumentiert eine Umgehungslösung mit einer vergrößerten Maskenkopie, deren angezeigte Deckkraft auf 0 % gesetzt und die zusammen mit dem Original transformiert wird. Prüfe außerdem, ob Endpunkt-Keyforms fehlen oder Maskenquellen ausgeblendet sind, wenn die Beschneidung unerwartet aufgehoben wird. Überprüfe das exportierte Ergebnis im vorgesehenen Renderer, da sich das Maskenverhalten je nach Implementierung unterscheiden kann. Live2D: Schnittmaske

Abschnitt 7

7. Dieselbe Trennung in Spine anwenden

Animiere in Spine den Alpha-Wert des Schatten-Slots über seine Color-Eigenschaft. Die Slot-Farbe steuert die Deckkraft des Attachments und kann mit Keys versehen werden; die separate Farbe des Attachments lässt sich nicht mit Keys versehen. Lass den Schatten in einem eigenen Slot, damit das Ausblenden das vorgesehene Overlay betrifft. Spine-Benutzerhandbuch: Slots

Erstelle für die Begrenzung ein Clipping-Attachment um das Teil. Ordne den Schatten innerhalb seines Clipping-Bereichs an und setze den End-Slot ausdrücklich: Der Clipping-Bereich gilt einschließlich dieses Slots. Das Clipping-Polygon kann über Gewichte den Knochen folgen; auch seine Scheitelpunktpositionen lassen sich animieren. Diese Begrenzung muss der Verformung unabhängig von der Alpha-Animation des Schattens folgen. Spine-Benutzerhandbuch: Clipping-Attachments

Wenn der Schatten nach dem Ausblenden unsichtbar bleibt, empfiehlt Spine, sein Attachment nach Erreichen der Transparenz mit einem Slot-Attachment-Key auszublenden. Alpha null allein kann weiterhin Zeichenaufwand verursachen. Wenn der Schatten wieder eingeblendet werden soll, stelle das Attachment vor Beginn des sichtbaren Einblendens wieder her. Spine-Benutzerhandbuch: Slots

Prüfe zum Abschluss den Schatten bei null, teilweiser und maximaler Deckkraft in der neutralen Pose, an beiden Extremen der Verformung und in Zwischenposen. Bei einem funktionierenden Setup kannst du die Schattenstärke ändern, während Position und Begrenzung während der gesamten Bewegung erhalten bleiben.

Abschnitt 8

Quellen

Weitere Artikel

Dieses Thema weiter erkunden