# Animation und die Zeitleiste Füge Frames hinzu und timee sie, spiele sie ab, markiere Schleifen mit Tags, arbeite mit Cels, erzeuge Tweens zwischen Keyframes und sieh benachbarte Frames mit Onion Skin. _Die Tastenkürzel sind für Windows und Linux notiert. Auf einem Mac nimmst du ⌘ Cmd statt Ctrl und ⌥ Option statt Alt._ Eine Animation ist ein Sprite mit mehr als einem **Frame**. Die **Zeitleiste** zeigt die Frames als Spalten und die Ebenen als Zeilen; jedes Feld, in dem sich eine Ebene und ein Frame treffen, ist ein **Cel** ([So ist deine Arbeit aufgebaut](https://pxstud.io/de/docs/manual/concepts/how-work-is-organized.md)). ![Die Zeitleiste mit einem grünen Tag „bounce“ über den Frames 1 bis 4, je 120 ms; eine Ebene „Slime“ mit dem Slime in unterschiedlichen Höhen, eine Ebene „Shading“ mit einem Schatten nur in Frame 1 und leeren Punkten sonst und eine Ebene „Background“, deren Cels über alle vier Frames verknüpft sind](https://pxstud.io/manual/images/guides/animation-timeline.light.webp) _Eine Animation mit vier Frames und einem Tag_ ## Die Zeitleiste Am oberen Rand der Zeitleiste: | Steuerelement | Funktion | | - | - | | Erster, Vorheriger, Wiedergabe/Pause, Nächster, Letzter | Bewegen sich durch die Frames (`Home`, `←`, `Enter`, `→`, `End`; solange eine Auswahl besteht, verschieben die Pfeile stattdessen die ausgewählten Pixel). Vorheriger und Nächster laufen wie in Aseprite vom letzten Frame zum ersten und zurück. `,` und `.` gehen stattdessen innerhalb des Tags des aktuellen Frames weiter und springen von seinem Ende zurück zu seinem Anfang, um eine einzelne Animation durchzublättern. | | Schleife | Ob die Wiedergabe am Ende von vorn beginnt. | | Geschwindigkeit | Spielt mit 0,25× bis 4× ab, ohne das Timing der Frames zu ändern. | | Wiedergabemodus | Wie Tags abgespielt werden (unten). | | **+ Ebene**, Referenzbild, Löschen | Fügen eine Ebene hinzu (`Shift+N`), fügen aus einer Datei eine Referenzebene hinzu und löschen die aktive Ebene. | | **+ Frame**, Duplizieren, Löschen | Fügen nach dem aktuellen einen leeren Frame hinzu (`Ctrl+Shift+F`), duplizieren ihn (`Alt+N`) und löschen ihn (`Ctrl+Alt+Shift+F`). | | **Tag** | Erstellt einen Tag über den ausgewählten Frames. | Jede **Frame-Spalte** zeigt die Nummer des Frames und darunter, wie lange er in Millisekunden zu sehen ist: Klick auf das Nummernfeld, um eine neue Dauer einzutippen. Die **Ebenenzeilen** laufen links entlang, die oberste Ebene zuerst. Im Raster zeigt ein Cel mit Inhalt einen **gefüllten Punkt**, und ein **leeres Cel** zeigt einen **hohlen Punkt**. Eine Linie verbindet **verknüpfte Cels**, also Cels, die sich ein Bild teilen. Fahr mit dem Zeiger über ein Cel, um zu sehen, zu welcher Ebene und welchem Frame es gehört und womit es verknüpft ist. ## Frames Das Menü **Frame** und ein Rechtsklick auf eine Frame-Nummer bieten alles rund um Frames: - Frame > Neuer leerer Frame fügt nach dem aktuellen einen leeren Frame hinzu. - Frame > Neuer leerer Frame davor fügt direkt vor dem aktuellen einen leeren Frame hinzu. So setzt du einen Frame vor Frame 1. - Frame > Neuer Frame kopiert den aktuellen Frame (oder die ausgewählten Frames) samt seinen Cels. Auf einer [durchgehenden Ebene](https://pxstud.io/de/docs/manual/guides/layers.md#showing-hiding-and-locking) wird stattdessen das Cel der Kopie verknüpft. - Frame > Neuer verknüpfter Frame kopiert ihn mit **verknüpften** Cels, sodass die Kopien ihre Bilder mit den Originalen teilen: Zeichnest du auf einem, ändern sich beide. - Frame > Frame löschen löscht den aktuellen oder die ausgewählten Frames (ein Sprite behält mindestens einen). - Frame > Frames umkehren kehrt die ausgewählten Frames um, oder alle, wenn weniger als zwei ausgewählt sind. **Timing.** Jeder Frame hat seine eigene Dauer, von 10 ms bis 65.535 ms (etwa 65 Sekunden, wie in Aseprite). Tipp sie in das Feld unter der Nummer des Frames ein oder nutze Frame > Frame-Eigenschaften.... Frame > Alle Frames auf aktuelle Dauer setzen... gibt jedem Frame die Dauer des aktuellen. **Farbe und Sperre.** Frame > Frame-Eigenschaften... gibt einem Frame außerdem eine **Farbmarkierung**, die als Streifen auf seinem Kopf erscheint, damit du Schlüsselposen oder Frames, die noch Arbeit brauchen, erkennst, und eine **Sperre**. Ein gesperrter Frame (mit einem Vorhängeschloss markiert) lehnt Änderungen an seinen Cels ab und kann weder entfernt noch verschoben noch neu getimt werden, von Werkzeugen wie von Skripten. Hebe die Sperre im selben Dialog auf. Beides wird mit dem Sprite gespeichert und synchronisiert, aber `.aseprite` kennt kein Gegenstück dazu, daher gehen beide beim Export dorthin verloren. Skripte nutzen `app.setFrameProps`. **Neu anordnen.** Zieh einen Frame am Griff, der neben seiner Nummer erscheint, oder wähl ihn aus und drück `Alt` mit `←` oder `→`. Mehrere ausgewählte Frames bewegen sich gemeinsam: Zieh einen beliebigen davon, und die ganze Auswahl wandert als Block, wobei Frames, die nicht nebeneinanderliegen, in der Reihenfolge der Zeitleiste zu einem Abschnitt zusammengezogen werden. Halte beim Ablegen `Alt`, um die ausgewählten Frames stattdessen dort zu **kopieren**; die Kopien werden an der Ablagestelle eingefügt und werden zur Auswahl. In beiden Fällen ist es ein einziger Schritt zum Rückgängigmachen. (Beende zuerst die Wiedergabe.) Tags folgen den Frames nach Position, wie in Aseprite: Frames, die du aus einem Tag herausziehst, verlassen ihn, und eine Kopie, die direkt hinter dem letzten Frame eines Tags abgelegt wird, tritt dem Tag bei, wie jeder neue Frame, der dort hinzugefügt wird. ## Wiedergabe Drück `Enter` zum Abspielen und Pausieren. Jeder Frame wird für seine eigene Dauer gezeigt, skaliert mit der Geschwindigkeitseinstellung; die Wiedergabe hält sich an die Uhr und überspringt einen Frame, wenn der Computer hinterherhinkt. Wie in Aseprite stoppt jede Bearbeitung oder der Beginn einer Zeichnung die Wiedergabe. Der **Wiedergabemodus** legt fest, wie Tags abgespielt werden: | Modus | Spielt | | - | - | | **Tags** (Tags & Wiederholungen abspielen) | Jeden Frame der Reihe nach. Jeder Tag läuft in seiner eigenen Richtung und so oft, wie seine Wiederholungszahl angibt, auch Tags in Tags, bevor die Wiedergabe weitergeht. | | **Alle Frames** | Jeden Frame der Reihe nach, ohne die Tags zu beachten. | | **Einmal** | Wie Tags vom ersten bis zum letzten Frame, dann stoppt sie und springt zurück zu dem Frame, bei dem du gestartet bist. Ist ein Tag gewählt (unten), läuft dieser Tag einmal: Ein Ping-Pong-Tag geht hin und zurück. | | **Subtags** | Wie Tags, aber steht der Abspielkopf in einem Tag mit der Wiederholung 0, läuft dieser Tag in einer Schleife (samt den Tags darin). | Die **Wiederholung** eines Tags zählt jeden Durchgang, und jede Richtung eines Ping-Pongs ist ein Durchgang: Ein Ping-Pong-Tag mit der Wiederholung 2 spielt 1, 2, 3, 2, 1. Eine Wiederholung von 0 spielt einen Tag im Vorbeigehen einmal ab (ein Ping-Pong hin und zurück) und wiederholt ihn in einer Schleife, wenn er der abgespielte Tag ist. Tags laufen in Exporten genauso, wie in Aseprite. Um **nur einen Tag** abzuspielen, klick auf sein Band über den Frames (klick erneut, um zur ganzen Animation zurückzukehren). Er läuft in einer Schleife, und die Tags darin laufen auf ihre eigene Weise. Bei ausgeschalteter **Schleife** spielt er seine Wiederholungszahl ab und stoppt; das tut auch die ganze Animation an ihrem letzten Frame. Das Vorschau-Bedienfeld spielt mit derselben Geschwindigkeit ab, sodass du die Animation beim Zeichnen beobachten kannst. Seine Schaltfläche **1:1** zeigt den Sprite in voller Größe, ein Sprite-Pixel pro Bildschirmpixel. ## Tags Ein **Tag** benennt einen Bereich von Frames („idle“, „walk“), damit du ihn einzeln abspielen und einzeln exportieren kannst. Wähl die Frames aus und drück die Schaltfläche **Tag** oder wähl Frame > Neuer Tag.... Der Dialog enthält: - **Name** und **Farbe**; - **Von Frame** und **Bis Frame**; - **Richtung**: Vorwärts, Rückwärts, Ping-Pong oder Ping-Pong rückwärts; - **Wiederholen**: wie oft er abgespielt wird, bevor die Wiedergabe weiterläuft; 0 wiederholt ihn endlos. Zieh das Band eines Tags, um ihn zu verschieben, oder seine Enden, um seine Frames zu ändern. Per Tastatur gehst du mit Tab zum Band und drückst `Alt+Left` oder `Alt+Right`, um ihn um einen Frame zu verschieben, oder gehst mit Tab zu einem seiner Enden und drückst `Left` oder `Right`. Doppelklick auf das Band oder nutze den Stift, der erscheint, wenn du darauf zeigst, um den Tag zu bearbeiten; mit einem Rechtsklick löschst du ihn. Wie in Aseprite deckt ein Tag Frame-Positionen ab: Ein Frame, den du aus einem Tag herausschiebst, verlässt ihn, einer, den du zwischen zwei seiner Frames ablegst, tritt ihm bei, und ein neuer Frame direkt nach dem letzten Frame eines Tags verlängert den Tag. Ein neuer Frame vor dem ersten Frame eines Tags gehört nicht zum Tag: Der Tag bleibt bei seinen Frames und rückt mit ihnen weiter. ## Cels Klick auf ein Cel, um es auszuwählen. Dann gilt: - **Shift+Klick** wählt einen Bereich aus, **`Ctrl`+Klick** fügt ein einzelnes Cel hinzu oder entfernt es, und **Ziehen** von einem nicht ausgewählten Cel aus wählt ein Rechteck aus; - ein Klick auf eine Frame-Nummer oder einen Ebenennamen wählt die ganze Spalte oder Zeile aus; - `Shift` mit den Pfeiltasten erweitert die Auswahl, und `Esc` hebt sie auf; - auf einem Touchscreen hältst du eine halbe Sekunde gedrückt und ziehst dann. Sind Cels ausgewählt und die Zeitleiste hat den Fokus, wirken die üblichen Kürzel auf ganze Cels: `Ctrl+X`, `Ctrl+C` und `Ctrl+V` schneiden sie aus, kopieren und fügen sie ein, und `Del` leert sie. Dieselben Befehle stehen unter **Bearbeiten > Cel** und im Rechtsklick-Menü: - Bearbeiten > Cel > Cels verknüpfen lässt die ausgewählten Cels jeder Ebene sich ein Bild teilen; Bearbeiten > Cel > Cels trennen gibt jedem wieder eine eigene Kopie (löst du das Cel, mit dem die anderen verknüpft waren, bleiben die anderen miteinander verknüpft). - **Zieh** ausgewählte Cels, um sie zu verschieben, oder halte beim Ziehen `Alt`, um sie zu kopieren. Der Umriss wird grün, wo sie hinkönnen, und rot, wo nicht. `Alt+Shift` mit einer Pfeiltaste verschiebt sie um einen Schritt. Um auf mehreren Cels gleichzeitig zu malen, zum Beispiel um denselben Umriss in jedem Frame zu korrigieren, schalte in der Leiste der Werkzeugoptionen **Über Cels hinweg malen** ein und wähl die Cels aus. Malen auf einem davon malt auf allen, als ein Schritt zum Rückgängigmachen; auch die Auswahl von Frame-Nummern oder Ebenennamen funktioniert. Gesperrte und ausgeblendete Ebenen werden übersprungen, und verknüpfte Cels werden nur einmal bemalt. Siehe [Werkzeuge](https://pxstud.io/de/docs/manual/reference/tools.md#how-tools-behave). Cels gehen nur dorthin, wo sie dasselbe bedeuten: Pixel auf Bildebenen, Tiles auf eine Tilemap-Ebene mit demselben Tileset. Gesperrte und ausgeblendete Ebenen werden übersprungen. Die **Cel-Eigenschaften** (Rechtsklick auf ein Cel) legen seine **Deckkraft** fest, die sich mit der der Ebene verbindet, seinen **Z-Index**, der es nur in diesem Frame um so viele Ebenen höher oder tiefer zeichnet (wobei jede Ebene und Gruppe zählt, wie bei Aseprite; es kann eine einfache Gruppe verlassen, aber keine Gruppe mit eigener Deckkraft oder eigenem Mischmodus), und seine Benutzerdaten. Verknüpfte Cels teilen sich eine Deckkraft und einen Satz Benutzerdaten (wie in Aseprite); der Z-Index gehört jedem Cel einzeln. Die Cels der Hintergrundebene sind immer völlig deckend, und die Cel-Deckkraft einer gesperrten Ebene lässt sich nicht ändern. ## Tweening Ein **Tween** zeichnet die Frames zwischen zwei Keyframes für dich: Er verschiebt, skaliert, dreht oder blendet das Bild des Start-Keyframes auf dem Weg zum End-Keyframe aus und zeichnet jeden Frame dazwischen als gewöhnliches Cel. Der End-Keyframe behält deine eigene Zeichnung. Weil die Zwischenbilder einfache Pixel sind, sehen Exporte, Onion Skin und Skripte gewöhnliche Frames, und Aseprite genauso, wenn du als `.aseprite` speicherst (die Einstellungen des Tweens reisen in den Benutzerdaten der Cels mit, sodass pxstud.io den Tween wieder erkennt, wenn du die Datei öffnest). Tweens funktionieren auf Bildebenen, nicht auf der Hintergrundebene. ### Der Tween-Inspektor Zeichne den Start- und den End-Keyframe auf derselben Ebene, wähl den Start-Keyframe aus und wähl Bearbeiten > Cel > Tween erstellen... (`Shift+T` oder Rechtsklick auf das Cel). Der Inspektor tweent ihn zum nächsten Cel dieser Ebene mit einer Zeichnung oder, wenn du mehrere Frames ausgewählt hast, zum letzten ausgewählten mit einer Zeichnung. Auf dem Start-Keyframe eines Tweens oder auf einem seiner Zwischenbilder geöffnet, bearbeitet er diesen Tween. Gibt es auf der Ebene keine spätere Zeichnung, endet eine Auswahl über mehrere Frames auf dem letzten ausgewählten Frame, auch wenn er leer ist (zum Ausblenden oder Wegploppen). Der Inspektor ist ein Fenster, das du an seiner Titelleiste ziehen und offen lassen kannst: Du kannst weiterhin durch die Zeitleiste scrubben, zeichnen und rückgängig machen, während er da ist. `Esc` schließt ihn. - **Vorschau**: Spielt den Start-Keyframe, die Zwischenbilder und den End-Keyframe in einer Schleife ab, mit den eigenen Dauern der Frames und mit den anderen sichtbaren Ebenen darum herum. Sie folgt deinen Änderungen, während du sie machst. Pausiere sie und geh mit den Schaltflächen darunter Frame für Frame weiter. Bei einem großen Sprite zeigt sie nur den Teil, durch den sich der Tween bewegt. Die Zeile daneben sagt, wie viele Zwischenbilder es gibt und in welchen Frames („6 Zwischenbilder, Frames 3–8“). - **Presets**: fertige Tweens (siehe „Tween-Presets“ unten). **Preset verwenden** füllt das Formular; Anwenden macht es wirksam. - **Mehrere Ebenen**: erscheint, wenn deine Auswahl mehr als eine Ebene mit einer Zeichnung auf dem Start-Frame umfasst (siehe „Mehrere Ebenen tweenen“ unten). - **Pose**: Die Spalten **Von** und **Ende** legen fest, wo das Bild am Anfang und am Ende ist: **Position** X und Y in Pixeln, **Skalierung** X und Y (1 ist die Originalgröße, ein negativer Wert spiegelt es), **Drehung** in Grad (im Uhrzeigersinn; 360 ist eine ganze Umdrehung, 720 dreht also zweimal), **Neigung** X und Y in Grad und **Deckkraft** in Prozent. **Skalierungsverhältnis sperren** hält X und Y im Verhältnis, wenn du eines änderst. **Auf kürzestem Weg drehen** macht aus 350° einen Schritt von 10° zurück statt einer fast vollen Umdrehung; schalte es aus, um den langen Weg zu drehen. **End-Keyframe angleichen** setzt Position und Skalierung am Ende so, dass das Startbild dort landet, wo die Zeichnung des End-Keyframes ist, und in deren Größe. Ein neuer Tween beginnt damit ausgefüllt. **Von zurücksetzen** setzt Von auf keine Änderung zurück. - **Easing**: wie die Bewegung schneller und langsamer wird. Jede kleine Kurve ist eine Wahl: **Linear** (gleichmäßig), **Halten** (bleibt stehen und springt dann zum End-Keyframe), **Stufen** (bewegt sich in gleichen Sprüngen; leg fest, wie vielen), und Sine, Quad, Cubic, Quart, Quint, Expo, Circ, Back, Elastic und Bounce, jeweils als **in** (beginnt langsam), **out** (endet langsam) oder **in-out** (beides). Mit den Pfeiltasten wechselst du zwischen ihnen. **Back** hat ein **Überschwingen**, **Elastic** eine **Amplitude** und eine **Periode** (wie lang jedes Wackeln ist), und **Bounce** eine Anzahl **Abpraller**. Unter **Erweitert: Easing pro Spur** kannst du Position, Skalierung, Drehung, Neigung, Deckkraft oder der Farbspur ein eigenes Easing geben, zum Beispiel einen Bounce auf der Position, während die Überblendung gleichmäßig bleibt. **Kurve zeichnen** macht aus dem gewählten Easing eine Kurve, die du selbst bearbeitest (siehe unten). - **Keyframes**: **End-Keyframe** wählt den Frame, auf dem der Tween endet; verschieb ihn und wende an, um den Tween zu verlängern oder zu verkürzen (Zwischenbilder hinter dem neuen Ende werden entfernt oder als einfache Cels behalten, wenn du darauf gemalt hast). **Über mehrere Keyframes verketten** erzeugt in einem Schritt einen Tween von jedem Keyframe zum nächsten, bis zu dem, den du wählst; **Jeden Tween auf seinem End-Keyframe landen lassen** gibt jedem seine eigene Pose „End-Keyframe angleichen“. **Erweitern** fügt mit diesen Einstellungen einen weiteren Tween vom End-Keyframe dieses Tweens zum nächsten Keyframe hinzu. - **Pfad**: wie die Position wandert. **Gerade**; ein **Bogen** mit einer bestimmten **Höhe** (ein Sprung; negativ geht in die andere Richtung); eine **Welle** mit einer **Amplitude**, einer Anzahl **Zyklen** und einer **Phase**, bei der sie beginnt; ein **Zickzack** mit einer **Amplitude** und **Zyklen**; oder ein **Wackeln** von bis zu **Amplitude** Pixeln pro Frame. Ein Wackeln ist bei einem **Seed** jedes Mal gleich; **Neu würfeln** wählt einen anderen. **Gezeichnet** ist eine Route, die du auf der Leinwand zeichnest (siehe „Einen Bewegungspfad zeichnen“ unten). **Am Pfad ausrichten** dreht das Bild in seine Bewegungsrichtung, auf jedem Pfad. **Pfad auf der Leinwand zeigen** zeichnet die Route und einen Punkt, wo jedes Zwischenbild landet. - **Squash and Stretch**: Dehnt das Bild entlang seiner Bewegung, solange es schnell ist, und staucht es quer dazu, wobei seine Fläche erhalten bleibt. 0 % ist aus. - **Pivot**: der Punkt, um den sich Skalierung, Drehung und Neigung drehen. Klick auf eines der neun Quadrate (Ecken, Kanten oder Mitte des Cels des Start-Keyframes) oder tipp X und Y ein, wobei 0 der linke oder obere Rand ist und 1 der rechte oder untere. Mit **Pivot in: Leinwand-Pixeln** sind X und Y stattdessen ein fester Punkt auf der Leinwand, sodass sich mehrere Ebenen, die um denselben Punkt getweent werden, zusammen als ein Stück bewegen. - **Überblendung**: wie Änderungen der Deckkraft aussehen (siehe „Dithering-Überblendungen und Überblendungen zum End-Keyframe“ unten). **Alpha** ändert die Deckkraft des Cels; **Dithering** lässt ganze Pixel durch ein **Muster** erscheinen oder verschwinden. **In den End-Keyframe überblenden** verwandelt das Bild in die Zeichnung des End-Keyframes. - **Farbe**: Setz ein Häkchen bei **Farbe animieren**, um die Farben des Bilds über den Tween zu ändern. **Farbton** (Grad), **Sättigung** und **Helligkeit** (Prozent) funktionieren wie Farbton/Sättigung, und **Tönungsstärke** mischt jede Farbe zur **Tönungsfarbe** hin; jedes hat einen Wert für Von und einen für Ende. Das Easing der Farbspur ist das mit dem Namen „Farbe und Verlauf“ unter dem Easing pro Spur. Jedes Zwischenbild wird aus dem Bild des Start-Keyframes neu eingefärbt, sodass sich Änderungen nicht aufsummieren. Bei indizierten Sprites rasten die neu eingefärbten Pixel auf die nächste Palettenfarbe ein. - **Palettenverlauf** (indizierte Sprites): Setz ein Häkchen bei **Palettenindizes entlang eines Verlaufs verschieben**, um Farben zu zyklen, ohne sie neu einzufärben. Pixel, die die Paletteneinträge **Erster** bis **Letzter** nutzen (der transparente Eintrag bleibt außen vor), rücken bis zum Ende des Tweens um **Versatz** Stellen entlang dieser Reihe vor, entweder **umlaufend** über die Enden hinaus oder an ihnen stoppend. Andere Pixel bleiben, wie sie sind. Die Farbfelder zeigen die Farbreihe. - **Neuberechnung**: wie gedrehte oder skalierte Pixel gezeichnet werden. **Automatisch** nutzt **Nächster Nachbar** (exakte Pixel) und wechselt zu **RotSprite**, sobald sich etwas dreht oder neigt; wählst du selbst eines, bleibt es. **Bilinear** mischt Farben, für malerische Grafik. - **Subpixel**: wie Zwischenpositionen zu ganzen Pixeln werden. **Monoton** geht nie gegen die Bewegungsrichtung zurück, **Runden** nimmt das nächste Pixel, und **Abrunden** rundet ab. - **Timing**: **Frames** verteilt die Bewegung gleichmäßig auf die Zwischenbilder; **Zeit** folgt den Dauern der Frames, sodass ein längerer Frame mehr von der Bewegung abdeckt. - **Verzögerung (Frames)**: hält die Startpose so viele Frames lang, dann füllt die Bewegung den Rest des Tweens und landet trotzdem auf dem End-Keyframe. Im Easing pro Spur kann jede Spur eine andere Anzahl Frames warten, zum Beispiel eine Überblendung, die nach der Bewegung beginnt. - **Belichtung**: **jeden Frame** zeichnet in jedem Frame eine neue Pose; **jeden zweiten Frame** zeichnet nur in jedem zweiten Frame eine und hält sie für zwei, und so weiter bis acht. - **Ping-Pong (hin und zurück)**: Die Bewegung erreicht ihre Endpose in der Mitte des Tweens und kehrt bis zum End-Keyframe zur Startpose zurück, sodass eine Schleife, die dort endet, wo sie begann, keine zweite Zeichnung braucht. Das Easing formt jede Hälfte. - **Palettensperre**: Ist sie bei einem RGBA-Sprite eingeschaltet (Sprite > Palette > Palettensperre), rasten neu berechnete und neu eingefärbte Zwischenbilder auf die Palette ein, wie alles, was du malst. Eine einfache Verschiebung kopiert das Bild exakt. Das Ein- oder Ausschalten der Sperre zeichnet Tweens neu, bei denen Automatisch neu erzeugen aktiv ist. - **Automatisch neu erzeugen**: zeichnet die Zwischenbilder neu, wann immer sich der Start-Keyframe oder die Frames ändern. Schalte es aus, um sie selbst mit Bearbeiten > Cel > Tween neu erzeugen neu zu zeichnen. **Anwenden** erzeugt den Tween (oder ändert ihn) und lässt den Inspektor dazu geöffnet; **Anwenden & Schließen** schließt ihn außerdem. Beides ist ein Schritt zum Rückgängigmachen. Probleme mit einem Wert oder ein Tween, der einen anderen auf der Ebene überlappen würde, erscheinen am unteren Rand des Fensters, und Anwenden wartet, bis sie behoben sind. Liegen die Keyframes nebeneinander, ist kein Platz für Zwischenbilder: Setz ein Häkchen bei **Hinzufügen** und wähl, wie viele leere Frames beim Anwenden dazwischen eingefügt werden sollen. Frames gehören allen Ebenen gemeinsam, daher sind die neuen Frames auch auf den anderen Ebenen leer. Ist der Start-Keyframe ein verknüpftes Cel, bietet der Inspektor **Verknüpfung lösen** an, weil ein Tween das eigene Bild des Start-Keyframes braucht. Tipps: - **Jeden zweiten Frame** wirkt handgezeichnet und halbiert die Posen, die du aufräumen musst, wenn du sie übermalst. - Nimm das Subpixel **Monoton** für langsame, weiche Bewegungen: Einfaches Runden kann das Bild um ein Pixel hin und her zittern lassen. Bei Easings, die überschwingen (Back, Elastic, Bounce), und bei anderen Pfaden als Gerade wirkt es wie Runden. - Für alles, was sich dreht, hält **RotSprite** Pixel-Art-Kanten sauber und erfindet nie Farben. Nächster Nachbar ist schneller, hinterlässt aber gezackte Diagonalen. - Um ein Zwischenbild von Hand zu korrigieren, male einfach darauf: Deine Änderung bleibt erhalten, wenn der Tween neu zeichnet. - Der End-Keyframe zeigt deine eigene Zeichnung. Für eine Bewegung, die zur Ruhe kommt, zeichne (oder kopiere) das ruhende Bild auf den letzten Frame; lass ihn leer zum Ausblenden oder Wegploppen. ### Tween-Presets **Presets** oben im Inspektor enthält fertige Tweens: Ein- und Ausblenden, Dithering ein und aus, eine Dithering-Überblendung, Auf- und Wegploppen, Fallen und Abprallen, Hereingleiten von jeder Seite, ein Hereinschwingen auf einem gezeichneten Pfad, Schütteln, einen Hüpfer mit Squash and Stretch, Squash and Stretch, Schweben, Schwingen, Drehen und Blinken. Wähl eines und dann **Preset verwenden**: Es füllt das Formular, das du noch ändern kannst, und **Anwenden** (oder **Auf Ebenen anwenden**) macht es wirksam. Presets sind relativ, deshalb passt ein Preset zu jeder Zeichnung und jeder Länge: - Abstände werden in der Größe der Startzeichnung gemessen: Ein Hereingleiten „aus einer Breite links“ bewegt eine 16 Pixel breite Zeichnung um 16 Pixel und eine 40 Pixel breite um 40, die Höhe eines Bogens und die Stärke eines Schüttelns richten sich nach der kürzeren Seite der Zeichnung, und ein gezeichneter Pfad dehnt sich mit Breite und Höhe der Zeichnung. Abstände landen auf ganzen Pixeln; - die Bewegung füllt den Tween, egal wie viele Frames er hat, und eine Verzögerung ist ein Anteil davon; - der Pivot ist ein Anteil des Rahmens der Startzeichnung; - alles andere (Easing, Skalierung, Drehung, Deckkraft, Farbe, Squash, Belichtung, Ping-Pong, Überblendung) wird übernommen, wie es ist. Neuberechnung, Subpixel und Timing bleiben deine Einstellungen. Auf einem indizierten Sprite nutzt ein Preset, das ausblendet, eine Dithering-Überblendung, weil teilweise Deckkraft auf einer Palette nicht darstellbar ist. Unter **Presets speichern und verwalten** gib einen Namen ein und wähle **Als Preset speichern**, um das aktuelle Formular als eigenes Preset zu behalten (Speichern unter einem schon benutzten Namen ersetzt es); wähle eines deiner Presets, um es **Umbenennen** oder mit **Preset löschen** zu entfernen. Deine Presets bleiben auf diesem Gerät, wie gespeicherte Kurven: Sie sind nicht in der Datei und werden nicht synchronisiert. **Exportieren** lädt sie als JSON-Datei herunter, und **Importieren…** liest eine wieder ein (etwa auf einem anderen Gerät) und überspringt alles, was kein gültiges Preset ist. ### Dithering-Überblendungen und Überblendungen zum End-Keyframe Pixel-Art kann halbtransparente Pixel oft nicht zeigen, und indizierte Sprites gar nicht: Eine Alpha-Überblendung ändert dort nur die Deckkraft des Cels, die der Editor abseits der Palette mischt. Stell **Überblendung** auf **Dithering**, und die Deckkraft-Spur löst das Bild stattdessen auf: Ganze Pixel erscheinen oder verschwinden durch ein **Bayer 2×2**-, **4×4**-, **8×8**- oder **Cluster**-Muster (Raster), und der Anteil der behaltenen Pixel folgt der Deckkraft mit ihrem Easing. Das Muster ist an der Leinwand fest, nicht am Bild, deshalb wandert es nicht mit, wenn sich das Bild bewegt, und ein Einblenden fügt immer nur Pixel hinzu. Behalten werden nur ganze Pixel in den eigenen Farben der Zeichnung, sodass indizierte Sprites und Sprites mit Farbtiefe exakt bleiben. Neue Tweens auf indizierten Sprites beginnen mit Dithering. **In den End-Keyframe überblenden** verwandelt das Startbild über den Tween (nach dem Easing der Deckkraft-Spur) in die Zeichnung des End-Keyframes: Mit Dithering zeigt jedes Pixel die eine oder die andere Zeichnung, mit Alpha werden beide gemischt. Malst du auf den End-Keyframe, wird die Überblendung neu gezeichnet. ### Mehrere Ebenen tweenen Wähle Cels auf mehreren Ebenen (Kopf, Körper und Hut, oder die Buchstaben eines Titels) vom Start-Frame bis zum End-Frame aus und öffne den Inspektor. **Mehrere Ebenen** zeigt, wie viele Ebenen eine Zeichnung auf dem Start-Frame haben; stell den Tween wie gewohnt ein und wähle **Auf Ebenen anwenden**, um allen in einem Rückgängig-Schritt denselben Tween zu geben. - **Versetzt um** lässt jede Ebene so viele Frames nach der vorigen starten, in der gewählten **Reihenfolge**: oberste Ebene zuerst, unterste Ebene zuerst oder in der Reihenfolge, in der du sie ausgewählt hast. Eine spätere Ebene hält ihre Startpose, bis sie dran ist. - **Länge**: **Gemeinsam enden** lässt alle Tweens auf demselben End-Keyframe enden, spätere Ebenen bewegen sich also etwas schneller; **Verlängern** behält dieselbe Bewegungslänge, jede spätere Ebene endet also später (bei Bedarf werden am Ende Frames hinzugefügt). - **Gemeinsamer Gruppen-Pivot** skaliert, dreht und neigt alle Ebenen um einen Punkt (die Pivot-Einstellung, bezogen auf den Rahmen um die Startzeichnungen aller Ebenen), sodass sie sich als ein starres Stück bewegen, statt dass sich jede um ihre eigene Mitte dreht. In der Zeitleiste werden die Frames, in denen eine Ebene wartet, mit gestricheltem Pfeil und blasserer Tönung gezeichnet. ### Einen Bewegungspfad zeichnen Stell **Pfad** auf **Gezeichnet**, um das Bild entlang einer selbst gezeichneten Kurve zu führen. Sie beginnt als die Route, die du hattest (ein Bogen wird zu einem gekrümmten Pfad), von der Start- zur Endposition. Solange der Inspektor offen ist, zeigt die Leinwand den Pfad mit seinen Ankerpunkten, ihren Anfassern und einem Punkt für jedes Zwischenbild: - zieh einen **Ankerpunkt** (einen Kreis), um ihn zu verschieben; der erste und der letzte Ankerpunkt sind Start- und Endposition, sie zu ziehen setzt also auch die Endposition; - zieh einen **Anfasser** (ein Quadrat), um die Kurve zu biegen; der gegenüberliegende Anfasser dreht sich mit, oder halte `Alt`, um nur einen zu bewegen; - klicke auf die Linie, um dort einen Ankerpunkt hinzuzufügen, `Alt`+Klick auf einen Ankerpunkt entfernt ihn, und ein Doppelklick schaltet ihn zwischen glatt und Ecke um; - **Ankerpunkt hinzufügen** und **Ankerpunkt entfernen** im Inspektor tun dasselbe über die Tastatur. Ankerpunkte und Anfasser rasten auf Pixelmitten ein. Das Bild durchläuft den Pfad mit gleichmäßigem Tempo: Das Easing der Position bestimmt den Rhythmus entlang des Pfads, nicht die Form der Kurve. Setz ein Häkchen bei **Am Pfad ausrichten**, um das Bild in seine Bewegungsrichtung zu drehen (es beginnt ungedreht); RotSprite hält seine Kanten sauber. Der Pfad gehört zum Tween und bleibt deshalb in `.pxstudio`- und `.aseprite`-Dateien erhalten. Änderungen auf der Leinwand warten wie der Rest des Formulars, bis du anwendest. Nimm das Häkchen bei **Pfad auf der Leinwand bearbeiten** weg, um den Pfad ohne seine Anfasser zu sehen. ### Eine eigene Easing-Kurve zeichnen **Kurve zeichnen** (neben Linear, Halten und Stufen) macht aus dem Easing eine Kurve, die du formst: ein Quadrat, in dem die horizontale Achse angibt, wie weit du im Tween bist, und die vertikale, wie weit die Bewegung gekommen ist. Sie beginnt mit dem Easing, das du gewählt hattest. Zieh einen Punkt (einen **Anker**), um ihn zu verschieben, zieh die Quadrate neben dem ausgewählten Punkt (seine **Griffe**), um die Kurve zu biegen, doppelklick auf leere Fläche, um einen Anker hinzuzufügen, oder doppelklick auf einen Punkt (oder drück `Del`), um ihn zu entfernen. Die Pfeiltasten verschieben den fokussierten Anker, und die Felder **Fortschritt** und **Stärke** legen ihn exakt fest. **Ecke** nimmt die Griffe weg, sodass die Kurve dort scharf abknickt. Werte über 1 oder unter 0 schwingen über. **Spiegeln** spiegelt die Kurve; **Starten mit** ersetzt sie durch ein beliebiges fertiges Easing zum Bearbeiten. Gib der Kurve einen Namen und wähl **In Bibliothek speichern**, um sie für andere Tweens zu behalten: Gespeicherte Kurven liegen nur auf diesem Gerät, und wenn du unter **Gespeicherte Kurven** eine wählst, wird sie in den Editor geladen. Speicherst du unter einem Namen, den du schon benutzt hast, ersetzt das diese Kurve. ### Ketten und das Ende eines Tweens verschieben Eine Kette ist eine Reihe von Tweens durch mehrere Keyframes einer Ebene, wobei jeder auf dem Keyframe endet, an dem der nächste beginnt, sodass eine Zeichnung einen Tween beenden und den nächsten starten kann. Wähl den ersten Keyframe aus und wähl Bearbeiten > Cel > Tween über Keyframes, um durch jeden späteren Keyframe der Ebene zu verketten, wobei jeder Tween auf seinem eigenen End-Keyframe landet, oder nutze **Über mehrere Keyframes verketten** im Inspektor, um zu wählen, wo es stoppt, und deine eigenen Einstellungen zu behalten. Es ist ein Schritt zum Rückgängigmachen. Tweens, die bereits an diesen Keyframes beginnen, werden ersetzt. Um zu verschieben, wo ein Tween endet, wähl seinen Start-Keyframe bis zum Frame aus, auf dem er enden soll, und wähl Bearbeiten > Cel > Tween-Ende auf Auswahl setzen, oder ändere im Inspektor **End-Keyframe** und wende an. Ein Tween lässt sich nicht in den nächsten einer Kette hinein verlängern. ### Tweens in Skripten Skripte bekommen dieselben Tweens: `app.setTween(layerId, frameId, { to = endFrameId, end = { dx = 12 }, ease = "quad", mode = "out", path = "arc", height = 6 })` tweent das Cel einer Ebene bei `frameId` zu einem späteren Frame und gibt die ID des Tweens zurück, und `app.regenerateTween`, `app.bakeTween` und `app.removeTween` nehmen die Ebene und den Start-Frame. `app.setTweenChain(layerId, { frameA, frameB, frameC }, opts)` tweent in einem Schritt durch diese Keyframes und gibt die IDs der Tweens zurück, und `app.setTweenEnd(layerId, frameId, newEndFrameId)` verschiebt das Ende eines Tweens. Die Optionen nehmen auch `curve` (ein gezeichnetes Easing), `trackEasing`, `color` und `colorFrom` (Farbton, Sättigung, Helligkeit, Tönung), `tintColor` (ein Hex-String oder `{ r, g, b }`), `ramp` (`{ first, last, shift, wrap }`), `fade`, `ditherPattern` und `crossfade`, `delay` und `trackDelay`, `pivotSpace`, `orient` sowie `path = "custom"` mit `points` (den Ankerpunkten des gezeichneten Pfads). `app.tweenPresets()` listet die eingebauten Presets, und `app.tweenPreset("popIn")` gibt eines zurück; übergib sein `recipe` als Option `preset`, um es auf das Start-Cel zu skalieren. `app.setTweenStagger({ layerA, layerB }, frameId, { to = endFrameId, preset = app.tweenPreset("slideInTop").recipe, step = 2, groupPivot = true })` tweent mehrere Ebenen in einem Schritt. Alle Optionen stehen in der Skript-Referenz. ### Tweens in der Zeitleiste - Ein **Pfeil** läuft am unteren Rand der Cels vom Start-Keyframe zu einer Pfeilspitze auf dem End-Keyframe. Ein Keyframe kann einen Tween beenden und den nächsten starten. - Die **Zwischenbild**-Frames sind blau getönt. Frames, in denen der Tween noch seine **Verzögerung** abwartet, sind blasser, mit gestricheltem Pfeil. - Eine kleine dunkle **Raute** markiert ein Zwischenbild, auf das du gemalt oder das du verschoben hast. Deine Änderung bleibt, wenn der Tween neu gezeichnet wird, bis du Bearbeiten > Cel > Zum Tween zurückkehren nutzt. - Ändert sich der Start-Keyframe oder ändern sich die Frames oder ihr Timing, ist der Tween **veraltet**: Seine Zwischenbilder passen nicht mehr. Der Pfeil wird bernsteinfarben, ebenso die Ecke des Start-Keyframes. Nutze Bearbeiten > Cel > Tween neu erzeugen, um ihn neu zu zeichnen. Ein Tween, der sich selbst neu erzeugt, ist nie veraltet, außer auf einer gesperrten Ebene. - Eine **rote Ecke** auf einem Start-Keyframe bedeutet, dass der Tween **defekt** ist: Sein End-Frame wurde gelöscht oder davor verschoben. Gib ihm ein neues Ende oder entferne ihn. Fahr mit dem Zeiger über ein Cel, um dasselbe in Worten zu lesen („tween start, to frame 9, stale“, „tweened, edited by hand“); Screenreader sagen es ebenfalls an. ### Tween-Befehle Sie stehen unter **Bearbeiten > Cel** und im Rechtsklick-Menü eines Cels. Sie wirken auf die ausgewählten Cels (oder das aktive Cel), und jedes Cel eines Tweens, sein Start-Keyframe oder ein Zwischenbild, steht für den ganzen Tween. Jeder ist ein Schritt zum Rückgängigmachen, und gesperrte und ausgeblendete Ebenen werden übersprungen. - Bearbeiten > Cel > Tween neu erzeugen zeichnet die Zwischenbilder aus dem Start-Keyframe neu und lässt die von Hand bearbeiteten in Ruhe. - Bearbeiten > Cel > Zum Tween zurückkehren setzt die ausgewählten, von Hand bearbeiteten Zwischenbilder auf das zurück, was der Tween zeichnet. - Bearbeiten > Cel > Tween fixieren behält jedes Zwischenbild als einfaches Cel und entfernt den Tween, sodass nichts sie je wieder neu zeichnet. - Bearbeiten > Cel > Tween entfernen entfernt den Tween und die Zwischenbilder, die er gezeichnet hat. Die von Hand bearbeiteten bleiben als einfache Cels. - Bearbeiten > Cel > Tween-Einstellungen kopieren kopiert die Einstellungen eines Tweens: Easing, Bewegung, Pfad und Timing, aber nicht, wo er endet. Bearbeiten > Cel > Tween-Einstellungen einfügen wendet sie auf jeden ausgewählten Keyframe an. Ein Keyframe, der bereits einen Tween startet, behält sein Ende; sonst läuft der Tween zum nächsten Frame dieser Ebene mit einem gezeichneten Cel. Keyframes ohne etwas dahinter werden übersprungen. ## Onion Skin Onion Skin zeigt verblasste Kopien der Frames vor und nach dem aktuellen, damit du die Bewegung beim Zeichnen siehst. Schalte es mit Ansicht > Onion Skin anzeigen oder der Onion-Skin-Schaltfläche in der Leiste der Werkzeugoptionen ein. Es gilt pro Editoransicht. Einstellungen > Onion Skin... wählt, wie viele Frames davor und danach gezeigt werden (bis zu 16 je Seite), ihre Deckkraft und wie stark sie pro Frame verblasst, ob frühere Frames rot und spätere blau getönt werden, ob nur die Frames des aktuellen Tags gezeigt werden und ob die Kopien hinter oder vor dem Sprite gezeichnet werden. Hinten werden sie über der Hintergrundebene und unter den anderen Ebenen gezeichnet, sodass sie auch bei einem Sprite mit Hintergrundebene zu sehen sind. Die Tönung färbt jede Kopie nach ihrer Helligkeit ein, sodass auch dunkle Umrisse als dunkelrot oder dunkelblau erscheinen. Diese Einstellungen gelten für jeden Sprite. Onion Skin folgt der Wiedergabe, wie in Aseprite. Es läuft nicht über den ersten oder letzten Frame hinaus herum. Mit **Nur aktueller Tag** nutzt es den kleinsten Tag um den aktuellen Frame, in der Richtung dieses Tags: In einem rückwärts laufenden Tag ist der Frame „davor“ der nächste auf der Zeitleiste. Mit **Frames des Tags als Schleife** läuft es innerhalb des Tags herum, und ein Ping-Pong-Tag prallt an seinen Enden ab.