Eine springende Sprite-Animation korrigieren: Arbeitsflächengröße, Grundlinien und Beschnittversätze
Jede Pose sieht für sich gut aus, aber beim Abspielen springt die Figur. Die Geschwindigkeit ist selten das Erste, was du ändern solltest. Ermittle, ob die Bewegung von den Zeichnungen, unterschiedlichen Ursprüngen der Ausschnitte oder dem Übergang von der letzten zur ersten Pose ausgeht.
Anhalten und die tatsächlichen Einzelbildgrenzen vergleichen
Lade die Folge und klicke ohne Wiedergabe durch die Vorschaubilder. Notiere die Abmessungen jedes Quelleinzelbilds in deinem Editor. Eine Pose mit 64 × 64 Pixeln, gefolgt von einer eng beschnittenen Pose mit 28 × 45 Pixeln, beschreibt nicht mehr dasselbe Koordinatensystem. Eine zentrierte Vorschau kann sie plausibel aussehen lassen, obwohl sich die Füße der Figur verschieben.
Der Sprite-Sheet-Animator zentriert kleinere Einzelbilder beim GIF-Export innerhalb der größten Arbeitsfläche. Er erkennt keinen Fuß, Drehpunkt oder Waffengriff. Bereite für eine genaue Ausrichtung vor dem Laden eine gemeinsame transparente Arbeitsfläche vor, statt dich auf automatische Zentrierung zu verlassen.
Einen zur Bewegung passenden Ankerpunkt wählen
| Sequenz | Nützliche Referenz | Vermeiden |
|---|---|---|
| Bodenständige Ruheanimation | Bodengrundlinie und aufgesetzter Fuß | An der Kopfoberkante ausrichten |
| Rotierendes Symbol der Benutzeroberfläche | Beabsichtigter Drehmittelpunkt | Jeden veränderten Zuschnitt zentrieren |
| Waffenschwung | Griff oder Befestigungspunkt | An der Klingenspitze ausrichten |
| Explosion | Beabsichtigter Effektursprung | Jede asymmetrische Pose künstlich zentrieren |
Beim Gehen bewegt sich der Körper absichtlich. Fixiere nicht jeden Körperteil auf dieselbe Koordinate. Ein aufgesetzter Fuß kann am Boden bleiben, während sich der Oberkörper hebt. Wähle den Bezugspunkt, der den Zweck der Animation ausdrückt, und erhalte die beabsichtigte Bewegung an anderen Stellen.
Beschnittene Einzelbilder wiederherstellen, wenn Versatzdaten vorhanden sind
Wenn Aseprite aus einer Pose mit 64 × 64 Pixeln einen Zuschnitt mit 22 × 38 Pixeln am Versatz (19, 20) exportiert hat, erstelle ein transparentes Bild mit 64 × 64 Pixeln und setze den Zuschnitt wieder bei (19, 20) ein. Die passende JSON-Datei liefert diesen Versatz über spriteSourceSize. Atlas-Koordinaten in frame geben an, wo Pixel gelesen werden, nicht wo sie in der wiederhergestellten Pose platziert werden.
Nutze den Entpacker, wenn Metadaten vorhanden sind. Liegen nur noch eng beschnittene PNGs vor, fehlen die ursprünglichen Versätze. Richte sie im Editor manuell an einer Referenz aus. Weder höhere FPS noch ein größeres GIF können diese Koordinaten allein aus einem Ausschnitt wiederherstellen.
Einen Ausrichtungssprung von einem Reihenfolgesprung unterscheiden
- Prüfe benachbarte Posen langsam. Wenn sich derselbe Ankerpunkt durch den Zuschnitt relativ zur Arbeitsfläche verschiebt, korrigiere die Platzierung in der Quelle.
- Wenn ein Körper plötzlich die Pose wechselt, der Ankerpunkt aber stabil bleibt, prüfe, ob ein Einzelbild fehlt oder falsch eingeordnet ist.
- Prüfe die letzte Pose direkt gefolgt von der ersten. Eine Folge kann in sich flüssig sein und trotzdem am Schleifenübergang scheitern.
- Wähle die Wiedergabegeschwindigkeit erst nach diesen Prüfungen. Eine höhere FPS-Zahl kaschiert manche Sprünge, behebt sie aber nicht.
Die Ausgabe prüfen, ohne beabsichtigte Bewegung als Fehler einzustufen
Ein Rückstoß, Hüpfer oder Ausfallschritt kann den Ankerpunkt durchaus verschieben. Vergleiche mit der beabsichtigten Aktion, statt die Folge auf eine statische Silhouette zu reduzieren. Behalte eine ausgerichtete, verlustfreie Version, exportiere das GIF und sieh dir mehrere Schleifen an. Farbänderungen im GIF und gerundete Verzögerungen sind unabhängig von der räumlichen Ausrichtung.
Arbeitsablauf ausprobieren
Gehe die Einzelbilder durch, vergleiche ihre Bezugspunkte, ordne die Sequenz neu an und sieh dir die Schleife vor dem GIF-Export an.
Animationsbilder prüfen →