Was macht Motion Doctrine (Gateway)?
Lies dies, bevor du eine Animation erstellst. Es entscheidet, WAS an jeder Nahtstelle passiert und wie jede Szene performt; die technischen Fertigkeiten setzen es um. Diese Regeln superseded generische / vorgelagerte Bewegungsvorgaben. Der Fehler, den dies verhindert: isoliert erstellte Szenen – der Schwung des Auges stirbt an jedem Schnitt, und Szenen wackeln auf der Stelle zwischen Ein- und Ausgang.
Routenkarte
| Entscheidung (dieses Skill) | Umsetzungs-Skill |
|---|---|
| Auswahl der Nahtstellen-Transition + Parameter + Code | cut-the-curve §1–5 (der Katalog) |
| Kaskadierung von Text / Element-Eingängen | cut-the-curve §6 (Wasserfall-Eingang) |
| Neupositionierung von Gruppen innerhalb einer Szene | cut-the-curve §7 (Nudge-Kurve) |
| Cursor-geführte Aktion / Szenen-Start / Morph-Zündung | oversized-cursor |
| Rendermechanik von Nahtstellen / White-Flash-Schutz | seam-craft |
| Produkt-Launch / Erklärer / Beschriftungsarbeit | Überlagert text-beat-economics, brand-faithful, captions-overlay auf das vorgelagerte Skill |
Erstellungsreihenfolge: Vektor-Hauptbuch (ledger.json) → STAMP die Haupt-Nahtstellen daraus (scripts/seam-stamp.mjs --ledger ledger.json --write index.html) → Route der anhaltenden Bewegung pro Phase → Träger und Ursachen → Build-Kompositionen → VERIFIZIEREN (scripts/seam-gate.mjs). Nur Tier-A-Morphs/Match-Cuts manuell erstellen; gestempelte Nahtstellen bestehen die Prüfung konstruktionsbedingt.
Teil 1 — Das Nahtstellengesetz
Das Vektorgesetz
Wie Szene A ausgeht, bestimmt, wie Szene B eintritt: gleiche Achse, gleiche Richtung, gleiche Geschwindigkeit, Schnitt mittendrin auf beiden Seiten.
- Achse – x bleibt x, y bleibt y, Z bleibt Z. Tausche niemals die Achsen über einen Schnitt hinweg.
- Richtung – niemals spiegeln. Auf Z bedeutet Richtung das VORZEICHEN der Skalierungsänderung: Wachsen = Schieben (Kamera vorwärts), Schrumpfen = Ziehen (Kamera zurück). Ein zurückweichender Ausgang, beantwortet durch einen aus-dem-Kleinen-wachsen-Eingang, ist ein gespiegelter Vektor – der häufigste Verstoß, da aus-dem-Kleinen-wachsen der Standard-Element-Eingang ist.
- Geschwindigkeit – Anfangsgeschwindigkeit des Eingangs ≈ Endgeschwindigkeit des Ausgangs, durch gespiegelte Easing-Funktionen (Ausgang
power4.in+ Eingangpower4.out, gleiche Distanz und Dauer; die eingehende Seite übernimmt ≥50% des gedachten Pfads). Mechanik incut-the-curve. - Phase – der Schnitt landet mittendrin auf BEIDEN Seiten. Zur Ruhe kommen vor dem Schnitt oder von Ruhe aus starten nach dem Schnitt ist ein toter Schlag.
Der Filmstrom (Current)
Jeder Film wählt EINE dominante Richtung (Standard: LINKS). Jede gewöhnliche Nahtstelle verwendet sie. Andere Vektoren sind RESERVIERT – sie einzusetzen bedeutet etwas:
| Vektor | Bedeutung |
|---|---|
| Der Strom (LINKS) | "nächster Schlag" – neutraler Vorwärtsfortschritt |
| Aufwärts | Erhöhung – eine Schlussfolgerung oder Enthüllung erhebt sich über das Vorherige |
| Z vorwärts (Zoom-durch) | Tiefer eintauchen in denselben Gedanken |
| Z rückwärts (inverser Zoom) | ANKUNFT – etwas Größeres landet |
| Skalierungs-Burst (explodieren raus) | Eine Welt verlassen – eine Oberfläche rast an der Kamera vorbei |
- Führe niemals aufeinanderfolgende Nahtstellen in entgegengesetzte Richtungen – Ping-Pong wirkt wie ein Fehler.
- Ein Richtungswechsel benötigt eine sichtbare Ursache (Klick / Prellen / Aufprall) oder eine Kapitelgrenze.
Das Vektor-Hauptbuch (Ledger)
Schreibe es, bevor du eine Haupt-Zeitleiste erstellst – als ledger.json im Projektstamm (Schema: references/seam-gate.md). Eine Zeile pro Nahtstelle: Schnittzeit, Ausgangs- und Eingangsvektoren (Achse + vorzeichenbehaftete Richtung; Z-Zeilen tragen das Skalierungsvorzeichen), Selektoren, Technik. Ausgang und Eingang müssen übereinstimmen; wenn eine Zeile nicht passt, korrigiere den Plan, nicht das Easing. Der Prüfer prüft die Konsistenz der Zeilen statisch vor jeder Laufzeit-Stichprobe.
Träger (Carriers)
Das Auge folgt Objekten, nicht Abstraktionen. Die stärksten Nahtstellen übergeben einen konkreten Träger über den Schnitt hinweg bei MATCHENDER Position UND Geschwindigkeit: Ein Cursor auf halbem Weg, ein Container, der schrumpft und in das nächste Layout dockt, eine Markierung, die in ihren genauen Slot fliegt, die Wortgruppe eines Wasserfall-Schnitts. Ohne natürlichen Träger übernehmen die Szenen-Helden die Last (Teilreise + frühes Ausblenden, Eintritt im Flug). Niemals eine Überblendung – sie hat überhaupt keinen Träger.
Kausale Bewegung
Verkette Bewegungen so, dass jede Bewegung sichtbar von der letzten ausgelöst wird: Klick → Quetschen → Sprungfeder lösen → Flug → Aufprall → Rückstoß → Enthüllen.
- Effekte beginnen IM gleichen Frame wie die Ursache – gleiche Zeitposition in der Zeitleiste, niemals "kurz danach".
- Reaktionen skalieren mit der implizierten Masse: Große Elemente federn langsamer zurück, kleine schneller.
- Eine Kraft ist eine Lizenz zum Richtungswechsel; ein grundloser Richtungswechsel ist ein Ping-Pong.
Die Nahtstellenschleuse (Seam Gate – Build-Prüfung, führe den Prüfer aus, Exit 0 oder die Nahtstelle ist nicht fertig)
node <SKILL_DIR>/scripts/seam-stamp.mjs --ledger ledger.json --write index.html # generieren
node <SKILL_DIR>/scripts/seam-gate.mjs verify --ledger ledger.json --project . # verifizieren
Das Skript (Verwendung + Ledger-Schema: references/seam-gate.md) erzwingt numerisch pro Nahtstelle: Konsistenz der Ledger-Zeile, Ausgang noch in Bewegung am Schnitt, Eingang im Flug (niemals aus Ruhe), gemessene Richtung = Ledger-Richtung, Geschwindigkeitsabgleich von Eingang/Ausgang (WARN), keine Überlappung (eine Seite sichtbar pro Frame – der Schnitt ist keine Überblendung), die Z-Vorzeichenregel (d(scale)/dt gleiches Vorzeichen auf beiden Seiten; die Eingänge der eingehenden Szene selbst werden auf Vorzeichenkonflikte geprüft) und Kontinuität des Trägerrechtecks unter Einbeziehung der übergeordneten Skalierung. Verwende seam-gate.mjs probe --t <Schnittzeit> um die echten Trägerselektoren jeder Nahtstelle zu finden, wenn du das Ledger erstellst.
Regeln, die das Skript NICHT prüfen kann – liegen dennoch in deiner Verantwortung:
- Bearbeitungen öffnen die Nahtstelle neu. Jede Änderung an den ersten/letzten ~1s einer Szene (inkl. Neutiming auf neue VO) macht die Prüfung dieser Grenze ungültig – führe den Prüfer erneut aus.
- Audio ist die Uhr. Timing von Szenen auf die echten Wort-Zeitstempel der VO; zwinge niemals einen Sprechtext in einen Slot. Eine Neuerstellung der VO öffnet ihre Nahtstellen neu.
- Clip-Gating-Falle (die übliche Ursache für einen FEHLER "keine Überlappung"): Ein Clip, dessen
data-startvor seinem Eingangs-Tween liegt, wird bei seiner anfänglichen Deckkraft sichtbar – setze anfänglichautoAlpha: 0UNDdata-start= die Schnittzeit, niemals früher.
Teil 2 — Performance (die Szene performt weiter)
Kein sinnloses Wackeln
Sinusförmige Leerlaufschleifen (atmen, schweben, treiben, Glühen-Pulsieren) sind als anhaltende Bewegung VERBOTEN – sie wirken wie "das Video wartet". Eine Szene, die Sekunden vor Schluss fertig mit dem Eintritt ist, ist ein Planungsfehler: Füge Geschichte hinzu, kein Wackeln. Jede Phase zwischen Eintritt und Austritt gehört zu einer dieser Routen (nenne die Route im Plan):
| Route | Was es ist |
|---|---|
| Gestaffelte Enthüllungen | Halte Inhalt zurück; zeige ihn auf Erzählschlägen – der Frame gewinnt ständig an Information (Standard für ≥2 Inhaltsgruppen) |
| Kamera mit Absicht | Ein kartierter Skalierungs+Verschiebungs-Pfad: Etabliere Übersicht → Reise → Ankunft beim Thema |
| Sequenzielles UI-Leben | Das Produkt verhält sich über Zeit: Fortschritt schreitet voran, Highlights Schritt, Zähler ticken |
| Animierte Sequenzen | Elemente spielen einen Schlag nach: Eine Karte wird in einen Stapel einsortiert, ein Gegenstand wird gezogen, ein Ergebnis setzt sich zusammen |
| Cursor-geführte Aktion | Ein überdimensionierter Cursor führt das Auge zu einem Auslöser; sein KLICK zündet den nächsten Schlag (oversized-cursor) |
Test: Pausiere zu jeder Sekunde – etwas Bedeutendes muss im Flug sein (eine Enthüllung landet, die Kamera reist, das UI tut, was die Erzählung sagt).
Stille vor dem Höhepunkt
Plane eine 0.3–0.75s Pause zwischen der Hauptaktion und ihrem Ergebnis – das dramatische Komma. Eine Szene, die direkt von der Aktion zum Ergebnis springt, verliert es.
Timing-Intents
- Einzelner Eintritt ≤ ~800ms; längere Etablierung = Staffelung mehrerer Elemente, nicht ein langsames Element.
- Austritt ≈ 75% des Eintritts. Ausnahme:
cut-the-curvekehrt dies um (Eintritt ~127% des Austritts). - Gesamt-Staffelung ≤ 500ms; bei 8+ Elementen, verringere die Verzögerung pro Element oder staffle die ersten paar.
- Verbotene Easings:
bounce.out/elastic.out. Eingangs-Überschwingerback.out(1.4–1.7)sind in Ordnung. - Ähnliche Elemente teilen sich ein Easing- und Dauer-Intent – niemals ein einzigartiges Paar pro Element.
Übergangsvokabular
Verwende nur 2–3 Szenenübergänge pro Film und wiederhole sie; die Standardgrenze ist cut-the-curve in Richtung des Filmstroms. Handgeschriebene Shared-Element-Morphs (intent: morph) zählen nicht gegen das Budget.
Anti-Patterns
| Nicht so | Stattdessen |
|---|---|
| Jede Szene einzeln erstellen | Schreibe zuerst das Vektor-Hauptbuch |
| Überblendung zwischen Szenen | cut-the-curve in Richtung des Filmstroms |
| Austritt abgeschlossen, DANN Szenenwechsel | Schneide mittendrin auf beiden Seiten |
| Eintritt beginnt aus Ruhe nach einem Schnitt | Trete ≥50% des gedachten Pfads ein |
| Inverser Zoom-Austritt → aus-dem-Kleinen-wachsen-Eingriff (oder Schieben → übermäßiger Rückzug) | Gleiche das Skalierungsgeschwindigkeits-Vorzeichen an (Seam Gate 7) |
| Eintritt der eingehenden Szene als Pop-In unter einer Z-Nahtstellenübergabe | Halte seinen Öffnungsframe komponiert oder passe das Vorzeichen an |
| Leerlauf-Wackeln / Atmen / Schweben, um Zeit zu füllen | Weise eine Route für anhaltende Bewegung zu; oder füge Geschichte hinzu |
| Richtungswechsel ohne Ursache | Setze eine Kraft ein, oder behalte den Strom |
| Reservierte Vektoren als Abwechslung verwendet | Standardmäßig den Strom; setze sie für Bedeutung ein |
| Reaktion ein paar Frames nach ihrer Ursache | Zündung im gleichen Frame |
| Aktion springt direkt zum Ergebnis | Plane Stille vor dem Höhepunkt (0.3–0.75s) |