Claude Motion System — Meister-Guide für den Benutzer
Der vollständige Guide befindet sich in GUIA-MAESTRA.md (gleicher Ordner, 20 Abschnitte). Lade ihn nicht vollständig: lies den Abschnitt, den die Aufgabe benötigt (suche die Überschrift # N. mit Grep und lies diesen Abschnitt).
Hauptregel (§0)
Bevor du ein visuelles Element eines Projekts entwirfst, generierst, animierst, editierst oder renderst, lies MOTION.md vollständig (Stammverzeichnis des Repositorys). Wenn es nicht existiert, leer ist oder nicht mehr das tatsächliche Design repräsentiert, führe zuerst ein Audit des Projekts durch und erstelle oder aktualisiere es. Motion verstärkt Information, Hierarchie, Erzählung und Marke; es ist niemals Dekoration oder eine generische KI-Demo.
Routine
- Entdecken (§3): README, CLAUDE.md, package.json, CSS/Tailwind-Tokens, Komponenten und Layouts, Logos, Schriftarten, Assets, Screenshots, Figma, vorhandene Videos und Audio. Beantworte: Persönlichkeit, dominante und funktionale Farben, tatsächliche Schriftarten, Hierarchie, welche Bewegung konsistent ist und was sich nie ändern darf.
- Klassifizieren (§3): A ohne Bewegungsbedarf (nichts installieren) · B App mit Demo-Potenzial (
MOTION.mderstellen, ohne Videoprojekt) · C aktives Motion/Video (HyperFrames und QA vorbereiten) · D mit After Effects (zusätzlich AE-MCP). MOTION.md(§5): Zweck, Identität, Farbe, Typografie, Raster, Bewegungssprache (Principien, Timing, Easing, Verbote), Motion pro Komponente, Kamera/3D, Audio, Schnitte, Formate und Qualitätsanforderung. Wird ausgehend von der ECHTEN Identität erstellt; ergänzt das Designsystem, ersetzt es nicht. Wenn sich das Produkt geändert hat, wird es vor der Produktion korrigiert.- Neues Stück:
BRIEF.md(§6) →STORYBOARD.md(§7). Jede Szene erfüllt eine narrative, informative oder markenbezogene Funktion. - Audio (§8): die Musik ist die redaktionelle Uhr – zuverlässige Beats, Phrasen, Drops, Stille; kein Aufzwingen eines Beat-Rasters.
- Implementieren (§9): HyperFrames (
/hyperframesals Eingabe) oder die Engine, die das Projekt bereits hat. Keine Engines duplizieren (§13): Wenn das Repository bereits eine eigene Motion-Engine hat, wird diese verwendet. - QA (§11): doctor → lint → check → Snapshots kritischer Frames (ansehen) → vollständige Vorschau → Render →
ffprobeund Überprüfung der finalen Datei. Nie „fertig“ nur weil es kompiliert. - Kriterium „sieht nicht billig aus“ (§12) und Definition von „fertig“ (§17): MOTION-READY und DELIVERY-READY.
Sicherheitsregeln und technische Schulden
- Keine Video-Abhängigkeiten in Projekten installieren, die kein Video produzieren (§3, §13).
npxvon Drittanbietern (HyperFrames, After Effects MCP) nur bei Produktion und mit Zustimmung der Benutzerin verwenden.- After Effects per MCP nur, wenn eine
.aep-Datei existiert oder die Ausgabe es erfordert; vor dem Bearbeiten Backup erstellen (§10). - Echte Marken-Assets verwenden; niemals Logos, Daten, Screenshots oder Behauptungen erfinden (§15). Kundendaten niemals in visuellen Stücken ohne Genehmigung verwenden.
- Formatabhängig neu komponieren (16:9, 9:16, 1:1), niemals blind zuschneiden (§16).
Index des Guides
| § | Thema |
|---|---|
| 0 | Meisterordnung |
| 1 | Was das Video lehrt (HyperFrames, MOTION.md, Musik, After Effects) |
| 2 | Globale + projektbezogene Architektur |
| 3 | Bootstrap: Entdecken und Klassifizieren |
| 4 | HyperFrames installieren/überprüfen |
| 5 | Vorlage für MOTION.md |
| 6 | BRIEF.md |
| 7 | STORYBOARD.md |
| 8 | Audio als redaktionelle Uhr |
| 9 | Implementierung mit HyperFrames |
| 10 | After Effects per MCP |
| 11 | Verbindliche QA-Pipeline |
| 12 | Kriterium „sieht nicht billig aus“ |
| 13 | Keine technischen Schulden |
| 14 | Empfohlene Organisation |
| 15 | Asset-Richtlinie |
| 16 | Multiformat |
| 17 | Definition von „fertig“ |
| 18 | Einzigartiger Prompt zur Vorbereitung eines Repositorys |
| 19 | Referenzbefehle |
| 20 | Abschließendes Prinzip |