Que fait filmsmith ?
Dix façons de filmer votre code. Réalise un court-métrage technique — une démonstration technologique, un rapport technique ou un explicatif, un lancement de produit technique — à partir d'un brief, sa durée étant calculée en fonction du contenu, sans personne à l'écran : choisissez un mode, copiez son modèle, remplissez content.js, rendez. Chaque image est dessinée en code et chaque son est synthétisé en code (une piste musicale générée peut remplacer la trame sonore), donc un film n'a besoin que d'un agent de codage capable d'exécuter des commandes shell. La compétence repose sur une théorie du goût (fondements), dix principes fondamentaux qui en découlent et des verdicts du propriétaire, un système partagé de couleurs, de typographie, d'espace et de mouvement, et dix modes qui les appliquent chacun à un langage visuel.
Le style commun à chaque mode : vif, direct et épuré — quelque chose change environ à chaque temps fort, chaque changement apporte une nouvelle chose, et le spectateur n'attend jamais le film — et épuré n'est pas pauvre : peu d'éléments, chacun bougeant assez fluidement pour retenir l'œil (principes 4–6).
Prérequis
- N'importe quel agent de codage pouvant exécuter des commandes shell.
SKILL_ROOTci-dessous est le dossier qui contient ceSKILL.md. - Node 22 ou plus récent,
ffmpegetffprobedans le PATH.new-filmles vérifie et s'arrête avec un message si l'un manque. - Réseau pendant la configuration et le rendu d'un film : polices depuis un commit google/fonts figé et la version figée de GSAP depuis le registre npm (tous deux stockés dans le dossier du film), la première exécution de
npx [email protected](qui télécharge également son Chrome sans tête), et au moment du rendu, le compilateur HyperFrames peut également récupérer des polices depuis Google Fonts. Le rendu hors ligne n'est pas vérifié. Conservez la version d'hyperframes que les modèles fixent ; ne la mettez pas à jour à l'intérieur d'un film. - Le texte à l'écran est en anglais dans cette version ; lorsque l'utilisateur demande du chinois ou une autre écriture, dites que les modèles ne le prennent pas encore en charge.
Modes
| Mode | 中文 | Apparence | Variante de forme | Choisissez-le pour |
|---|---|---|---|---|
| thread | 一线 | Un trait qui devient tout, sans coupure | thread: ligne régulière ou gonflée | Showreels d'une chaîne de rendu vidéo, motion ou rendu |
| ink | 落墨 | Typographie lourde frappée à chaque temps, une goutte d'encre qui fleurit en couleur | typeWidth: typographie compressée ou étendue | Révélations de nom, stings de lancement, revendications en une ligne |
| plakat | 招贴 | Affiches internationales animées, une couleur de signal | form: champs carrés ou diagonaux | Une affirmation plus des étapes et la personne qui décide |
| blueprint | 蓝图 | Un dessin technique dessiné feuille par feuille, tampons ambre | linework: encre ou crayon | Systèmes et workflows avec pièces et validations |
| phosphor | 荧屏 | Terminal de nuit, un accent phosphore, HUD de lancement | screen: tramage CRT ou plat | CLI et outils de développement |
| tally | 算筹 | Un carré par élément, regroupement graphique après graphique | mark: carré, point ou glyphe Isotype | Comptages, parts, histoires de jeux de données |
| trace | 演算 | Diagramme en direct sombre de l'état d'un algorithme | stroke: vecteur ou esquisse | Fonctionnement d'un mécanisme ou d'un algorithme |
| morph | 一笔 | Une forme d'encre grimpant point → ligne → plan → solide → interface → marque, sans coupure | corners: arrondi ou coupé | Outils de développement et produits d'interface : une source devient chaque surface |
| halftone | 网点 | Impression deux encres : un morceau de la marque reste immobile tandis que chaque monde est imprimé autour de lui, puis recule vers la marque entière | dot: écran rond, carré ou lignes | Lancements de modèles et de produits : quelques fonctionnalités, un nombre, le nom |
| pulse | 节拍 | Une question jouée comme une requête : un mot par temps, les fonds basculant le long d'une teinte, un voile blanc pour la réponse | aperture: coupé ou rond | Réponses de version et benchmarks : une conclusion mesurée |
Chaque mode possède des préréglages de couleurs (sur sa fiche) et une variante de forme, tous deux définis dans content.js ; le rendu par défaut est identique aux précédents. Chaque fiche répertorie ses cas d'utilisation avec un exemple concret et marque la meilleure adéquation. Les noms antérieurs au 2026-10-19 (thread-reel, ink-beat, swiss-poster, blueprint-drafting, terminal-launch, unit-data, diagram-explainer) fonctionnent toujours dans new-film.
Règles de choix et format de la fiche du mode : references/modes/README.md. Les modes ne se mélangent pas. Thèmes (squelettes narratifs et règles par type de film) : tech-product-launch pour thread, ink, plakat, blueprint, phosphor, morph, halftone et pulse, tech-explainer pour tally et trace.
Workflow
1. Clarifier
Ignorez ce que l'utilisateur a déjà fourni ; demandez le reste, d'abord le mode. Demandez dans une conversation simple, au maximum trois questions à la fois ; lorsqu'une lacune ne bloque pas le démarrage, supposez et dites-le. Chaque film est en 16:9, 1920×1080, pour une lecture plein écran paysage ; lorsqu'on vous demande un film vertical ou carré, dites que la compétence n'en réalise pas.
| # | Question | Pourquoi |
|---|---|---|
| 1 | Quel est le contenu : un outil, une affirmation avec des étapes, un système, un nom, un showreel, des chiffres, un mécanisme ? | Décide du mode (tableau de sélection) ; proposez-en un et dites pourquoi |
| 2 | D'où viennent les faits (dépôt, document, jeu de données, algorithme) ? | Chaque fait à l'écran en provient ; chaque nombre est calculé |
| 3 | Plateforme, et une durée cible éventuelle ? | La durée est calculée à partir du contenu (principe 5) ; une cible déplace le tempo dans la plage du mode, puis des scènes sont coupées ou ajoutées |
| 4 | Quel préréglage de palette ? | Préréglages uniquement, listés sur la fiche du mode ; pas de valeurs hexadécimales personnalisées |
| 5 | Contraintes strictes (doit apparaître, ne doit pas apparaître, URL, nom) ? | Évitez de refaire |
| 6 | Musique : cet agent peut-il appeler une API de génération musicale ? | Si oui, un fond généré au tempo du film remplace celui synthétisé (système) ; sinon, le fond synthétisé est utilisé et la passation le mentionne |
Terminé lorsque le mode, la source et le préréglage sont nommés, la source musicale est connue, et la durée cible si elle existe.
2. Structure
node <SKILL_ROOT>/scripts/new-film.mjs <mode> <film-dir> --palette <id>
Ceci vérifie Node et FFmpeg, copie le modèle, ajoute le runtime partagé comme lib/ (estampillé avec lib/VERSION), écrit le squelette PLAN.md, télécharge les polices listées dans le fonts.json du modèle depuis un commit google/fonts figé et la version figée de GSAP dans lib/vendor/ ; il s'arrête si l'un échoue, donc un film ne s'affiche jamais dans une police de secours ou ne dépend pas d'un CDN. Un modèle qui nécessite les axes d'une police variable les déclare dans fonts.json (plages weight et stretch, voir CONTRACT.md). Lisez ensuite la fiche du mode et le TEMPLATE.md du dossier en entier : le registre des scènes, la limite de caractères de chaque emplacement et la chorégraphie fixe y résident. Terminé lorsque vous pouvez nommer chaque type de scène proposé par le mode.
3. Concept et plan des temps forts
new-film a écrit un squelette PLAN.md dans le dossier du film. Remplissez-le avant de toucher à content.js ; un film sans plan n'est pas rendu (principe 10) :
- Phrase de concept, sous la forme "Dans ce film, [quelque chose que seul ce produit a] devient [le dispositif signature du mode]", et le test du rival : avec le concurrent le plus proche dans la phrase, elle ne doit plus tenir. Ensuite, le fil conducteur (l'objet ou le cadre qui porte l'œil de la première à la dernière image).
- Liste d'interdits : partez des réglages d'usine du mode et de ai-tells.md ; ajoutez tout ce qui est trop proche du film de référence le plus proche.
- Tableau de la référence la plus proche et des motifs : nommez le film de référence le plus proche et listez les motifs que le film partage avec lui ; dans un mode avec une référence connue, plus de la moitié partagée échoue P1.
- Plan des temps forts : une ligne par scène — type de scène, texte à l'écran et ce qui est texte principal ou texte de coup d'œil, la source du fait, ce que cette scène devient dans la suivante, et où la musique s'arrête pour la lecture ou chute pour le moment clé. Les durées ne sont pas choisies : écrivez les scènes dans
content.jset exécuteznpm run fit, qui imprime le début de chaque scène, les temps forts, le besoin de lecture, le coussin avant un virage et sa part dans l'arrondi de la phrase, et la durée du film, écritrenders/timing.json, et copie le tableau dansPLAN.mdentre ses marqueursfit.npm run fits'arrête tant quePLAN.mdest manquant et prévient tant qu'il contient encore des parties<!-- fill -->non remplies.
Avant d'écrire le texte, lisez le tableau des durées dans le TEMPLATE.md du mode : il indique quels emplacements de chaque scène comptent comme texte principal et comment ils entrent, afin que chaque état puisse être budgétisé plutôt que découvert. Terminé lorsque chaque type de scène est dans le registre, chaque chaîne tient dans sa limite de caractères, chaque nombre nomme le code qui le calcule, et npm run fit ne signale aucune erreur. Les limites de caractères ne sont qu'un premier filtre : la largeur d'un emplacement peut dépendre de ses voisins, donc la vérification des pixels est la bannière rouge à l'étape 4. Sur un modèle dont les règles déclarent l'API de timing 3, une erreur signifie que le film enfreint l'un des quatre niveaux de changement (principe 5) : plus de cinq mots de texte principal entrant à la fois (huit pour une affirmation, lus dans une pause marquée), un maintien après un atterrissage de plus de deux temps forts, une composition de plus de 6 s, un trou de plus de quatre temps forts sans changement, ou le mauvais nombre ou placement des transitions expressives et des pics. Divisez d'abord les longues lignes en phrases qui entrent une par une, puis transformez les étiquettes répétées en texte de coup d'œil, puis divisez la scène ; ne réduisez jamais la taille de la police ni n'accélérez en dessous du seuil de lecture. Sous le tableau de timing, npm run fit imprime les mesures de niveau ; un modèle toujours sur l'API 2 conserve ses limites de page (douze mots primaires, un maintien d'étape d'une mesure et le dernier d'une mesure et demie, une page de quatre mesures) et affiche les niveaux comme une note INFO.
4. Remplir et cadrer d'abord
Modifiez content.js (et data/ ou run.js là où le mode les utilise) ; ne tapez jamais duration ou bars de scène pour atteindre une durée. Ensuite, rendez les images clés et regardez-les avant d'animer (le script exécute d'abord fit, donc les images clés utilisent la durée actuelle) :
npm run snapshot -- --at <t1>,<t2>,<t3>
Une bannière rouge sur une image clé nomme un emplacement dont le texte est plus large que sa boîte : raccourcissez ce texte. Corrigez toute image clé qui échoue à un principe fondamental ou à un principe de mode : texte informatif en dessous de 25 px, texte illisible, plus de trois niveaux typographiques, deux protagonistes, un second accent, du contenu rogné ou débordant, tout ce qui provient de ai-tells.md. Terminé lorsque chaque image clé passe les vérifications P0 de la fiche du mode.
5. Rendu
npm run film # fit → audio → check → render, écrit renders/film.mp4
npm run check doit signaler 0 erreurs. Ses avertissements sont jugés par rapport à la liste de vérification : un avertissement de contraste n'est acceptable que sur du texte qui est encore en train d'entrer (typage, fondu entrant) et est lu une fois atterri ; tout autre avertissement est corrigé ou listé sous Problèmes connus. Le son suit content.js sur la même grille de temps forts ; pour utiliser de la musique générée à la place, rendez-la au tempo et à la durée ajustés du film (renders/timing.json), sauvegardez-la sous assets/audio/, et définissez content.bed = { file, offset } (voir le TEMPLATE.md du mode).
6. Mesurer et revoir
node <SKILL_ROOT>/scripts/check-film.mjs renders/film.mp4 --film-dir .
sh <SKILL_ROOT>/scripts/contact-sheet.sh renders/film.mp4 renders/contact-sheet.jpg 20
check-film lit renders/timing.json et mesure le rendu par rapport à celui-ci : format et durée, volume sonore avec sauts à court terme et momentanés, images noires, flashs par zone, événements clés sur le temps fort (à moins de 2 images) avec un événement image et un début sonore (≥ 3 dB à moins d'1 image), étirements d'images fixes par scène dans le masque de contenu par rapport à un plancher de bruit sensible au grain, le rythme (pas de longue séquence de temps forts quasi immobiles, pas plus de la moitié du film quasi immobile), stabilisation des maintiens, transitions, séquences de scènes de même durée, et les quatre niveaux de changement sur les événements déclarés (écarts T0, durées de composition T1, transitions expressives T2, pics T3, durées de maintien), qui échouent UNIQUEMENT pour les modèles sur l'API de timing 3 ; les débuts d'image, les changements de grande zone et le moment le plus fort sont des estimations de pixels ou de signal à côté de ceux-ci. Le texte le plus petit, le contraste du texte, les niveaux typographiques, la zone d'accent, l'équilibre des octaves, la répétition de quatre mesures et la limitation sont des estimations de pixels ou de signal, signalées comme INFO. Un élément qui n'a rien à mesurer signale N/A, pas RÉUSSI ; --json donne chaque résultat avec l'élément de la liste de vérification qu'il sert.
Puis parcourez references/checklist.md et les vérifications de la fiche du mode : P0 depuis le bas de la pyramide vers le haut, puis jugez du haut vers le bas (adéquation, fraîcheur, texture). Mesurez avant de changer quoi que ce soit ; corrigez la cause, puis mesurez à nouveau. Terminé lorsque chaque P0 réussit et que chaque échec P1/P2 est corrigé ou écrit sous "Problèmes connus" dans le README du film.
7. Remise
Donnez le chemin du MP4, la planche contact, et un README avec le plan, le mode et le préréglage, la source musicale (synthétisée ou générée), les commandes, le rapport check-film et les problèmes connus ; dites "pas encore confirmé à l'oreille" sauf si quelqu'un a écouté. Demandez le verdict de l'utilisateur et citez-le textuellement avec la date ; lorsque l'utilisateur n'est pas disponible, écrivez "verdict en attente" et arrêtez.
Mainteneurs : du verdict à la règle
Uniquement pour celui ou celle qui maintient la source de cette compétence ; le créateur d'un film s'arrête à l'étape 7. Un verdict ne modifie pas directement une fiche de mode ou les principes. Placez-le d'abord sur un niveau de la pyramide et vérifiez-le par rapport à foundations.md : aux niveaux 1–2, la norme décide, aux 3–4, le consensus du domaine sauf si un écart est écrit avec sa raison, aux 5–6, le propriétaire choisit entre les candidats que la théorie juge également bons. Une tendance devient une règle après deux verdicts cohérents...