de hyperframes13,943
Modèles et contrats pour l'auteur d'animations CSS keyframe que HyperFrames peut rechercher et restituer de manière déterministe lors de l'aperçu et de l'exportation vidéo.
Fournit des modèles pratiques et des conseils d'adaptation pour l'utilisation d'animations CSS keyframe avec le runtime HyperFrames. Il explique le contrat requis pour un mouvement CSS recherchable (data-start/data-duration), recommande des durées finies et des modes de remplissage, et présente des modèles de base et échelonnés avec des exemples de code afin que les agents puissent générer du HTML/CSS restituable que HyperFrames contrôlera de manière déterministe.
Utilisez cette compétence lorsqu'un mouvement appartient à un seul élément ou à une couche décorative (miroitements, lueurs, masques, entrées simples) et que vous souhaitez une solution légère, uniquement en CSS, au lieu d'une chronologie JS complète. Privilégiez-la pour les motifs répétés avec des nombres d'itérations connus ou les mouvements d'arrière-plan non liés aux événements utilisateur. Évitez-la lorsque la chorégraphie nécessite de nombreux éléments ou des déclencheurs interactifs.
npx hyperframes lint, npx hyperframes validate).Idéal pour les agents orientés code capables de rédiger des extraits HTML/CSS et d'exécuter une validation simple (agents Copilot/Code, Cursor, Gemini Code). Les agents qui produisent des modèles HTML pour les pipelines de rendu en bénéficieront le plus.
Cette compétence n'a pas encore été examinée par notre pipeline d'audit automatisé.
