So bearbeitest du die Skalierungsbeschleunigung, ohne die Proportionen einer Figur zu verzerren
Damit sich die Proportionen einer Figur beim Bearbeiten der Skalierungsbeschleunigung nicht verzerren, müssen sich alle Skalierungsachsen während der gesamten Animation proportional gleich verändern. Behalte die gewünschten Start- und Endgrößen bei und passe anschließend die Interpolation dazwischen an. Prüfe die Zwischenbilder: Gleiche Endpunktwerte allein gewährleisten nicht, dass die Figur ihre Proportionen beibehält.
Diese Anleitung richtet sich an Kreative, die in einem externen Animationseditor die Animation verfeinern, in der eine virtuelle Figur wächst, schrumpft oder zur Ruhe kommt. Die praktische Anleitung verwendet Adobe After Effects und enthält einen numerischen Test, den du auch in anderen Programmen anwenden kannst.
Warum kann das Ändern der Skalierungsbeschleunigung eine Figur verzerren?
Die Skalierung steuert die Größe entlang jeder Achse. Wird für die horizontale und vertikale Skalierung derselbe Multiplikator verwendet, behält die Figur ihr Seitenverhältnis bei. Unterscheiden sich die Multiplikatoren, verändert sich ihre Form. In der technischen Dokumentation von MDN wird dieser Unterschied als gleichmäßige beziehungsweise ungleichmäßige Skalierung bezeichnet. MDN: scale()-CSS-Funktion
Die Beschleunigung bestimmt, wie sich ein animierter Wert zwischen Keyframes verändert. Angenommen, beide Achsen beginnen bei 80 % und enden bei 100 %. Erreicht die horizontale Skalierung 96 %, während die vertikale noch bei 88 % liegt, wird die Figur vorübergehend im Verhältnis zu ihrer Höhe breiter. Die Endpunkte können korrekt aussehen, obwohl die Figur während des Übergangs sichtbar gestreckt wird.
Bei einer anfangs unverzerrten Figur bleiben ihre Proportionen erhalten, wenn die X- und Y-Skalierung während des gesamten Übergangs gleich sind. Allgemeiner gilt: Behalte das freigegebene Ausgangsverhältnis bei. Beginnt ein vorbereitetes Asset absichtlich mit ungleichen Skalierungswerten, multipliziere beide mit demselben veränderlichen Faktor. Ersetze diese Ausgangswerte nicht automatisch durch gleiche Zahlen.
Was solltest du vor dem Bearbeiten der Kurve prüfen?
Speichere eine Arbeitskopie und ermittle die Transformation, die die gesamte Figur steuert. Beginne für diese Anleitung mit einer einzelnen 2D-Figur-Ebene, deren Darstellung bei ihrer Referenzgröße bereits stimmt. Besteht das Artwork aus separaten Teilen, richte zuerst eine gemeinsame Transformation für die gesamte Größenänderung ein. Andernfalls kann das Bearbeiten nur des Körpers dessen Größe im Verhältnis zum Gesicht oder zu den Accessoires verändern.
Wähle in After Effects die Figuren-Ebene aus und drücke S, um die Skalierung anzuzeigen. Aktiviere Proportionen beschränken, das Symbol neben den Skalierungswerten, wenn du proportionale Größenänderungen eingibst. Adobe beschreibt diese Steuerung ausdrücklich für verknüpfte Skalierungsbearbeitungen. Adobe: Ebeneneigenschaften in After Effects anpassen
Notiere die freigegebenen Start- und Endwerte sowie die Keyframe-Zeitpunkte, bevor du etwas änderst. Prüfe auch vorhandene Zwischen-Keys. Betrachte die Verknüpfungssteuerung als Bearbeitungshilfe und überprüfe die tatsächlichen Werte während der gesamten Animation, statt anzunehmen, dass ihre Aktivierung frühere Änderungen korrigiert hat.
Lege den Ursprung der Vergrößerung fest, bevor du das Timing verfeinerst. In After Effects wird um den Ankerpunkt der Ebene skaliert. Ein mittig gesetzter Anker eignet sich für eine Vergrößerung um die Mitte; ein unten mittig gesetzter Anker kann passen, wenn die Figur beim Wachsen optisch am Boden verankert bleiben soll. Adobe: Ankerpunkte von Ebenen
Welches Diagramm solltest du zum Ändern der Beschleunigung verwenden?
Verwende das Wertediagramm, um die Größe zu prüfen, und das Geschwindigkeitsdiagramm, um zu bestimmen, wie schnell sich die Größe ändert. Adobe definiert ein Wertediagramm als Darstellung der Eigenschaftswerte über die Zeit und ein Geschwindigkeitsdiagramm als Darstellung ihrer Änderungsrate. Wähle das Diagramm im Diagramm-Editor explizit über die Optionen aus, statt dich auf die Standardansicht zu verlassen. Adobe: Grundlagen der Animation in After Effects
Untersuche im Wertediagramm alle relevanten Skalierungskomponenten gemeinsam. Bei gleichen Ausgangswerten sollten ihre Kurven während einer gleichmäßigen Skalierungsanimation vollständig übereinanderliegen. Ein Abstand zwischen ihnen ist ein guter Hinweis darauf, das entsprechende Bild zu prüfen. Bei ungleichen, freigegebenen Ausgangswerten solltest du die proportionalen Änderungen vergleichen, statt zu erwarten, dass sich die Kurven überlagern.
Verwende das Geschwindigkeitsdiagramm, wenn du die Beschleunigung oder das Abbremsen verändern und dabei die gleichen Keyframe-Größen beibehalten möchtest. Kehre nach jeder wesentlichen Anpassung zum Wertediagramm zurück. So erhältst du zwei getrennte Prüfpunkte: ob sich das Timing richtig anfühlt und ob das Größenverhältnis erhalten bleibt.
Wie bearbeitest du die Skalierungsbeschleunigung in After Effects?
Verwende dieses kontrollierte Beispiel: Eine korrekt proportionierte 2D-Figur wächst innerhalb von 12 Bildern von 80 %, 80 % auf 100 %, 100 %. Dies sind Beispielwerte, keine vorgeschriebene Dauer oder Größenänderung.
- Wähle die Figuren-Ebene aus, blende die Skalierung ein und aktiviere „Proportionen beschränken“.
- Setze den ersten Skalierungs-Keyframe auf 80 %, 80 % und den zweiten, 12 Bilder später, auf 100 %, 100 %.
- Wähle beide Skalierungs-Keyframes aus und wende Animation > Keyframe-Assistent > Easy Ease an.
- Öffne den Diagramm-Editor und wähle Geschwindigkeitsdiagramm bearbeiten.
- Wähle die Skalierungs-Keys gemeinsam aus. Passe die relevanten Komponenten gleichmäßig mit kleinen Änderungen an den Griffen an.
- Wechsle zu Wertediagramm bearbeiten und prüfe die Achsenwerte zwischen den Keys.
Easy Ease bietet einen Ausgangsübergang mit Geschwindigkeit null an den ausgewählten Keys. Für genauere Änderungen kannst du unter Animation > Keyframe-Geschwindigkeit die eingehende oder ausgehende Geschwindigkeit und den Einfluss anpassen. Adobe erklärt, dass eine horizontale Bewegung der Geschwindigkeitsgriffe deren Einfluss auf benachbarte Keys verändert. Adobe: Geschwindigkeitsänderungen in After Effects anwenden und steuern
Probiere für dieses Beispiel eine schnelle Vergrößerung mit anschließendem längeren Ausklingen aus. Passe den eingehenden Einfluss am letzten Key an, gib eine Vorschau wieder und vergleiche sie mit dem Original. Behalte während dieses Durchgangs die Endgrößen und die Dauer von 12 Bildern bei, damit du die Änderung der Beschleunigung für sich beurteilen kannst.
Wird die Figur nach einer Anpassung gestreckt, mache diese Änderung rückgängig und prüfe, welche Komponenten ausgewählt waren. Kontrolliere vor dem Fortfahren erneut die Zwischenwerte und die Endpunkte. Adobes Anleitung zum Diagramm-Editor zeigt, wie man Keys auswählt, ihre Griffe einblendet, das Geschwindigkeitsdiagramm anpasst und das Ergebnis in einer Vorschau prüft. Adobe: Mit dem Diagramm-Editor dynamische Bewegungen zwischen Keyframes erstellen
Wie kannst du die Proportionen mit konkreten Zahlen prüfen?
Verwende einen Test der proportionalen Änderung, wenn sich die Kurven nur schwer vergleichen lassen. Teile für ein ausgewähltes Bild die aktuelle Skalierung jeder Achse durch deren freigegebenen Ausgangswert. Bei einer gleichmäßigen Größenänderung sollten die Ergebnisse übereinstimmen. Dieser Test ergibt sich unmittelbar daraus, dass auf beide Abmessungen derselbe Multiplikator angewendet wird.
| Zustand | X-Skalierung | Y-Skalierung | X ÷ Ausgangswert X | Y ÷ Ausgangswert Y | Interpretation |
|---|---|---|---|---|---|
| Freigegebene Ausgangswerte | 80 % | 80 % | 1.00 | 1.00 | Referenzform |
| Korrektes Zwischenbild | 92 % | 92 % | 1.15 | 1.15 | Proportionen bleiben erhalten |
| Verzerrtes Zwischenbild | 96 % | 88 % | 1.20 | 1.10 | Horizontales Wachstum ist größer |
| Freigegebener Endpunkt | 100 % | 100 % | 1.25 | 1.25 | Referenzproportionen wiederhergestellt |
Im verzerrten Beispiel wird das Verhältnis von Breite zu Höhe mit 96 ÷ 88 ≈ 1.091 multipliziert. Dadurch ist die Figur im Verhältnis zu ihrer Ausgangshöhe ungefähr 9,1 % breiter. Diese Zahlen dienen als Rechenbeispiel und stammen nicht aus Messungen einer bestimmten Animation.
Bei ungleichen, absichtlich festgelegten Ausgangswerten von 120 % und 100 % ergibt eine gleichmäßige Vergrößerung mit dem Faktor 1,10 die Werte 132 % und 110 %. Beide Achsen wurden um 10 % vergrößert, sodass die freigegebene Darstellung erhalten bleibt. Würdest du den Endpunkt auf 132 % und 132 % ändern, veränderte sich die bestehende Proportion.
Was kannst du tun, wenn die Figur immer noch falsch aussieht?
Ermittle das sichtbare Symptom, bevor du die Beschleunigung erneut anpasst. Halte ein Bild an, um eine Formänderung von einer Positionsverschiebung oder einer Änderung der Bilddetails zu unterscheiden.
| Symptom | Nächste Prüfung |
|---|---|
| Breite und Höhe weichen während des Übergangs voneinander ab | Vergleiche die Achsenwerte, Zwischen-Keys und Kurvengriffe zu diesem Zeitpunkt. |
| Die ganze Figur bewegt sich beim Wachsen | Prüfe den Ankerpunkt und die Positionsanimation. |
| Nur die relative Größe eines Figurenteils ändert sich | Prüfe die Transformation dieses Teils und die gemeinsame Transformation der Figur. |
| Die Figur wird vor dem Abbremsen größer als beabsichtigt | Prüfe im Wertediagramm, ob die Größe über das Ziel hinausschießt. |
| Die Silhouette bleibt proportional, aber die Kanten werden pixelig | Prüfe die Auflösung des Ausgangs-Artworks und den Vergrößerungsfaktor. |
Ein vorübergehendes Überschreiten der Zielgröße kann die Proportionen erhalten, sofern beide Achsen gemeinsam darüber hinausgehen. Entscheide gesondert, ob diese größere Größe zur Animation gehört. Wenn die Vorgabe eine einfache Bewegung mit anschließendem Wachstumsstopp verlangt, halte die Skalierungswerte innerhalb des gewählten Start- und Endbereichs.
Auch eine Vergrößerung von Rasterbildern kann das Aussehen des Artworks verändern, ohne seine Proportionen zu ändern. Adobe weist darauf hin, dass eine starke Vergrößerung von Rasterebenen zu pixeligen Kanten führen kann, während eine Verkleinerung sie weichzeichnen kann. Eine Änderung der Beschleunigung behebt dieses Problem mit den Quelldetails nicht. Adobe: Ebene skalieren oder spiegeln
Wie überprüfst du die fertige Skalierungsanimation?
Prüfe das Startbild, mehrere Zwischenbilder, das Bild mit der größten Größe und den Endpunkt. Sieh genauer hin, wo sich die Skalierung am schnellsten ändert oder die Form sich zu verschieben scheint. Stichproben helfen, Probleme zu finden; die vollständigen Kurven zeigen Unterschiede auf, die zwischen den geprüften Bildern auftreten.
Gib anschließend eine Vorschau mit der vorgesehenen Wiedergaberate wieder. Adobes Anleitung zum Diagramm-Editor empfiehlt, im Info-Bedienfeld zu prüfen, ob die Vorschau in Echtzeit läuft, da eine unvollständige Vorschau die Beurteilung des Timings erschweren kann. Adobe: Animation im Diagramm-Editor in der Vorschau ansehen und anpassen
Schließe die Bearbeitung ab, wenn die Figur die gewünschten Größen erreicht, ihre freigegebenen Proportionen während des gesamten Übergangs beibehält und wie vorgesehen beschleunigt und zur Ruhe kommt. Verwende einen gemeinsamen Skalierungsmultiplikator als Grundregel, prüfe mit den Diagrammen das Timing und kontrolliere die Form in den Zwischenbildern, bevor du die Bearbeitung übernimmst.
