Communitygithub.com

wifecooky/bio-growth-animation

Crée des animations de croissance biologique animée de type archive scientifique sur fond noir, avec matériel de phase original, déformation continue, annotations anatomiques et exportation MP4. Convient pour « une créature différente dans une animation de type hippocampe », des effets d'évolution de spécimen ou des séquences de croissance. Les métamorphoses évidentes doivent être conçues par phases topologiquement continues.

Qu'est-ce que bio-growth-animation ?

Ce skill pour agent IA permet de produire des animations de croissance biologique haut de gamme, affichées dans un style d'archive scientifique noire. Il est particulièrement utile pour les développeurs et les designers qui souhaitent transformer des séquences d'images de croissance d'un organisme en une courte vidéo narrative et fluide. Le skill gère la déformation continue des formes, l'ajout d'annotations anatomiques précises et l'exportation vidéo MP4. Il prend en charge les phases de croissance (de 2 à 8) et les métamorphoses complexes, en les divisant en segments continus. Basé sur HyperFrames, il nécessite Python 3, Node.js 22+, FFmpeg et Chrome/WebGL pour la validation et le rendu. Le skill respecte strictement les consignes de lissage : déformation progressive, interpolation de contours via champ de distance, et annotations dynamiques liées aux points de contrôle déformés. Un fichier de configuration JSON détaille chaque phase et ses points de contrôle, et le projet est généré localement sans appels API d'image.

Compatible avec~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/wifecooky/bio-growth-animation/tree/HEAD

Demander à votre IA préférée

Ouvre une nouvelle conversation avec cette compétence d'agent déjà préchargée.

Documentation

Animation de Croissance Biologique

Transformez les phases d'un organisme en une courte vidéo d'archive scientifique à croissance continue. La partie réutilisée est le système de déformation continue et d'interface. Les images, noms de phase, points de contrôle anatomiques et lignes de légende du nouvel organisme doivent être entièrement redessinés ; ne vous contentez pas de modifier le titre de l'hippocampe.

Par défaut : 10 secondes, format vertical 3:4 en 900×1200, 60 ips, fond noir, sans voix off, données conceptuelles. L'utilisateur peut fournir une durée différente, des références visuelles ou un format de livraison ; adaptez-vous à ses demandes. Le modèle HUD intégré prend en charge le format 3:4 et les résolutions proportionnelles, ainsi que 2 à 8 phases. Les autres rapports d'aspect nécessitent une modification réelle de la mise en page, sans étirement simple de l'image.

Workflow

  1. Déterminer la séquence de croissance. Utilisez l'organisme et l'orientation visuelle déjà présents dans la demande. Les phases doivent correspondre à des postures. Pour une simple augmentation de taille, une déformation continue suffit ; pour les métamorphoses avec apparition ou disparition de membres (grenouille/papillon), commencez par lire le guide des ressources et de la morphologie et segmentez par intervalles topologiquement continus. Les diagrammes conceptuels ne remplacent pas les données de développement réelles ; les phases et faits présentés dans le contenu éducatif doivent être vérifiés au préalable.

  2. Créer et vérifier les ressources. Utilisez le générateur d'images intégré disponible, fond transparent ; consultez le guide des ressources et de la morphologie pour les prompts complets et la stratégie de nettoyage du fond. Maintenez le même angle de vue, l'orientation et l'éclairage. Commencez par visualiser la sortie réelle, lisez les dimensions réelles et déterminez les limites des cellules. Les fonds gris, les rectangles flous et les débordements de cellules adjacentes doivent être traités avant l'animation. Ne supposez pas que les dimensions spécifiées dans le prompt sont automatiquement réalisées.

  3. Remplir la configuration. Lisez la documentation de configuration, copiez la structure à partir de assets/examples/seahorse.json, mais recalibrez les points de contrôle sémantiques pour le nouvel organisme. Définissez le titre, les phases, les ancres de taille, deux séries d'indicateurs, les annotations et la palette de couleurs. Les chemins des sprites sont relatifs au fichier de configuration ; tous les points de contrôle utilisent les pixels bruts de la cellule unique. Les postures clés doivent avoir une correspondance continue tête/corps/membres.

  4. Générer le projet. Avec le répertoire du skill courant comme BIO_SKILL_DIR, appelez dans le répertoire de travail :

    python3 "$BIO_SKILL_DIR/scripts/create_project.py" --config work/specimen/config.json --validate-only
    python3 "$BIO_SKILL_DIR/scripts/create_project.py" --config work/specimen/config.json --out work/specimen/project
    

    Le répertoire de sortie ne doit pas exister ou doit être vide ; le script n'écrase pas les projets existants. Il copie le GSAP local, les polices, le moteur de déformation, intègre la configuration et génère un projet HyperFrames. Le rendu des ressources existantes n'appelle pas d'API d'image. Le projet est généré en Python 3 ; la validation/exportation vidéo nécessite Node.js 22+, FFmpeg et un Chrome/WebGL disponible. La CLI HyperFrames est verrouillée sur une version validée ; la première exécution peut nécessiter le téléchargement de dépendances.

  5. Vérifiez les transitions, pas seulement les points de fin de phase. Dans le projet généré, exécutez npm run check -- --snapshots et examinez la première image visible, les images intermédiaires entre chaque paire de postures, l'image de l'organisme mature et la dernière image de maintien. Pour des captures d'écran à des moments précis, exécutez npx hyperframes snapshot --at <temps séparés par des virgules>. Revoyez la première capture pour vous assurer que l'initialisation asynchrone n'a pas laissé la première image non liée à la timeline. Assurez-vous qu'il n'y a pas de plis de grille, de fantômes oculaires, de trous dans les boucles de queue, de découpes de sprite, d'occlusion du titre ou de lignes de légende détachées du corps.

  6. Terminer l'exportation. Lorsque l'utilisateur souhaite le produit fini, exportez selon la portée autorisée, sans redemander les consignes de production déjà données :

    npm run render -- --quality delivery --output renders/growth.mp4
    ffprobe -v error -select_streams v:0 -show_entries stream=width,height,r_frame_rate,duration,nb_frames -of json renders/growth.mp4
    

    Vérifiez les images intermédiaires de la vidéo exportée. Livrez le MP4, les fichiers de configuration/projet et les prompts des ressources. Les fichiers visibles pour l'utilisateur vont dans le répertoire outputs convenu de l'espace de travail actuel ; les images temporaires, journaux et images de vérification restent dans work. Ne publiez ni ne téléchargez vers un service externe, sauf demande de l'utilisateur.

S'il existe déjà des compétences HyperFrames, utilisez leurs conventions d'exécution et CLI ; ce modèle gère la génération spécifique de l'animation de croissance, et ne recollecte pas les préférences déjà établies dans la conversation.

Implémentation garantissant la fluidité

  • Le sujet a une seule progression continue de croissance ; les points de contrôle (œil, bouche/museau, corps, membres, queue enroulée) évoluent avec la même progression. Ne reculez pas de 0,3 seconde pour changer d'image afin de simuler une croissance fluide ; augmenter simplement les ips ne corrige pas la sensation de changement d'image.
  • Un maillage triangulaire partagé déforme les textures adjacentes en une forme commune ; une interpolation Catmull-Rom contrôle la trajectoire spatiale, et l'interpolation du champ de distance resserre les contours, réduisant les doubles bords des fondues. Les changements topologiques complexes ne peuvent pas être forcés par l'ajout de points de contrôle.
  • Les lignes de légende lisent directement les points de contrôle après déformation ; les valeurs numériques formatent la progression actuelle, en conservant les décimales. Ne fixez pas un stroke-dasharray initial puis ne l'étirez pas indéfiniment.
  • Une seule timeline GSAP en pause pilote les setters de propriétés ; ne vous fiez pas aux callbacks onUpdate supprimés par seek, n'utilisez pas d'horloge réelle. Une fois le décodage des images et la construction du maillage terminés, enregistrez la timeline et appelez __hfForceTimelineRebind() si disponible.
  • L'interpolation de contour intégrée seuille l'alpha des images transparentes : pour les méduses/ailes translucides, vérifiez que les tentacules et les bords fins ne sont pas perdus, et ajustez morph.alphaThreshold en fonction du matériau réel ; il n'est pas garanti de préserver la transparence physique.

Validation rapide et exemple d'appel

Le skill contient les ressources de l'hippocampe originales et une configuration validée pour les tests de régression ; elles ne doivent pas être utilisées comme ressources pour un nouvel organisme :

python3 "$BIO_SKILL_DIR/scripts/create_project.py" --config "$BIO_SKILL_DIR/assets/examples/seahorse.json" --out work/growth-smoke

Exemple de demande : "Utiliser ce skill pour créer une animation de croissance d'une méduse, de petite à grande, 10 secondes, cyan-bleu, 60 ips."

Pour la maintenance du générateur, exécutez python3 scripts/test_create_project.py et node scripts/test_renderer.mjs ; ils n'appellent pas d'API d'image et n'effectuent pas de rendu.

Si l'utilisateur souhaite simplement modifier une vidéo existante, conservez ses ressources et sa mise en page, ajustez la configuration ou le runtime correspondant ; ne régénérez pas l'ensemble des images. Le générateur intégré permet de reconstruire à partir du config.json du projet vers un nouveau répertoire au même niveau ; validez ensuite avant de choisir le nouveau résultat.

Skills associés