Suite de Conception UI Premium & Esthétique
Un cadre de conception dédié à la création d'interfaces web sur mesure, distinctives et accessibles, tout en éliminant les clichés génériques générés par l'IA.
Lors du stylisme, de la conception ou de l'audit de composants UI, localisez le sujet correspondant dans references/<category>/<topic>/SKILL.md.
Catalogue & Navigation Rapide
1. Anti-AI Slop & Savoir-faire Visuel (references/anti-slop-and-craft/)
| Sujet | Sous-chemin | Description |
|---|
| no-ai-design-slop | anti-slop-and-craft/no-ai-design-slop | Barrière de qualité passive empêchant les défauts par défaut de l'IA : dégradés violets, cartes flottantes centrées et mises en page standardisées. |
| audit-ai-design-slop | anti-slop-and-craft/audit-ai-design-slop | Audit diagnostique identifiant les défauts visuels de l'IA, les éléments incohérents et les plans de nettoyage priorisant la suppression. |
| build-awwwards-quality-sites | anti-slop-and-craft/build-awwwards-quality-sites | Savoir-faire de niveau Awwwards : direction artistique forte, typographie éditoriale, animation GSAP et imagerie authentique. |
| ui-ux-pro-max | anti-slop-and-craft/ui-ux-pro-max | Guide professionnel de conception frontend : échelle typographique, espace blanc intentionnel et micro-interactions. |
| design-first-ui-prompting | anti-slop-and-craft/design-first-ui-prompting | Invitation à la conception esthétique et interactive basée sur des spécifications avant d'écrire le code frontend. |
2. Styles, Jetons & Marques (references/styling-and-tokens/)
| Sujet | Sous-chemin | Description |
|---|
| brand-guidelines | styling-and-tokens/brand-guidelines | Application des règles typographiques, voix et ton, utilisation du logo, conformité des couleurs et normes d'espacement. |
| theme-factory | styling-and-tokens/theme-factory | Générateur de thèmes visuels organisés, jetons de design, associations de polices et variables CSS. |
| tailwindcss | styling-and-tokens/tailwindcss | Recettes de composants Tailwind CSS, grilles de mise en page, utilitaires typographiques et motifs responsifs. |
| unsplash-asset-images | styling-and-tokens/unsplash-asset-images | Recherche d'actifs photographiques authentiques de haute qualité, portraits et arrière-plans. |
3. Surfaces & Archétypes de Pages (references/surfaces-and-pages/)
| Sujet | Sous-chemin | Description |
|---|
| glass-dark-ui | surfaces-and-pages/glass-dark-ui | Panneaux sombres en verre dépoli (glassmorphisme), bordures dégradées avec pseudo-éléments et contraste lisible. |
| skeuomorphic-ui | surfaces-and-pages/skeuomorphic-ui | Stylisme physique tactile : dégradés en couches, ombres intérieures/extérieures empilées et détails en relief. |
| framed-grid-layout | surfaces-and-pages/framed-grid-layout | Limites de grille précises au pixel près, supports d'angle en L et sections éditoriales structurées. |
| landing-page | surfaces-and-pages/landing-page | Structure de page d'atterrissage SaaS à offre unique à fort taux de conversion, arc narratif et rédaction. |
| pricing-page | surfaces-and-pages/pricing-page | Tableaux de prix à fort taux de conversion, matrices de comparaison de plans, listes de fonctionnalités et FAQ. |