Hoe je schaalversnelling aanpast zonder de verhoudingen van een personage te vervormen

Schaal bepaalt de grootte langs elke as. Wanneer de horizontale en verticale schaal dezelfde vermenigvuldigingsfactor gebruiken, behoudt het personage zijn beeldverhouding. Wanneer die factoren verschillen, verandert de vorm. De technische documentatie van MDN beschrijft dit onderscheid als uniform versus niet-uniform schalen. MDN: CSS-functie scale()

Versnelling bepaalt hoe een geanimeerde waarde tussen keyframes verandert. Stel dat beide assen beginnen op 80% en eindigen op 100%. Als de horizontale schaal 96% bereikt terwijl de verticale schaal nog op 88% staat, wordt het personage tijdelijk breder ten opzichte van zijn hoogte. De eindpunten kunnen er goed uitzien terwijl de overgang zichtbaar uitrekt.

Bij een personage dat aanvankelijk niet vervormd is, behouden gelijke schaalwaarden voor X en Y gedurende de overgang de verhoudingen. Behoud in het algemeen de goedgekeurde basisverhouding: als een voorbereid asset opzettelijk met ongelijke schaalwaarden begint, vermenigvuldig beide dan met dezelfde veranderende factor. Vervang die basisverhouding niet automatisch door gelijke getallen.

Sla een werkkopie op en bepaal welke transformatie het hele personage aanstuurt. Begin voor deze handleiding met één 2D-personagelaag waarvan het uiterlijk op de referentiegrootte al klopt. Als de illustratie uit afzonderlijke onderdelen bestaat, stel dan eerst één gedeelde transformatie in voor de algemene formaatverandering; anders kan het aanpassen van alleen het lichaam de grootte ervan ten opzichte van het gezicht of de accessoires veranderen.

Selecteer in After Effects de personagelaag en druk op S om Scale weer te geven. Schakel Proportions Constrain, het pictogram naast de schaalwaarden, in wanneer je evenredige formaatveranderingen invoert. Adobe documenteert deze optie specifiek voor gekoppelde schaalbewerkingen. Adobe: Laageigenschappen aanpassen in After Effects

Noteer de goedgekeurde beginwaarden, eindwaarden en keyframetijden voordat je iets wijzigt. Controleer ook bestaande tussenliggende keyframes. Gebruik de koppelingsoptie als hulpmiddel bij het bewerken en controleer de daadwerkelijke waarden gedurende de animatie; ga er niet van uit dat het inschakelen ervan eerdere bewerkingen heeft hersteld.

Kies het groeipunt voordat je de timing verfijnt. In After Effects wordt geschaald rond het ankerpunt van de laag. Een gecentreerd ankerpunt is geschikt voor uitbreiding rond het midden; een ankerpunt onderaan in het midden kan geschikt zijn voor een personage dat tijdens het groeien visueel op de grond moet blijven staan. Adobe: Ankerpunten van lagen

Gebruik de Waardegraphiek om de grootte te controleren en de Snelheidsgrafiek om te bepalen hoe snel de grootte verandert. Adobe definieert een waardegraphiek als de eigenschappenwaarden in de tijd en een snelheidsgrafiek als de snelheid waarmee die veranderen. Selecteer de grafiek expliciet in de opties van de Graph Editor in plaats van uit te gaan van de standaardweergave. Adobe: Animatiebasisprincipes in After Effects

Bekijk in de waardegraphiek alle relevante schaalcomponenten tegelijk. Bij gelijke basiswaarden moeten de curves gedurende een uniforme schaalanimatie samenvallen. Een afwijking ertussen is een nuttig signaal om het bijbehorende frame te controleren. Vergelijk bij ongelijke goedgekeurde basiswaarden de evenredige veranderingen in plaats van te verwachten dat de curves overlappen.

Gebruik de snelheidsgrafiek als je de versnelling of het uitvloeien wilt aanpassen zonder de vastgelegde groottes te veranderen. Ga na elke betekenisvolle aanpassing terug naar de waardegraphiek. Zo voer je twee afzonderlijke controles uit: voelt de timing goed aan en blijft de grootteverhouding correct?

Gebruik dit gecontroleerde voorbeeld: een 2D-personage met de juiste verhoudingen groeit in 12 frames van 80%, 80% naar 100%, 100%. Dit zijn illustratieve instellingen, geen voorgeschreven duur of groottebereik.

1. Selecteer de personagelaag, geef Scale weer en schakel Proportions Constrain in.
2. Stel het eerste Scale-keyframe in op 80%, 80% en het tweede, 12 frames later, op 100%, 100%.
3. Selecteer beide Scale-keyframes en pas Animatie > Keyframe-assistent > Easy Ease toe.
4. Open de Graph Editor en kies Snelheidsgrafiek bewerken.
5. Selecteer de schaalkeyframes tegelijk. Pas de relevante componenten gelijkmatig aan met kleine wijzigingen aan de handgrepen.
6. Schakel over naar Waardegraphiek bewerken en controleer de aswaarden tussen de keyframes.

Easy Ease biedt een beginovergang met nul snelheid bij de geselecteerde keyframes. Gebruik voor nauwkeurigere aanpassingen Animatie > Keyframe-snelheid om de inkomende of uitgaande snelheid en invloed te bewerken. Adobe legt uit dat je de invloed op aangrenzende keyframes verandert door de snelheidshandgrepen horizontaal te verplaatsen. Adobe: Snelheidsveranderingen toepassen en regelen in After Effects

Probeer voor dit voorbeeld een snelle vergroting gevolgd door een langere uitvloeiing. Pas de inkomende invloed bij het laatste keyframe aan, bekijk een voorbeeld en vergelijk dit met het origineel. Houd de eindgroottes en de duur van 12 frames tijdens deze stap vast, zodat je het effect van de gewijzigde versnelling afzonderlijk kunt beoordelen.

Als het personage na een aanpassing uitrekt, maak die wijziging dan ongedaan en controleer welke componenten waren geselecteerd. Controleer de tussenliggende waarden en de eindpunten opnieuw voordat je verdergaat. De Graph Editor-handleiding van Adobe laat zien hoe je keyframes selecteert, de handgrepen weergeeft, de snelheidsgrafiek aanpast en het resultaat bekijkt. Adobe: Dynamische beweging tussen keyframes maken met de Graph Editor

Gebruik een test voor evenredige veranderingen wanneer de curves moeilijk te vergelijken zijn. Deel op een gekozen frame de huidige schaal van elke as door de goedgekeurde basisschaal. Bij een uniforme formaatverandering moeten de uitkomsten gelijk zijn. Deze test volgt rechtstreeks uit het toepassen van één vermenigvuldigingsfactor op beide dimensies.

Toestand	X-schaal	Y-schaal	X ÷ basis-X	Y ÷ basis-Y	Interpretatie
Goedgekeurde basis	80%	80%	1.00	1.00	Referentievorm
Correct tussenliggend frame	92%	92%	1.15	1.15	Verhoudingen behouden
Vervormd tussenliggend frame	96%	88%	1.20	1.10	Horizontale groei is groter
Goedgekeurd eindpunt	100%	100%	1.25	1.25	Referentieverhoudingen hersteld

In het vervormde voorbeeld wordt de breedte-hoogteverhouding vermenigvuldigd met 96 ÷ 88 ≈ 1.091. Daardoor wordt het personage ongeveer 9.1% breder ten opzichte van zijn hoogte dan bij de basis. Deze cijfers zijn een illustratieve berekening, geen metingen van een specifieke animatie.

Bij een opzettelijk ongelijke basis van 120%, 100% levert een uniforme vergroting met factor 1.10 waarden van 132%, 110% op. Beide assen zijn met 10% toegenomen, waardoor het goedgekeurde uiterlijk behouden blijft. Als je dit eindpunt verandert in 132%, 132%, verander je de bestaande verhoudingen.

Stel de zichtbare klacht vast voordat je de versnelling opnieuw aanpast. Gebruik een stilgezet frame om onderscheid te maken tussen een vormverandering, een verschuiving van de positie en een verandering in de beelddetails.

Klacht	Volgende controle
Breedte en hoogte lopen tijdens de overgang uiteen	Vergelijk op dat moment de aswaarden, tussenliggende keyframes en curvehandgrepen.
Het hele personage beweegt tijdens het groeien	Controleer het ankerpunt en de positieanimatie.
Slechts één onderdeel van het personage verandert van grootte ten opzichte van de rest	Controleer de transformatie van dat onderdeel en de gedeelde personagetransformatie.
Het personage wordt groter dan bedoeld voordat het uitvloeit	Controleer de waardegraphiek op een uitschieter voorbij de doelgrootte.
Het silhouet behoudt zijn verhoudingen, maar de randen worden blokkerig	Controleer de resolutie van het bronmateriaal en de mate van vergroting.

Een tijdelijke overschrijding van de grootte kan de verhoudingen behouden als beide assen samen uitschieten. Beoordeel afzonderlijk of die grotere grootte in de animatie past. Als de opdracht een eenvoudige beweging van groeien en stoppen voorschrijft, houd de schaalwaarden dan binnen het gekozen begin- en eindbereik.

Vergroting van rasterafbeeldingen kan ook het uiterlijk van de illustratie veranderen zonder de verhoudingen te wijzigen. Adobe merkt op dat het aanzienlijk vergroten van rasterlagen blokkerige pixels kan opleveren, terwijl verkleinen ze zachter kan maken. De versnelling aanpassen lost dit probleem met de details in de bron niet op. Adobe: Een laag schalen of spiegelen

Bekijk het beginframe, verschillende tussenliggende frames, het frame met de grootste grootte en het eindframe. Controleer meer frames waar de schaal het snelst verandert of de vorm lijkt te verschuiven. Steekproefframes helpen problemen op te sporen; door de volledige curves te bekijken, kun je verschillen tussen die steekproeven ontdekken.

Bekijk vervolgens een voorbeeld met de beoogde afspeelsnelheid. De Graph Editor-handleiding van Adobe raadt aan het deelvenster Info te controleren om te bevestigen of het voorbeeld in realtime wordt afgespeeld, omdat een onvolledig voorbeeld het lastiger kan maken de timing te beoordelen. Adobe: Animatie in de Graph Editor vooraf bekijken en aanpassen

Rond af wanneer het personage de bedoelde groottes bereikt, tijdens de overgang de goedgekeurde verhoudingen behoudt en zoals bedoeld versnelt en uitvloeit. Gebruik één gedeelde schaalvermenigvuldiger als uitgangspunt, bekijk de timing in de grafieken en controleer de tussenliggende vorm voordat je de bewerking goedkeurt.

• Adobe — Laageigenschappen aanpassen in After Effects
• Adobe — Animatiebasisprincipes in After Effects
• Adobe — Snelheidsveranderingen toepassen en regelen in After Effects
• Adobe — Dynamische beweging tussen keyframes maken met de Graph Editor
• MDN — CSS-functie scale()