Parent : [[INDEX-WEB-UIUX]]
Guide d'utilisation du Godly Corpus
Règle d'or : Quand l'utilisateur dit "fait moi un site" (ou toute variante), l'IA doit consulter ce guide et le corpus associé avant de proposer quoi que ce soit.
Procédure obligatoire
Étape 1 — Identifier le thème
Déduis le thème de la demande utilisateur. Mots-clés indicatifs :
| Demande utilisateur | Thème | Fiche à charger |
|---|---|---|
| "fait moi un site de finance / crypto / banque" | SaaS Finance | themes/saas-finance.md |
| "fait moi une app / SaaS / outil" | SaaS Product | themes/saas-product.md |
| "fait moi un portfolio / CV / site perso" | Portfolio | themes/portfolio.md |
| "fait moi un site pour mon agence / studio" | Agency | themes/agency.md |
| "fait moi une galerie / art / musée" | Gallery | themes/gallery.md |
| "fait moi un shop / e-commerce / boutique" | E-commerce | themes/ecommerce.md |
| "fait moi un blog / magazine / éditorial" | Editorial | themes/editorial.md |
| "fait moi une landing page / campagne" | Landing | themes/landing.md |
| "fait moi un dashboard / admin" | Dashboard | themes/dashboard.md |
| "fait moi un site de santé / bien-être" | Health | themes/health-wellness.md |
| "fait moi un site de musique / vidéo" | Entertainment | themes/entertainment.md |
| "fait moi un site immobilier / archi" | Real Estate | themes/real-estate.md |
| "fait moi un site tech / startup / dev" | Tech | themes/tech-devtool.md |
| "fait moi un site de mode / luxe" | Fashion | themes/fashion-luxury.md |
| "fait moi un site de resto / food" | Food | themes/food.md |
| "fait moi un site d'école / cours" | Education | themes/education.md |
| "fait moi un site d'événement" | Event | themes/event.md |
| "fait moi un site associatif" | Social | themes/social.md |
| "fait moi un site d'app mobile" | App Mobile | themes/app-mobile.md |
| "fait moi un site crypto / web3" | Crypto | themes/crypto-web3.md |
Étape 2 — Charger la fiche thème
- Lire
themes-index.mdpour confirmer le routing. - Lire la fiche
themes/{theme}.mdcorrespondante. - Extraire les patterns observés (layout, couleurs, typographie, composants, animations).
- Noter les 3-5 sites références les plus populaires listés dans la fiche.
Étape 3 — Générer le design
Applique les patterns de la fiche au projet :
- Structure : Hero + Features + Social Proof + CTA + Footer (défaut SaaS)
- Couleurs : palette dominante observée dans le thème
- Typographie : font stack du thème, échelle de tailles
- Composants : boutons, cards, navigation selon les patterns
- Animations : hover, scroll-triggered, transitions fluides
- Responsive : mobile-first, breakpoints standards
Étape 4 — Adapter au contexte
- Ne pas copier-coller un design existant
- Adapter les couleurs à la marque du client
- Adapter le contenu au secteur réel
- Respecter
ACT-ALW-005(bootstrap J0) etACT-ALW-004(quality gate)
Anti-patterns
- ❌ Ignorer le thème et proposer un générique "startup landing"
- ❌ Copier exactement un site du corpus
- ❌ Oublier le responsive
- ❌ Négliger les contrastes et l'accessibilité
Références
- Corpus : 1017 sites extraits de godly.website
- Fiches thèmes :
validated/web-uiux/themes/ - Index :
validated/web-uiux/themes-index.md