Skip to main content

📋 Index — 02 — Mes skills perso (standalone)

02 — Mes skills perso (standalone)

Index des skills regroupés dans ce livre. Clique sur un skill pour ouvrir sa fiche.

21 skills documentés.

Chapitre A — Motion & Animation

Skill En une phrase
motion-framer-patterns Snippets et patterns prêts à l'emploi pour la librairie Motion (anciennement Framer Motion) en React : animations…
motion-gsap-scrolltrigger Snippets et bonnes pratiques GSAP + ScrollTrigger pour animer au scroll : reveals progressifs, pinning d'éléments, scrub lié au…
motion-perf-audit Diagnostic ciblé d'une animation qui rame ou d'un scroll saccadé, avec identification de la cause (compositing, layout thrashing,…
motion-system Conçoit un motion system complet pour un projet : principes directeurs, tokens (durations/easings/distances), 6 patterns…
motion-three-r3f Guide pratique pour intégrer de la 3D web avec Three.js et React Three Fiber sans plomber la performance, en maîtrisant la boucle…
motion-tokens Génère un jeu de tokens d'animation (durées, easings, distances) versionnables en JSON + variables CSS, avec mapping prêt pour…
motion-view-transitions Implémente les View Transitions natives du navigateur (SPA ou MPA) avec shared elements, en progressive enhancement — variante…
motion-visual-regression Met en place des tests visuels Playwright (golden screenshots) pour détecter automatiquement quand une animation casse ou quand…
reduced-motion-a11y Conçoit une stratégie prefers-reduced-motion complète pour que les utilisateurs sensibles au mouvement (vertige, migraines)…
view-transitions Implémente l'API View Transitions du navigateur en progressive enhancement pour ajouter des transitions de pages fluides (fade,…

Chapitre B — Design & Direction artistique

Skill En une phrase
art-direction Transforme un brief vague ("je veux un truc moderne et chaleureux") en direction artistique web complète et actionnable :…
design-tokens Produit un système de design tokens versionnable (couleurs, typo, espacements, radius, ombres) avec dark mode intégré, livré en…

Chapitre C — Performance & Accessibilité

Skill En une phrase
a11y-wcag22-aa Audit accessibilité complet contre le standard WCAG 2.2 niveau AA, avec checklist clavier, focus, contraste, formulaires, gestes…
lighthouse-ci-budgets Configure Lighthouse CI dans ton pipeline pour qu'il bloque automatiquement les régressions performance, accessibilité ou SEO via…
nielsen-audit Audite une UI existante avec les 10 heuristiques UX de Jakob Nielsen (référence universelle depuis 1994) et produit un plan…
perf-cwv Audit complet des Core Web Vitals (LCP, INP, CLS) d'une page web avec diagnostic, plan correctif priorisé et budgets de…
ux-flows Passe d'une idée floue à un plan d'interface complet : architecture d'information, écrans, parcours utilisateurs clés, états UX…

Chapitre D — Content & Outils dev

Skill En une phrase
add-tcg Checklist 6-axes pour intégrer un nouveau Trading Card Game (Lorcana, Pokémon, One Piece, Yu-Gi-Oh, Marvel Snap…) dans l'app…
documenter-webapp Skill maison qui scanne le code source d'une webapp, génère une documentation complète (mode d'emploi utilisateur + doc…
llm-council Soumet une décision importante à un conseil de 5 IA avec des angles de pensée différents, qui débattent, se relisent anonymement,…
tiptap-generator Génère et valide automatiquement le JSON TipTap pour les articles du site éducatif d'espagnol juanmaycompania, en respectant la…