Frontend y UI
GSAP Skills
Conjunto oficial de animación de GSAP, desde los tweens del core hasta ScrollTrigger y React.
Qué es
El conjunto de skills oficial de GreenSock para construir animación web con GSAP. Ocho módulos cubren la API del core, las timelines, ScrollTrigger, plugins, React, otros frameworks, rendimiento y utilidades.
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.
Por qué importa para el diseño
- El movimiento sigue la API real de GSAP en vez de que el agente adivine la sintaxis.
- ScrollTrigger y las timelines se secuencian como es debido, no se apilan de forma improvisada.
- Las reglas de rendimiento mantienen la animación fluida en vez de dar tirones al hacer scroll.
Qué cubre
- Core API
- Timelines
- ScrollTrigger
- Plugins
- React and frameworks
- Performance and utils
Cómo instalarlo
GSAP Skills
-
Clona el repositorio.
git clone https://github.com/greensock/gsap-skills -
Señálale a Codex el archivo de la skill.
skills/gsap-core/SKILL.md -
Luego describe la interfaz que quieres. Codex sigue la skill.
Cómo ejecutarlo con Codex
-
Instala el conjunto de skills de GSAP para que Codex pueda cargar el módulo pertinente.
-
Pide el movimiento que quieres; el módulo adecuado se encarga de la API.
-
Recurre al módulo de React o de frameworks dentro de un árbol de componentes.
Todos los plugins de esta colección son gratuitos, de código abierto y enlazan a su fuente original real.
Más en la lista codex-design ↗Más plugins de diseño para Codex
Frontend y UI Qué hace gpt-taste Crea landing pages de estilo premiado con movimiento de scroll GSAP y rejillas bento sin huecos. 
Sistemas de diseño Qué hace Stitch Design Taste Escribe un DESIGN.md que orienta a Google Stitch hacia pantallas que no son genéricas. 
Frontend y UI Qué hace image-to-code Primero genera imágenes de diseño, las analiza y luego construye el código frontend correspondiente. 
Frontend y UI Qué hace imagegen-frontend-mobile Genera flujos de pantallas de apps móviles premium como imágenes, no como código. Siguiente paso
Diseña con Open Design, sin montar nada
Instálalo tú mismo, o ejecuta toda una capa de diseño curada alrededor de Codex con Open Design. Trae tu propia key: lo que produzcas es tuyo.