Motion Effect Picker

Sélecteur d'Effets de Mouvement

Source : tools/repos/awesome-ai-motion (MIT ; GSAP inclus sous sa licence gratuite, voir son ATTRIBUTIONS.md). 637 cartes d'effets, 128 d'entre elles avec un clip rendu et un modèle HTML, 11 recettes, tables de décision. Ne lisez jamais l'index en entier ; interrogez-le.

Étapes

1. Énoncez l'intention de la scène et le média en une phrase (« la question qui ouvre la vidéo, shorts »).
2. Interrogez :

python -S studio.py motion find reveal --purpose attention --medium shorts --rendered --limit 8
python -S studio.py motion show mask-reveal
python -S studio.py motion recipe            # liste des recettes
python -S studio.py motion recipe edu-hook   # étapes avec durée et paramètres

Finalités : attention, explication, comparaison, séquence, emphase, transition, données, feedback, atmosphère, marque. Médias : explicateur, shorts, scrolldeck, présentation, démo-produit, histoire-de-données, web-ui. Utilisez aussi --family, --level. 3. Choisissez 2 ou 3 candidats, lisez pour chaque carte use_when, avoid, params, ease, pairs_with. Prenez d'abord les valeurs par défaut de la carte, puis ajustez. 4. Composez avec les règles partagées : un focus par scène, une action principale plus une ou deux secondaires, l'état final maintenu suffisamment longtemps pour être lu, uniquement transform et opacity. 5. Implémentez comme une fonction pure du temps. Le snippet de la carte est en GSAP ; traduisez-le, ne l'importez pas :

• secondes en progression : p = clamp((t - start) / duration) ; stagger = start + i * gap
• easing depuis templates/motion-helpers.js (easeOut, easeIn, easeInOut, backOut, elasticOut, spring) : power3.out devient easeOut(3)
• yPercent: 110 -> 0 devient translateY(110% -> 0%) sur la ligne à l'intérieur d'une fenêtre overflow: hidden

6. Construisez avec motion-ui-polish (jetons et porte), visualisez les images au début, à l'action principale et à l'état final, comparez avec le good_example de la carte.

Lorsqu'un modèle existe

Si show affiche html_template, ouvrez-le pour voir la structure et le minutage, copiez-le dans source/ du projet, et remplacez le texte ou les données. Conservez la timeline. N'exécutez pas le render.mjs du catalogue sans installer sa dépendance Playwright ; notre pipeline rend via vstudio ou le rendu HTML.

Cinq premières secondes (vidéos éducatives et explicatives)

0 à 1 s : une question ou un résultat surprenant ; 1 à 3 s : un indice sur le mécanisme ou une comparaison ; 3 à 5 s : la promesse d'apprentissage avec une pause lisible. Un seul message par écran. Grands mouvements de caméra uniquement pour révéler la question ou le résultat. Commencez par motion recipe edu-hook, puis mask-reveal, split-compare, count-up, annotation-callout.

Limites

• Les noms de paramètres des cartes sont partiellement en coréen ; les valeurs, les plages, ease et snippet sont neutres linguistiquement. Les descriptions et les prompts reviennent en anglais.
• Une carte planned n'a pas de clip ou de modèle ; utilisez uniquement ses paramètres et son prompt.
• Les effets trop utilisés semblent génériques. Ne répétez pas un effet sur plus d'un élément par scène, et n'empilez pas trois effets au même moment.