Zur Nutzungsanleitung springen
Motion Canvas Agentvon VideoZero

Motion Canvas Agent Skill.

Steuere einzelne Frames an, prüfe Szenen, erstelle Screenshots und starte Renderings im laufenden Motion-Canvas-Editor.

  • Motion Canvas
  • Szenenprüfung
Quellprüfung · motion-canvas-agentSKILL.md
Aufgabe Steuere einzelne Frames an, prüfe Szenen, erstelle Screenshots und starte Renderings im laufenden Motion-Canvas-Editor. Ergebnisse Eine lokale Steuerungsbrücke für ein Motion-Canvas-Projekt. Vor dem Start Beginne mit einem vorhandenen Motion-Canvas-Projekt und Erlaubnis für beide Integrationsplugins. Halte den Editor offen und benenne zu prüfende Frames und Ausgabeeinstellungen.
Redaktionelle Zusammenfassung · Quelle geprüft am 2026-11-02 · kein generiertes Beispiel

01 Funktionen

Frames ansteuern, Szenen prüfen, Screenshots erstellen und Renderings starten

Steuere einen lokalen Motion-Canvas-Editor per HTTP für exakte Screenshots, Szenengraphprüfung, Einstellungen und Renderaktionen.

Quellenbasierter WorkflowKein Ausführungs-Benchmark

Die Arbeitsweise

motion-canvas-agent verbindet einen Agenten über eine lokale HTTP-API mit einem laufenden Motion-Canvas-Editor. Er kann Frames ansteuern, Screenshots aufnehmen, den Szenengraphen prüfen, Vorschau- oder Rendereinstellungen ändern und Exporte auslösen. Player und Renderer laufen weiterhin im Browser.

Die Integration verwendet zwei Dateien: ein Vite-Serverplugin und ein Clientplugin im Motion-Canvas-Projekt. Anfragen laufen über den Entwicklungsserver zum offenen Browser. Exakte Frame-Prüfung wird dadurch skriptfähig, benötigt aber eine aktive Editorverbindung statt als eigenständiger Headless-Renderer zu arbeiten.

Erwartete Ergebnisse

  • Eine lokale Steuerungsbrücke für ein Motion-Canvas-Projekt.
  • Framespezifische Screenshots und Szenengraphdaten.
  • Angeforderte Renderaktionen und aufgezeichnete Vorschau-/Rendereinstellungen.
Beispiel-Briefing ansehen

Vom Briefing zur Prüfung

  1. 01
    Beide Plugin-Seiten verbinden

    Füge das Serverplugin zu Vite und das Clientplugin zum Motion-Canvas-Projekt hinzu. Starte den Entwicklungsserver und öffne den Editor im Browser.

  2. 02
    Einen bekannten Frame prüfen

    Prüfe den Verbindungsstatus, setze die vorgesehene Größe und steuere einen exakten Frame an. Erfasse ihn und vergleiche Szenengraphwerte mit dem sichtbaren Ergebnis.

  3. 03
    Mit expliziten Einstellungen rendern

    Prüfe Fehler und unterscheide Vorschau- von Rendereinstellungen. Starte den gewünschten Export und verifiziere das tatsächliche Artefakt nach Abschluss.

02 Einsatzbereiche

Wann einsetzen?

Beginne mit einem vorhandenen Motion-Canvas-Projekt und Erlaubnis für beide Integrationsplugins. Halte den Editor offen und benenne zu prüfende Frames und Ausgabeeinstellungen.

Gut geeignet

  • Ein Agent braucht framegenaue NachweiseDie API bietet Ansteuerung und Screenshots ohne manuell getimtes Browser-Abspielen.
  • Der sichtbare Szenenzustand ist unklarDer rekursive Graph meldet Knotentypen, Positionen, Größen und Texte zur visuellen Diagnose.

Zu prüfende Grenzen

  • Ein offener Browser ist erforderlichDer Server vermittelt zum laufenden Player und Renderer. Ein getrennter Editor liefert keine vorgesehene Steuerung.
  • Der Endpunkt soll lokal bleibenDie Quelle warnt vor dem Veröffentlichen der Entwicklungssteuerungs-API im Netzwerk.
  • Renderanfrage ist nicht AbschlussEine angenommene API-Aktion braucht weiterhin Prüfung der Ausgabedatei und Wiedergabe.

Diese Eingaben mitbringen

  • Vorhandenes ProjektLiefere das Motion-Canvas-Projekt und Erlaubnis für die zwei Integrationsdateien.
  • PrüfzieleBenenne Szenen, Framenummern und visuelle Prüfbedingungen.
  • AusgabeeinstellungenGib Bildgröße, Bereich, Renderbildrate und Ziel an.

03 Wichtige Entscheidungen

Wichtige Entscheidungen

  1. Wiederholbare Aufnahmen

    Derselbe Frame kann nach einer Codekorrektur erneut geprüft werden.

  2. Sichtbarer Zustand

    Szenengraphprüfung ergänzt Screenshots um konkrete Knotenwerte.

  3. Getrennte Einstellungen

    Vorschau- und Rendersteuerung lassen sich prüfen, statt ihre Gleichheit anzunehmen.

04 Beispielbriefing

Ein konkretes Briefing ausprobieren

Das folgende Beispiel-Briefing wurde nicht getestet. Prüfen Sie die Einrichtung des Skills, bevor Sie es verwenden.

Quelle und Einrichtung prüfen

Liefere das Motion-Canvas-Projekt und Erlaubnis für die zwei Integrationsdateien.

Upstream-Quelldatei
https://github.com/VideoZero/skills/blob/670ff96af6149f0ac8850380a466f073471e600c/motion-canvas-agent/SKILL.md

Der folgende Verweis öffnet die Originalanleitung. Prüfe vor der Nutzung die Einrichtung des Repositorys; dies ist kein Installationsbefehl.

Mit einem Ergebnis beginnen

Passen Sie Umfang, Quellmaterial und Rahmenbedingungen in diesem Briefing an, bevor Sie den Skill ausführen.

Beispiel-Briefing
Prüfe mit motion-canvas-agent meine laufende Motion-Canvas-Sequenz nach Plugin-Verbindung. Bestätige die Editorverbindung und erfasse ersten Frame, Paketübergabe und letzten Frame mit 1920 mal 1080. Prüfe den Szenengraphen an der abgeschnittenen Paketstelle und den Fehlerendpunkt. Binde die API nur lokal. Dokumentiere Vorschau- und Renderbildraten separat und löse danach den freigegebenen Renderbereich aus. Melde die tatsächliche Exportdatei erst, wenn sie existiert und sich abspielen lässt. Behandle die Bestätigung des Renderendpunkts nicht als fertigen Export.

Ergebnis prüfen

Prüfen Sie die tatsächliche Ausgabe anhand dieser beobachtbaren Kriterien.

  • Browserverbindung vor Ansteuerung oder Aufnahme bestätigen.
  • Screenshot-Frame-Metadaten mit dem angeforderten Frame vergleichen.
  • Ausgabeeinstellungen, Fehler und fertiges Renderartefakt verifizieren.

OpenDesign bietet einen lokalen Design-Arbeitsbereich für Coding-Agenten. Dieser Eintrag bedeutet nicht, dass der Skill mitgeliefert wird oder dass seine externen Tools, Zugangsdaten und Software-Abhängigkeiten enthalten sind.

05 Quelle und Lizenz

Quelle und Lizenz

Diese Seite beschreibt die unten verlinkte, festgelegte Quellrevision. Verhalten und Anforderungen im Upstream können sich ändern.

Quellinhaber
VideoZero
Skill-Datei
SKILL.md
Geprüfter Stand
2026-11-02 · 670ff96af614
Redaktionelle Quellenzusammenfassung
Steuere einzelne Frames an, prüfe Szenen, erstelle Screenshots und starte Renderings im laufenden Motion-Canvas-Editor.

Originalzusammenfassung von OpenDesign auf Grundlage der verlinkten Quelle. Repository-Sterne sind ein datiertes Popularitätssignal, keine Skill-Nutzung und keine Qualitätsbewertung.

06 Fragen vor dem Start

Fragen vor dem Start

Geht das ohne Browser?

Die dokumentierte Architektur benötigt einen offenen Motion-Canvas-Editor. Das Clientplugin stellt Live-Player und Renderer über die Serverbrücke bereit.

Schreibt der Skill Animationsszenen?

Seine Hauptrolle ist Steuerung und Prüfung. Der ergänzende Skill motion-canvas behandelt Framework-Konzepte und Szenenerstellung.

Darf ich die API auf einem gemeinsamen Server veröffentlichen?

Die Quelle empfiehlt ausdrücklich localhost-only. Steuerungsendpunkte sollten nicht als produktiver Netzwerkdienst veröffentlicht werden.

OpenDesign

Briefing und Designarbeit an einem Ort.

Halten Sie Briefing, Quellmaterial und Designarbeit in einem lokalen Arbeitsbereich zusammen. Prüfen Sie die Einrichtung des Skills, bevor Sie ihn in Ihren Workflow aufnehmen.

Upstream-Quelldatei
https://github.com/VideoZero/skills/blob/670ff96af6149f0ac8850380a466f073471e600c/motion-canvas-agent/SKILL.md