awwwards-animations
✓Compétence professionnelle en animation React pour créer des animations de niveau Awwwards/FWA à l'aide de GSAP (useGSAP), Motion (Framer Motion), Anime.js et Lenis. À utiliser lors de la création d'expériences de défilement haut de gamme, de curseurs personnalisés, de transitions de page, d'animations de texte, d'effets de parallaxe, de micro-interactions ou de toute animation devant être à 60 ips et digne d'un prix. Déclenchements sur demandes de défilement fluide, ScrollTrigger, effets magnétiques, animations de révélation, défilement horizontal, sections d'épingles, effets de décalage, useScroll, useTransform, intégration avec Three.js/WebGL, art algorithmique, art mathématique, art génératif, fractales, systèmes L, champs de flux, attracteurs étranges, géométrie sacrée, puzzles géométriques, dissections de Dudeney, tangram, pavages, tuiles de Penrose, typographie cinétique, effets de glitch, explosion de texte, texte morphing, texte circulaire, design brutaliste, animation minimaliste, néo-brutalisme ou mélange de philosophie du design. Approche réactive avec un nettoyage et des crochets appropriés.
Installation
SKILL.md
Create premium web animations at Awwwards/FWA quality level. React-first approach. 60fps non-negotiable.
| Scroll-driven animations | GSAP + ScrollTrigger + useGSAP | Industry standard, best control | | Smooth scroll | Lenis + ReactLenis | Best performance, works with ScrollTrigger | | React-native animations | Motion (Framer Motion) | Native React, useScroll/useTransform | | Simple/lightweight effects | Anime.js 4.0 | Small footprint, clean API |
| Complex timelines | GSAP | Unmatched timeline control | | SVG morphing | GSAP MorphSVG or Anime.js | Both excellent | | 3D + animation | Three.js + GSAP | GSAP controls Three.js objects | | Page transitions | AnimatePresence or GSAP | Motion for React, GSAP for complex | | Geometric shapes (vector) | SVG + GSAP/Motion | Native, animable |
Faits (prêts à citer)
Champs et commandes stables pour les citations IA/recherche.
- Commande d'installation
npx skills add https://github.com/devmartinese/awwwards-animations-skill --skill awwwards-animations- Catégorie
- </>Développement
- Vérifié
- ✓
- Première apparition
- 2026-02-11
- Mis à jour
- 2026-02-18
Réponses rapides
Qu'est-ce que awwwards-animations ?
Compétence professionnelle en animation React pour créer des animations de niveau Awwwards/FWA à l'aide de GSAP (useGSAP), Motion (Framer Motion), Anime.js et Lenis. À utiliser lors de la création d'expériences de défilement haut de gamme, de curseurs personnalisés, de transitions de page, d'animations de texte, d'effets de parallaxe, de micro-interactions ou de toute animation devant être à 60 ips et digne d'un prix. Déclenchements sur demandes de défilement fluide, ScrollTrigger, effets magnétiques, animations de révélation, défilement horizontal, sections d'épingles, effets de décalage, useScroll, useTransform, intégration avec Three.js/WebGL, art algorithmique, art mathématique, art génératif, fractales, systèmes L, champs de flux, attracteurs étranges, géométrie sacrée, puzzles géométriques, dissections de Dudeney, tangram, pavages, tuiles de Penrose, typographie cinétique, effets de glitch, explosion de texte, texte morphing, texte circulaire, design brutaliste, animation minimaliste, néo-brutalisme ou mélange de philosophie du design. Approche réactive avec un nettoyage et des crochets appropriés. Source : devmartinese/awwwards-animations-skill.
Comment installer awwwards-animations ?
Ouvrez votre terminal ou outil de ligne de commande (Terminal, iTerm, Windows Terminal, etc.) Copiez et exécutez cette commande : npx skills add https://github.com/devmartinese/awwwards-animations-skill --skill awwwards-animations Une fois installé, le skill sera automatiquement configuré dans votre environnement de programmation IA et prêt à être utilisé dans Claude Code ou Cursor
Où se trouve le dépôt source ?
https://github.com/devmartinese/awwwards-animations-skill
Détails
- Catégorie
- </>Développement
- Source
- skills.sh
- Première apparition
- 2026-02-11