Frontend & UI
GSAP Skills
Le jeu d’animation GSAP officiel, des tweens de base à ScrollTrigger et React.
De quoi il s’agit
Le jeu de skills officiel de GreenSock pour construire de l’animation web avec GSAP. Huit modules couvrent l’API de base, les timelines, ScrollTrigger, les plugins, React, les autres frameworks, la performance et les utilitaires.
Bundles 8 modules: core / timeline / scrolltrigger / plugins / react / frameworks / performance / utils
Official GSAP animation skill set: core API, timelines, ScrollTrigger, plugins, React, other frameworks, performance and utils.
Pourquoi ça compte pour le design
- Le mouvement suit la vraie API de GSAP au lieu de laisser l’agent deviner la syntaxe.
- ScrollTrigger et timelines sont séquencés correctement, pas empilés au petit bonheur.
- Des règles de performance gardent l’animation fluide au lieu de saccader au scroll.
Ce que ça couvre
- Core API
- Timelines
- ScrollTrigger
- Plugins
- React and frameworks
- Performance and utils
Comment l’installer
GSAP Skills
-
Clonez le dépôt.
git clone https://github.com/greensock/gsap-skills -
Pointez Codex sur le fichier du skill.
skills/gsap-core/SKILL.md -
Décrivez ensuite l’interface voulue. Codex suit le skill.
Comment le faire tourner avec Codex
-
Installez le jeu de skills GSAP pour que Codex puisse charger le module pertinent.
-
Demandez le mouvement voulu ; le bon module gère l’API.
-
Piochez le module React ou frameworks à l’intérieur d’un arbre de composants.
Chaque plugin présenté ici est gratuit, open source, et renvoie à sa vraie source amont.
En savoir plus sur la liste codex-design ↗Autres plugins design pour Codex
Frontend & UI Ce qu’il fait gpt-taste Construit des pages primables avec du scroll GSAP et des grilles bento sans trous. 
Design systems Ce qu’il fait Stitch Design Taste Rédige un DESIGN.md qui oriente Google Stitch vers des écrans non génériques. 
Frontend & UI Ce qu’il fait image-to-code Génère d’abord des images de design, les analyse, puis construit le code frontend correspondant. 
Frontend & UI Ce qu’il fait imagegen-frontend-mobile Génère des parcours d’écrans d’app mobile premium en images, pas en code. Prochaine étape
Designez avec Open Design, sans la config
Installez ce plugin vous-même, ou faites tourner toute une couche design sélectionnée autour de Codex avec Open Design. Apportez votre clé, gardez la main sur ce que vous produisez.