alesha-pro/tools

Motion Reel Studio

Produisez un projet d'animation modifiable et un film vérifié, pas seulement une invite ou un aperçu HTML. Adapté du cours de Movez ; l'implémentation et les corrections sont documentées dans provenance. Fonctionne avec n'importe quel agent de codage capable ; aucun modèle, service payant ou compétence externe particulier n'est requis.

Champ d'application et décisions de départ

Lisez le brief de l'utilisateur et les instructions existantes du projet. Préservez le moteur, le look, la musique et le format demandés. Si un projet utilise déjà Remotion ou HyperFrames, étendez-le ; consultez les instructions/documentation actuelles de ce framework. Sinon, utilisez le starter Canvas + Playwright + FFmpeg fourni. Les commandes ci-dessous concernent uniquement cette route par défaut.

Établissez l'URL du sujet/produit, l'objectif, la durée, les ratios d'aspect, les références, les assets de marque et le son. Déduisez les réponses fournies ; ne demandez que les informations manquantes cruciales. Pour un showreel ouvert, choisissez et énoncez un concept, 15 secondes, 1080×1920, 60 ips et un audio original synthétisé. N'inventez pas d'affirmations sur le produit ou de captures d'écran. Si les assets réels du produit ne sont pas disponibles, collectez-les ou étiquetez explicitement une démo conceptuelle autorisée.

Créez la production dans l'emplacement de l'artefact de l'utilisateur. Dans le dépôt X, utilisez posts/<slug>/ pour un nouveau film et conservez tous les assets à cet endroit. N'installez aucun fichier de projet à la racine du dépôt. La compétence elle-même reste dans le répertoire personnel des compétences. Travaillez localement sans dépenses API par défaut ; un fournisseur demandé nécessite des outils disponibles, des identifiants et un budget autorisé. La publication est une action séparée.

Flux de production

1. Références et assets. Inspectez les images fournies. Pour les références vidéo, extrayez des images toutes les 0,5 à 1 seconde et inspectez le mouvement autour des coupes. Capturez les états réels du produit avec des outils de navigateur ; conservez les URL d'origine et les dates de capture dans docs/assets.md. Téléchargez les polices/images localement et attendez le décodage. Écrivez docs/style-guide.md : palette, typographie, hiérarchie spatiale, rythme des plans, langage des transitions, caméra, texture, ce qui doit être emprunté et ce qui doit être évité. Sans référence, définissez explicitement une direction visuelle originale.
2. Brief du réalisateur. Lisez direction pour le mode demandé. Écrivez docs/brief.md et docs/shotlist.md ; chaque plan a un objectif, une image de début/fin, un texte exact, un état visuel, une caméra, une transition, un signal sonore et un asset. Utilisez une seule timeline pour l'image et l'audio. Montrez un plan concis et procédez dans le cadre de la demande autorisée. Attendez seulement si l'utilisateur a demandé un plan/une étape d'approbation ; le silence ne fournit jamais cette approbation.
3. Son et rythmes. Lisez audio et exécution. Analysez la musique fournie ou synthétisez une partition ; sauvegardez beats.json et cues.json. Un détecteur de battements n'établit pas les temps forts de la mesure. Étiquetez les estimations et confirmez le premier temps fort avant de concevoir les actions au niveau de la mesure. Gardez intacte une demande de piste inchangée ; ne modifiez pas la durée ou ne normalisez pas cette source sans autorisation.
4. Images fixes et animatique. Construisez des compositions hero et échantillonnez chaque plan avant de polir le mouvement. Rendez une animatique basse résolution dans le même rapport d'aspect, avec la grille de rythme prévue. Inspectez-la pour le rythme et la lisibilité sur téléphone. Pour les longs films, maintenez une bible des personnages et des contrats de timing des chapitres avant d'implémenter les chapitres. Ne déléguez pas sans autorisation indépendante.
5. Animation. Implémentez window.seek(t) comme un mappage pur temps-image. Utilisez des pistes de ressort en forme fermée ; initialisez et réinitialisez le caractère aléatoire procédural par image, ou dérivez le bruit du temps et de l'identité de l'élément. Pas d'intégration persistante, de minuteurs, de transitions CSS ou d'échantillonnage d'horloge murale en mode rendu. La disponibilité des assets locaux appartient à window.ready. Prenez des décisions de composition réactives pour chaque rapport d'aspect ; ne recadrez pas un format large final en portrait.
6. Critique et correction. Lisez review. Inspectez les planches contact, les images consécutives autour des mouvements rapides et la lecture réelle si un outil de lecture est disponible. Corrigez jusqu'à trois défauts à plus fort impact par round et re-rendez les plages affectées. Utilisez jusqu'à trois rounds ciblés par défaut ; arrêtez-vous lorsque le brief est respecté et qu'aucun problème matériel ne subsiste, ou signalez un bloqueur concret. N'augmentez jamais vos propres scores pour fabriquer une validation. Les images fixes ne peuvent pas vérifier la lecture audio ou du mouvement.
7. Final et livraison. Rendez les résolutions demandées, mixez l'audio, créez des fiches de QA et vérifiez les métadonnées du flux, la durée, le nombre d'images et le décodage complet. Livrez out/final.mp4, l'affiche, les planches contact, la source, une commande reproductible et les limitations restantes concises. Incluez out/loop-check.mp4 uniquement pour une boucle demandée. La copie publique suit les règles d'écriture du projet et le passage final humaniseur lorsqu'il est disponible.

Chaîne d'outils de travail incluse

Lisez exécution avant de l'exécuter. Remplacez <skill> par le répertoire de ce SKILL.md et <project> par le répertoire du film choisi.

python3 <skill>/scripts/init_project.py <project>
cd <project>
npm install
npx playwright install chromium
node render.mjs --width 360 --height 640 --fps 30 --out out/animatic.mp4
python3 audio.py synth --duration 15 --bpm 120 --out out/score.wav --beats beats.json
python3 audio.py sfx --duration 15 --cues cues.json --out out/sfx.wav
node render.mjs --width 1080 --height 1920 --fps 60 --sub 4 --out out/silent.mp4
python3 finish.py mix --video out/silent.mp4 --music out/score.wav --sfx out/sfx.wav --out out/final.mp4
python3 finish.py qa --video out/final.mp4 --out out/qa --expected-duration 15 --expected-width 1080 --expected-height 1920 --expected-fps 60 --require-audio

Le starter est une animation de test abstraite complète, pas le livrable créatif. Remplacez ses scènes, son texte, sa partition et ses repères par le brief. motion.mjs fournit des ressorts corrects sous-amortis, critiques et sur-amortis, des pistes multi-cibles, une opacité de swap de texte et un bruit initialisé. render.mjs fournit le rendu par plage, le flou sub-image, le serveur HTTP local, les vérifications de préparation et les vérifications de déterminisme non séquentiel. audio.py fournit une partition déterministe, des SFX et une analyse musicale optionnelle. finish.py fournit un mixage de loudness à deux passes, des planches contact paginées pour tout le film, des fiches pour téléphone, des bandes d'action, des copies en boucle et des vérifications techniques.

Invariants de qualité

• Le contenu doit rester compréhensible sans son ; le son doit renforcer les événements de mouvement réels.
• Évitez le modèle générique titre centré/dégradé/fondu sauf si demandé. Préférez une composition concrète et une transformation visible ; "nouveau toutes les 2 à 4 secondes" est une heuristique de rythme pour les formats courts, pas une règle pour chaque film.
• Les ressorts expriment la masse ; choisissez l'amortissement pour le matériau. Ne faites pas rebondir chaque étiquette et ne remplacez pas un mouvement linéaire/périodique intentionnel par des ressorts.
• Le texte entre après qu'un conteneur commence à changer et sort avant l'arrivée d'un contenu incompatible. Gardez les glyphes nets à l'échelle finale et testez à 360 px de large.
• Le temps modulo ne rend pas une couture continue. Faites correspondre la position, la vitesse, la visibilité et le son de fin et de début ; inspectez la lecture jointe.
• Gardez le déterminisme logiciel/image séparé de la qualité esthétique. Une mauvaise image reproductible reste une mauvaise image.