Je ne commence pas dans Claude Design
Audience · offre · objectif · messages · preuves · ton · CTA
Architecture · contenu · système visuel · règles d'interface · images à prévoir
Première interface et variantes cadrées
Décisions réutilisables pour la version suivante
Si vous utilisez déjà Claude ou ChatGPT, il ne s'agit pas d'ajouter une plateforme de plus : il s'agit d'avoir un endroit qui relie le contexte, les décisions et les productions. Le site ne part pas d'une ambiance visuelle, mais de l'audience, de l'offre, des messages, des preuves et de l'objectif de conversion.
BAM ne vous demande pas d'écrire un prompt de design. JOHANNES transforme votre stratégie et votre brief validé en prompt prêt à copier dans Claude Design.
Construisez le brief web dans BAM
Ce que vous décidez ici : qui le site doit convaincre, ce que cette personne doit comprendre, l'action qu'elle doit effectuer, les preuves qui rendent l'offre crédible, les pages nécessaires, et les contraintes éditoriales et visuelles.
Je prépare un site pour [nom de l'entreprise / offre]. Objectif du site : [par exemple obtenir des prises de rendez-vous qualifiées]. Audience prioritaire : [qui doit se reconnaître dans le site, et le problème qu'elle cherche à résoudre]. Offre et promesse : [ce que vous vendez, ce qui vous différencie, les preuves disponibles]. Pages ou écrans prioritaires : [par exemple accueil, prise de rendez-vous, cas client avant/après]. Éléments de marque à respecter : [ton, vocabulaire, couleurs, références, éléments à éviter]. Contraintes de contenu et de conversion : [langue, CTA, témoignages autorisés, réassurance]. JOHANNES, avant de proposer le brief web : reformulez ce qui est déjà décidé, identifiez ce qui manque, posez les questions qui peuvent modifier la direction, puis proposez une recommandation argumentée.
Ne copiez pas ce texte dans Claude Design. Il sert à permettre à JOHANNES de construire votre direction web à partir de votre stratégie.
Validez le système avant de dessiner
Tout ne se teste pas. Avant de dessiner, le brief distingue ce qui est non négociable de ce qui peut varier d'une direction à l'autre :
Ce que BAM vous aide à obtenir : un brief de direction web complet, un système plutôt qu'une intention visuelle :
Audience prioritaire · objectif de conversion · offre et promesse · messages, objections et preuves · CTA
Écrans à produire · ordre de lecture · hiérarchie des blocs · informations à faire apparaître
Ton · niveau de détail · vocabulaire à employer ou éviter · témoignages et preuves autorisés
Références · matières et intensité · contraste et lisibilité · usage des images · mode clair et sombre · éléments exclus
Ce qui ne change pas · ce qui peut être testé · ce qui doit être revu avant intégration
Chez PATER, ce système a été validé avant le premier écran. Et il n'a pas été écrit à la main : c'est la recommandation de BAM, construite à partir du marché et du style du compte Instagram du propriétaire :
- Un périmètre de trois écrans : accueil, prise de rendez-vous avec pré-qualification, avant/après avec avis.
- De vraies photos fournies, avec des emplacements prévus pour chacune.
- Une langue choisie (le français) et deux modes visuels : ivoire clair et sombre, avec bascule.
- Un système de matière : écaille à faible opacité, laiton en micro-accent, jamais sur les boutons d'action.
- Des zones où la matière est admise, et des zones qui restent nettes : formulaires, preuves, FAQ.
- Une règle propre au mode sombre : zéro texture, la matière passe par les photos.
- Trois directions visuelles nommées, et des exigences concrètes : slider, rythme de défilement, formats d'images.
Faites préparer le prompt par JOHANNES, puis collez-le dans Claude Design
Une fois le brief validé, vous n'écrivez pas le prompt de design vous-même : vous le demandez à JOHANNES, puis vous copiez sa sortie dans Claude Design.
À partir de la stratégie et du brief web validés pour [nom du projet / de la page], préparez un prompt prêt à copier dans Claude Design. Reprenez l'objectif, l'audience prioritaire, le problème vécu, la promesse validée, les messages obligatoires, les preuves disponibles, les CTA, les sections et leur ordre, les règles de design et de mobile, les photos disponibles, et les formulations à éviter. Distinguez clairement : ce qui ne doit pas changer, ce qui peut être exploré visuellement, et les informations manquantes à confirmer avant conception. N'inventez ni chiffres, ni résultats clients, ni témoignages, ni fonctionnalités, ni contenus non validés. Le résultat doit être un prompt unique, structuré et prêt à copier dans Claude Design.
Et plutôt qu'une trame abstraite, voici à quoi ce prompt ressemble une fois rempli, reconstitué d'après le cas PATER. Ne le recopiez pas tel quel : demandez le vôtre à JOHANNES, ou déduisez-en la forme. Chaque champ vient du brief validé :
Créez une première direction web pour PATER, lunetterie couture sur mesure à Paris. Objectif : obtenir des prises de rendez-vous à l'atelier. Audience : des personnes qui portent leurs lunettes toute la journée et veulent un ajustage durable ; objection principale : encore une belle monture qui glissera au bout de trois mois. Promesse : votre signature, au millimètre. Diagnostic visagisme, fabrication en France, retouches planifiées. Messages obligatoires : des corrections, pas des promesses ; un vrai diagnostic, pas une simple vente ; chaque gêne a une cause précise. Preuves à faire apparaître : deux cas avant/après détaillés, avis clients, méthode de diagnostic en trois repères. CTA principal : Prendre rendez-vous. CTA secondaire : Faire un diagnostic fit. Structure attendue : hero, réassurance en quatre points, problèmes de tenue et leurs causes, visagisme, la matière de près, avant/après et avis, CTA final. Direction visuelle : couture sobre, laiton en micro-accent autorisé sur les titres et cartouches, interdit sur les boutons d'action ; écaille à faible opacité ; en mode sombre, zéro texture, la matière passe par les photos. Photos : vraies photos d'atelier, galerie matière en 3:4, slider panoramique. Mobile d'abord : hiérarchie des messages, lisibilité des CTA et du formulaire de rendez-vous. Ne doit pas changer : l'objectif, l'audience, la promesse, les messages, les preuves, les CTA, les règles de matière. Peut être exploré : la composition (trois directions nommées : couture, magazine, éditoriale), le traitement des photos, le rythme des sections. N'inventez ni chiffres, ni témoignages, ni fonctionnalités. Avant de générer, résumez en cinq lignes l'objectif, l'audience, la promesse, les règles de design et ce qui ne doit pas changer.
- Inventer votre audience.
- Décider de votre promesse.
- Remplacer vos preuves.
- Choisir seul les CTA.
- Ajouter un style qui contredit vos règles.
- Traduire les décisions en interface.
- Proposer une première direction.
- Comparer des variantes cadrées.
- Produire une base à revoir.
Deux variantes cadrées du même système, chez PATER : mêmes textes, mêmes CTA, autre expression.
Revenez dans BAM pour la version suivante
Après chaque proposition, validez ce qui doit rester, ce qui évolue et ce qui est exclu, puis consignez-le dans votre projet BAM : les outils de design ne retiennent pas vos règles d'une session à l'autre. C'est la même discipline que dans L'art du bon brief : état des lieux d'abord, production ensuite.
BAM structure la stratégie et produit le brief de direction web. Claude Design le traduit en interface. Wix permet ensuite de l'intégrer, après validation.
La suite logique : construire votre première page Wix à partir d'un brief validé.