huypham85/motion-video

Vidéo de motion design

Produit un spot de motion design de 10 à 30 secondes sous forme de code réel : un synthétiseur Swift écrit la partition, un moteur de rendu Swift CoreGraphics/CoreImage dessine chaque image sur la même grille rythmique (avec flou de mouvement sous-image, flou gaussien réel, verre dépoli, grain de film) et AVFoundation encode le H.264 + AAC. Tout le nécessaire est dans ce dossier de skill ; macOS + les outils en ligne de commande Xcode sont les seules dépendances.

L'exigence est celle d'un « showreel de motion designer », pas une démo : chaque élément visuel tombe sur la musique, rien à l'écran n'est un bruit décoratif, et chaque affirmation est vraie.

Plan du dossier

• engine/ — audio_core.swift + audio_main.swift (moteur de partition), video_core.swift + video_main.swift (moteur de rendu). Ne pas modifier par projet ; le code du projet va dans le dossier du projet.
• scripts/mv.sh — construction + exécution : audio, stills <beats>, video [out]. levels.py, sheet.py, probe.swift sont utilisés par ce script.
• Le projet complet se trouve dans le skill compagnon app-3d-video (template/ : score.swift, scenes.swift, project.env, ainsi que la couche SceneKit s3d.swift). Pour une vidéo 2D uniquement, copiez son project.env et score.swift et écrivez un nouveau scenes.swift en vous référant à references/engine-api.md.
• examples/scores/energetic-128bpm.swift — partition à haute énergie pour un lancement (chutes, remplissages, silence).
• references/motion-direction.md — rythme par tonalité, easing, transitions, mise en page, modèles de narration, liste de contrôle de révision. À lire avant de planifier les scènes.
• references/score-guide.md — recettes tempo/tonalité/arrangement, correspondance avec la tonalité de la marque, cibles de volume sonore. À lire avant d'écrire la partition.
• references/engine-api.md — chaque fonction de dessin/audio avec sa signature. À lire lors de l'écriture du code.

Flux de travail

1. Briefing (limiter les questions à ce qui change le résultat)

Définir : l'objectif et le public, la durée, le format (par défaut 1080×1920 vertical ; 1920×1080 ou 1080×1350 via W/H), le ton, la langue du texte à l'écran. Valeurs par défaut si l'utilisateur n'a pas de préférence : 15 s, vertical, texte en anglais, ton adapté au domaine du produit. Si le contenu demandé ne tient pas dans la durée à un rythme adapté au ton, le dire et demander ce qu'il faut sacrifier — la durée ou le contenu — plutôt que de tasser. (Une application santé voulait un rythme calme et 15 s ; la réponse a été de supprimer des scènes, pas d'accélérer.)

2. Rechercher ce qui est vrai

Tout ce qui est à l'écran doit être défendable :

• Ce qui a été livré : git log depuis les dernières versions, CHANGELOG, notes de version.
• Texte exact du produit : lire le code pour les titres/corps des notifications, les libellés des boutons, les dialogues Siri/intent, les en-têtes d'extraits, le texte d'intégration. Le citer ; ne pas le paraphraser en une promesse.
• Marquer tout ce qui est illustratif (exemples de noms, compteurs, heures) et le signaler à l'utilisateur lors de la livraison.
• Garder l'histoire cohérente en interne : si la scène 1 enregistre Metformin à 9h41, la scène 2 ne peut pas demander quand Metformin a été prise pour la dernière fois et répondre « il y a 13 heures » — utiliser un autre médicament.

3. Ressources

Collecter les ressources réelles de la marque : icône de l'application (le plus grand PNG), logo, couleurs de la marque (jetons de conception / catalogue de ressources), badges officiels que le produit utilise déjà (par exemple « Compatible avec Apple Health »), et les sons propres au produit (notifications/logos sonores WAV). Convertir les sons uniques pour le synthétiseur : afconvert -f WAVE -d LEF32@48000 -c 1 in.wav assets/nom.wav ; SVG → PNG avec sharp/resvg si le dépôt les contient, ou qlmanage -t -s 1024.

Préférer l'interface utilisateur vectorielle recréée avec un seul jeu de données (un fond d'écran, une heure d'horloge, un ensemble de noms) aux captures d'écran brutes. Les captures d'écran de sources différentes (heures, appareils, données, images différentes) côte à côte paraissent mal ; les téléspectateurs le remarquent immédiatement. Si vous utilisez des captures d'écran, capturez-les en une seule session avec xcrun simctl status_bar booted override --time 9:41 …, effacez-la ensuite, et ne capturez jamais une autre application qui serait ouverte.

4. Planifier sur la grille rythmique

Durée = mesures × 4 × 60 / BPM, donc choisir BPM et nombre de mesures ensemble (15 s = 6 mesures @ 96, 8 mesures @ 128). Écrire plan.md dans le projet : un tableau des mesures → scène → le signal sur chaque temps (apparition de mots, atterrissage de carte, apparition de coche, transition). Une idée par mesure ; les grands moments (logo, fonctionnalité clé, carte de fin) tombent sur les temps forts. Voir references/motion-direction.md pour les préréglages de tonalité et les modèles.

5. Dossier du projet

Travailler dans ~/Movies/MotionVideo/<slug>/ (persiste pour les révisions ultérieures) :

mkdir -p ~/Movies/MotionVideo/<slug> && cp ~/.claude/skills/app-3d-video/template/{project.env,score.swift} ~/Movies/MotionVideo/<slug>/

Modifier project.env (BPM, DURATION, W, H, FPS), placer les ressources de la marque dans assets/, puis réécrire score.swift et écrire scenes.swift. Réaffecter les variables de palette (INK, TEAL, MINT, GREEN, GLOW, PAPER, DARKTEXT, ORANGE, DARK_MID, LIGHT_GLOW_A/B) en haut de scenes.swift pour la marque.

6. La partition d'abord

Écrire score.swift (recettes dans references/score-guide.md), puis exécuter mv.sh <dossier> audio. Vous ne pouvez pas l'entendre — lire l'affichage des niveaux : RMS dans la plage cible pour le ton, pas d'écrêtage, contraste entre sections là où vous l'avez prévu (intro calme, montée à la chute, une baisse pour tout silence). La vidéo lit music.wav pour les éléments audio-réactifs, donc générer l'audio avant les images fixes.

7. Scènes, puis examen des images fixes — au moins deux tours

Écrire scenes.swift définissant func render(_ t: Double, frame: Int), puis :

~/.claude/skills/motion-video/scripts/mv.sh <dossier> stills 0.5,2,4.25,6,8.5,10,13,16,20,22.5

Ouvrir <dossier>/sheet.png avec l'outil Read et passer en revue la liste de contrôle dans references/motion-direction.md (chevauchements lors du dépassement des ressorts, hampes coupées, texte trop petit, fondus enchaînés sales, interface incohérente, espace mort). Choisir aussi des temps de transition, pas seulement des états stables. Corriger et refaire les prises jusqu'à ce qu'un tour soit propre. Le rendu des images fixes prend ~0,1 s/image, donc itérer librement.

8. Rendu final et vérification

mv.sh <dossier> video <dossier>/out.mp4 — environ 0,3 à 0,5 s/image avec SUB=5 flou de mouvement (15 s à 60 ips ≈ 5 à 8 min), donc l'exécuter en arrière-plan. La sonde affiche la durée et les pistes ; extraire aussi quelques images (.build/probe out.mp4 <dossier> 2,5,9,12) et les examiner.

9. Livraison

Copier vers ~/Downloads/<Produit>_<Sujet>_<durée>s[_vN].mp4, l'envoyer avec SendUserFile, et rapporter : l'histoire battement par battement (secondes), quelles ressources et chaînes de caractères sont réelles, ce qui est illustratif, que vous avez jugé l'audio uniquement par mesure, et une courte liste de contrôle pour l'utilisateur (écouter au volume, lisibilité sur un téléphone, utilisation de la marque/badge). Conserver les versions précédentes (v1/) lors des révisions.

Révisions

La plupart des retours correspondent à un paramètre : plus lent/plus calme → BPM inférieur + moins de scènes + ressorts amortis (k≈5, w≈6) + apparitions plus longues (0,9 à 1 temps) + transitions par rack-focus/iris au lieu de fouettés ; plus d'énergie → la partition énergique, ressorts avec dépassement, fouettés, flashs sur les chutes ; « je ne comprends pas la fonctionnalité X » → montrer la cause et l'effet complets sur un seul appareil (demande → réponse → résultat) avec le texte de réponse réel du produit, et le titrer avec la valeur, pas le nom de la fonctionnalité.