GratuitVidéo
Fenêtre d'application et zoom
- 365365 téléchargements
- 125125 mentions J'aime
- 188188 sauvegardes
Compatible avec
+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
Sélection PalateKit
Construire une animation d'interface juste v1.0.0
Utilisez cette ressource pour ajouter une animation ou une transition à un composant d'interface
Nouveau
- 387 téléchargements
- 250 mentions J'aime
- 219 sauvegardes
4,49 €
Accès à vie à cette ressource, avec ses mises à jour.
Installer avec la CLI
Dans un terminal, depuis le dossier voulu :
npx --yes palatekit@latest install animation-build-sequenceSans option, la skill va dans ~/.agents/skills/ ; ajoutez --agent claude-code (ou codex, cursor…) pour viser un agent.
Première fois : connectez la CLI avec
npx --yes palatekit@latest loginL'agent décide d'abord si l'élément doit s'animer, en fonction de la fréquence d'usage et du but. Il choisit ensuite l'outil le plus simple, les propriétés, la courbe et la durée à partir de valeurs fixes, puis prévoit l'interruption, la sortie et le mouvement réduit. Vous obtenez le code d'une animation qui ne gêne pas l'usage, avec un court rapport des choix.
Mise à jour le 2 novembre 2026
Aperçus
Caractéristiques
- Fonctionne dans
- Guides d'installation
- Génère avec
- Le modèle de votre agent
- Licence
- MIT
Ressources similaires
Tout voir- Gratuit
GratuitVidéo
Un seul grand chiffre
- 463463 téléchargements
- 223223 mentions J'aime
- 100100 sauvegardes
Compatible avec+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
PROVidéo
PalateKit Motion, la bibliothèque
- 338338 téléchargements
- 198198 mentions J'aime
- 249249 sauvegardes
Compatible avec+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
PROVidéo
Trois barres face à face
- 348348 téléchargements
- 133133 mentions J'aime
- 182182 sauvegardes
Compatible avec+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
PROVidéo
Avant / après au curseur
- 322322 téléchargements
- 248248 mentions J'aime
- 238238 sauvegardes
Compatible avec+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
PROVidéo
Carrousel de trois cartes
- 418418 téléchargements
- 157157 mentions J'aime
- 101101 sauvegardes
Compatible avec+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
PROVidéo
Échange en bulles
- 564564 téléchargements
- 127127 mentions J'aime
- 161161 sauvegardes
Compatible avec+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
PROVidéo
Liste qui se coche
- 442442 téléchargements
- 233233 mentions J'aime
- 160160 sauvegardes
Compatible avec+ HyperFrames- Claude Code
- Codex
- Cursor
- et 3 autres
Ce que vous obtenez
- SKILL.md, traduit en français : la séquence de décision, les courbes, les durées et la liste « ne jamais livrer »
- RECIPES.md : recettes prêtes à construire (bouton, menu, infobulle, modal, tiroir, toast, accordéon, etc.)
- Un contrôle de mouvement réduit et de survol livré avec chaque animation
Pour qui
- Animer l'ouverture d'un modal, d'un tiroir ou d'un menu
- Rendre un bouton ou un toast plus vivant sans le ralentir
- Reprendre une animation qui paraît lente ou brouillonne
Pas pour qui
- Une vidéo de motion design ou une animation décorative longue
- Auditer toutes les animations d'un projet existant
- Une application mobile native
Étiquettes
- animation
- css
- transitions
- interface
- motion
À propos
Vous dites
« Anime l'ouverture de ce menu déroulant pour qu'il paraisse rapide, sans utiliser de bibliothèque. »
Skill publiée par emilkowalski sous licence MIT, traduite par PalateKit.
Voir plusVoir moins
Prérequis
- À préparer
- Le composant ou la page à animer et Le contexte d'usage (fréquence, appareil)
Comment l'utiliser
- Placez le dossier de la skill dans le dossier de skills de votre agent.
- Décrivez l'élément à animer et la fréquence à laquelle on l'utilise.
- Relisez le code et testez le ressenti à vitesse ralentie.
Aperçu du contenu
Fichiers
- LICENSE1,1 Ko
- NOTICE-PALATEKIT.md0,4 Ko
- RECIPES.md8,1 Ko
- SKILL.md13,4 Ko
Origine et licence
Modifié par PalateKit
- Auteur
- emilkowalski
- Source
- github.com/emilkowalski/skills/tree/a81dbca07f2217b7103e510c0f13f8d5b017afc9/skills/animate
- Licence
- MIT
Notice
Version modifiée de « animate » (emilkowalski, MIT) : traduction française et fiche par PalateKit.
Avis des utilisateurs
–
Aucune note pour l'instant
Chargement des avis…
Questions fréquentes
Pourquoi l'agent répond-il d'abord une seule phrase ?
La skill prévoit cette réponse d'accueil quand elle est invoquée sans question. Posez ensuite votre demande normalement.
La skill mentionne d'autres skills (review-animations, pick-ui-library). Faut-il les installer ?
Non. Ce sont de simples renvois. La construction fonctionne avec les seuls fichiers de ce dossier.