Que fait ErtanLabs Motion ?
Le travail de motion design devient générique de manière prévisible : chaque choix laissé ouvert par un brief est comblé par ce qui est le plus courant, et une vidéo assemblée à partir de choix les plus courants est impossible à distinguer de milliers d'autres. Cette compétence rend les choix ouverts explicites, donne à chacun une source traçable, rend de manière déterministe, et mesure le fichier avant que quiconque ne le voie.
Règle maison : chaque choix visible a un propriétaire. Si vous ne pouvez pas indiquer d'où provient une police, une couleur, une courbe ou un son, personne ne l'a choisi.
Le parcours
| Phase | Étape | Ce qu'elle laisse derrière |
|---|---|---|
| A · Décider | A1 Sonder la machine | Résultat --doctor, backend choisi |
| A2 Décortiquer le brief | Synopsis, toile, inventaire, bande son, barrières, hypothèses étiquetées | |
| A3 Trouver le monde source | L'artefact dont la grammaire de la pièce est empruntée, dispositif narratif, beat héroïque | |
| A4 Écrire la valeur par défaut, puis la renverser | La version la plus courante et ses remplacements | |
| A5 Tenir le registre | ledger.md à côté de la composition | |
| B · Fabriquer | B1 Planifier en images | Fiche de beats avec plans prévus |
| B2 Ponderer chaque élément | Classes de poids, meneur et suiveur | |
| B3 Laisser le monde définir le type, la couleur, le son | Lignes du registre remplies à partir de la source | |
| B4 Vérifier, puis rendre | Images héroïques inspectées, puis le fichier | |
| C · Prouver | C1 Mesurer et regarder | Rapport check.py, planche contact, index des signes |
| C2 Étiqueter les affirmations et transmettre | Transfert groupé par preuves |
Modes de travail
- Sprint (pièces courtes à idée unique, ou "fais-le juste") : choisissez vous-même le monde source, écrivez un registre de cinq lignes (synopsis, monde, beat héroïque, trois valeurs par défaut remplacées, toile), puis construisez. La vérification et la mesure sont toujours effectuées.
- Studio (travail de marque, pièces plus longues, briefs flous) : rendez l'image héroïque pour deux mondes sources candidats avec
--stillset montrez les deux images côte à côte ; les gens jugent les images plus vite que les descriptions. L'utilisateur choisit ; si personne n'est disponible, gardez celle dont l'image héroïque survit au test de la vignette (C1) et notez pourquoi dans le registre. - Série (épisodes pour une chaîne ou une campagne) : lisez d'abord chaque
ledger.mdantérieur dans le projet. Un nouvel épisode ne peut pas répéter à la fois le monde source précédent et la structure de beat héroïque précédente ; les constantes de marque portent une étiquettefixedet sont exemptées. - Révision (notes sur une pièce livrée) : mappez chaque note aux lignes de la fiche de beats et écrivez le changement sous forme de diff de fiche de beats, ancienne ligne → nouvelle ligne. Exemple : "trop lent au début" →
grille 6-30 → 4-16,plan 30-60 → 16-40, chaque ligne suivante se décale de −20 images. Rendez uniquement la plage modifiée (--range) pour révision, puis la pièce entière, et ajoutez le diff au registre. - Explication narrée (essais vidéo, documentaires, histoire, argent, crime ou sujets scientifiques portés par une voix off, looks collage de papier) : la narration est l'horloge et chaque phrase devient un beat. Deux règles portent la majeure partie de la qualité : un plan se termine avec sa phrase, et chaque fait à l'écran est soit prononcé soit sourcé sur un papier. Lisez
references/paper-collage-explainer.mdet commencez à partir deassets/collage-template.html.
Niveau de production
Indépendamment du mode, chaque pièce a un niveau, écrit dans le registre :
- Graphique (par défaut) : la grammaire du monde source sur une toile plate. Idéal pour les superpositions, les tiers inférieurs, les éléments d'interface, les données ponctuelles et tout ce qu'un monteur composite.
- Film : l'artefact dans son lieu, vu à travers une caméra, éclairé par une source que le monde explique, avec des matériaux, de la vie entre les beats, trois ou quatre scènes et un son conçu avec de la musique. Idéal pour les bandes-annonces, les pages d'atterrissage et les pages d'accueil de dépôts, les films de marque, les lancements, les présentations de cartes et d'itinéraires, et chaque fois que quelqu'un demande "cinématographique", "vivant", "premium" ou "moins plat". Lisez
references/film-level.mdavant de planifier ; il ajoute une liste de scènes au-dessus de la fiche de beats et ses propres vérifications.
Phase A · Décider
A1 Sonder la machine
node scripts/render.mjs --doctor
La sortie décide du backend : Node, Playwright ou un Chrome/Edge installé, ffmpeg, ffprobe, NVENC. Signalez-le à l'utilisateur en une ligne. Si le chemin HTML est indisponible, B4 liste les alternatives ; si l'utilisateur a déjà un projet Remotion ou HyperFrames, travaillez à l'intérieur.
A2 Décortiquer le brief
- Synopsis : la phrase unique que la vidéo dit. Sans cela, la pièce se transforme en décoration ; rédigez-en un et confirmez-le.
- Toile : ratio, durée, fps, destination. Tailles et zones de sécurité :
references/formats-and-safe-zones.md. - Inventaire : séquences, captures d'écran, logos, photos, données, plaques IA. Le matériel existant façonne le concept plutôt que d'être superposé dessus.
- Bande son : voix off, musique ou rien. Avec VO ou musique, l'audio détermine le timing (
references/sound-and-sync.md). L'audio fourni par l'utilisateur est définitif : n'ajoutez ni ne supprimez jamais de pauses, ne coupez, n'étirez ou ne remettez jamais le tempo sans l'accord de l'utilisateur ; ajustez plutôt l'image. - Barrières : polices et couleurs de marque, éléments requis et interdits, date limite.
Les inconnues deviennent des hypothèses dans le registre, étiquetées assumed. Ne posez une question que lorsque la réponse changerait le monde source.
A3 Trouver le monde source
Ne choisissez pas "un style". Choisissez un artefact réel du monde du sujet et empruntez sa grammaire : un tableau des marées, un dépliant de pharmacie, un tableau de départ à palettes, un rouleau de sismographe, un dossier caviardé, un bureau de rédacteur avec des coupures de presse. Un artefact règle plusieurs décisions ensemble - la police dans laquelle il est composé, les encres et matériaux qui donnent la palette, la façon dont les choses y changent (retournement, impression, tamponnage, remplissage, traçage), sa surface - de sorte que les décisions s'accordent entre elles.
- Listez cinq artefacts que les personnes qui vivent avec le sujet manipulent ou lisent réellement.
- Préférez celui qui a le mouvement intégré : quelque chose qui se retourne, imprime, remplit, trace, tamponne ou défile tout seul.
- Empruntez des règles, pas des images. Pas une photo d'un ticket derrière le texte, mais la logique du ticket : une perforation sépare, un numéro de série compte, un tampon annule.
references/source-worlds.md décrit 31 mondes regroupés par la façon dont ils se déplacent. Considérez-le comme un calibrage ; le meilleur monde pour un travail n'est souvent pas sur la liste.
Nommez deux autres choses :
- Dispositif narratif : une phrase sur la façon dont le synopsis devient visible ("la courbe de marée trace et l'eau dans le cadre suit le stylo").
- Beat héroïque : le beat qui porte le synopsis. Il obtient le plan le plus long prévu et le plus grand changement d'état ou d'échelle dans la pièce. Après le rendu, le plan le plus long mesuré par
check.pydevrait être celui du héros ; si ce n'est pas le cas, l'emphase est au mauvais endroit. Sous une voix off, le plan se termine toujours avec sa phrase et la pause qui la suit. Si le héros a besoin de plus de temps, demandez une pause plus longue pendant que la voix est encore en cours d'écriture ou d'enregistrement ; avec une voix off terminée, faites correspondre le plan, et ne maintenez jamais l'image sur la ligne suivante.
A4 Écrire la valeur par défaut, puis la renverser
La première idée est généralement la plus courante. Rendez-la visible, puis remplacez-la :
- Écrivez la version par défaut de cette vidéo en une ligne honnête : ce qu'un modèle moyen ferait à partir de cette invite.
- Choisissez au moins trois décisions dans cette ligne (type, palette, mise en page, entrée, transition, son) et écrivez un remplacement pour chacune avec sa source : le monde source, le matériau, les données ou la bande son.
- Une valeur par défaut que vous ne pouvez pas remplacer avec une raison peut rester ; elle va dans le registre marquée
owned default.
A5 Tenir le registre
Remplissez-le avant de construire, montrez-le, et enregistrez-le comme ledger.md à côté de la composition. C'est aussi la mémoire pour l'épisode suivant.
REGISTRE · <projet> · <date>
Synopsis :
Toile : 1080×1920 · 30 fps · 8 s · Reels · zone de sécurité : verticale
Monde source :
Dispositif narratif :
Beat héroïque (images) :
Version par défaut (une ligne) :
| Couche | Décision | Source / raison | Valeur par défaut qu'elle remplace |
|-------------|---------------------------|---------------------------------|-------------------------------------|
| Type | | | |
| Palette | valeurs hex + rôle de chaque | échantillonné à partir de ... | |
| Mise en page| | | |
| Base temps | fps, classes de poids, plans | | |
| Texture | | | |
| Son | | | |
| Transitions | | | |
Droits (polices, musique, données, images) :
Hypothèses :
Phase B · Fabriquer
B1 Planifier en images
Une fiche de beats est une feuille d'exposition compacte : le mouvement écrit comme des données avant le code. Les plages sont [début, fin) en images ; les plans ont leurs propres lignes.
FICHE DE BEATS · 30 fps · 240 images (8 s) · 1080×1920
| Beat | Images | Élément | Classe | Action | Porte | Son |
|------|----------|---------------|------------|---------------------------------|-------|--------------|
| 1 | 6-30 | grille | marque | lignes tracées, décalées | entrée| stylo |
| 1 | 30-60 | - | | PLAN | | |
| 2 | 60-168 | courbe marée | élément clé | trace ; l'eau suit la pointe | lien | houle basse |
| 2 | 168-198 | - | | PLAN (héroïque) | | silence |
| 3 | 198-200 | titre | tampon | atterrit dans l'eau | atterr| un coup |
PLANS : 30-60, 168-198, 200-240 → ratio de plan prévu 42%
Porte nomme ce que le spectateur gagne : un élément entre, deux choses se lient, un état change, ou un beat atterrit sur la bande son. Une cellule Porte vide marque une décoration ; supprimez-la.
Ratio de plan est la part des images dans lesquelles rien de significatif ne bouge. Les explications et les titres se situent généralement autour de 20-35%, les montages musicaux plus bas, les pièces contemplatives plus hautes. Le grain et la dérive lente inférieure à 2 px sont de la texture, pas du mouvement. check.py mesure le ratio pour que le plan et le résultat puissent être comparés.
Avec VO ou musique, convertissez les horodatages des mots et des beats en numéros d'images et écrivez-les dans la feuille. Sous une voix off, chaque beat a également un signal, son premier mot accentué : l'élément principal du beat est en place au signal, et aucun plan ne s'étend sur la phrase suivante.
B2 Ponderer chaque élément
Donnez à chaque élément une classe de poids ; la classe choisit sa courbe et sa durée dans l'ensemble défini dans references/motion-and-timing.md, de sorte que les durées diffèrent parce que les masses diffèrent, et non par goût.
| Classe | Éléments typiques | Arrivée | Départ | Courbe |
|---|---|---|---|---|
| accessoire | points, étiquettes, petits nombres | 6-12 i | 4-8 i | settle entrée, launch sortie |
| panneau | titres, cartes, blocs de graphiques | 14-24 i | 10-16 i | heavy |
| élément clé | caméra, plans d'eau, cartes, grands champs | 30-90 i | 20-45 i | heavy ; linear pour machines |
| marque | lignes, itinéraires, soulignements, écriture manuscrite | longueur ÷ ~30 px par image | fondu | pen |
| tampon | annulations, valeurs finales, coupes | 1-2 i | - | step |
- Meneur et suiveur. À tout moment, un mouvement mène ; tout autre mouvement est causé par lui (le stylo atteint l'extrême, donc son étiquette s'ouvre).
- Ordre de dépendance. Un élément n'apparaît qu'après que ce dont il dépend est à l'écran : un axe avant ses données, un itinéraire avant son marqueur.
- Image d'affiche. L'image 0 est souvent la vignette, alors composez-la comme une image finie et lisible et laissez le mouvement en découler.
- Image pure. Chaque valeur est calculée à partir du seul numéro d'image : pas de CSS en temps réel, de minuteurs ou de hasard non ensemencé (
references/composition-contract.md).
B3 Laisser le monde définir le type, la couleur, le son
- Le type est hérité du monde source. L'emphase doit survivre au test de la vignette (C1) : un mot marqué uniquement par la teinte disparaît à petite taille en niveaux de gris, alors mettez l'accent avec la taille, le poids, le placement ou le timing. Définissez
<html lang>et utilisez la casse adaptée à la locale ;render.mjsteste les glyphes du texte réellement sur la page. Détails :references/typography.md. - Couleur : chaque couleur a un rôle nommé (fond, type, signal, une série de données). Une couleur sans rôle est supprimée. Échantillonnez les valeurs au lieu de les inventer :
python scripts/check.py --palette reference.jpg. Détails :references/color-and-texture.md. - Les déclarations sonores sont toujours soit Mesurées, soit Non vérifiées, car l'audio ne peut pas être inspecté à l'œil. Chaque entrée dans la colonne Son pointe vers une cause visible ou vers le lit sonore. Détails :
references/sound-and-sync.md.
B4 Vérifier, puis rendre
| Backend | Quand |
|---|---|
HTML + render.mjs | Par défaut chaque fois que --doctor réussit. Commencez à partir de assets/composition-template.html (ou assets/collage-template.html pour les explications narrées) ; contrat dans references/composition-contract.md. |
| Remotion / HyperFrames | L'utilisateur travaille déjà dans l'un d'eux. Même registre et fiche de beats, syntaxe différente : references/backends.md. |
| Aperçu d'artefact | Seulement si l'environnement offre un type d'artefact de mouvement ou de vidéo, et seulement comme aperçu ; un livrable est toujours un fichier rendu. |
| Plaques | Les plans que le code ne peut pas dessiner de manière convaincante (personnes, vrais lieux en mouvement) proviennent de séquences ou d'un modèle vidéo sous forme de plaques sans texte ; tout ce qui est typographique reste dans la composition. references/backends.md. |
Cartes, globes et itinéraires : lisez aussi references/maps.md (§7a pour les itinéraires de showcase).
Vérifiez le beat héroïque avant de construire le reste :
node scripts/render.mjs comp/index.html --stills 0,170,last # affiche, héroï, image de fin
node scripts/render.mjs comp/index.html --range 150-210 --scale 0.5 # beat héroïque à demi-taille
node scripts/render.mjs comp/index.html -o comp/out.mp4 # rendu complet
node scripts/render.mjs comp/index.html --alpha -o comp/overlay.mov # ProRes 4444 avec alpha
Ouvrez les images de vérification avec votre outil d'image...