brand-guidelines.md : Le fichier unique que chaque outil d'IA doit connaître pour comprendre votre marque

Vous avez payé cher pour des directives de marque. Elles se trouvent dans un PDF de 47 pages quelque part dans Google Drive — celui que votre agence de design a livré il y a 18 mois. Vos développeurs ne l'ont jamais ouvert. Vos outils d'IA ne peuvent pas l'ouvrir. Et chaque fois que quelqu'un crée une page de destination dans Cursor, rédige un e-mail marketing avec Claude, ou échafaude un composant dans v0, il repart de zéro : "Quelle est notre couleur principale déjà ? Est-ce Inter ou Plus Jakarta Sans ? Utilisons-nous des coins arrondis ou pointus ?"

Cette boucle – expliquer la marque, espérer que ça tienne, corriger ce qui ne va pas – coûte des heures chaque semaine. Au sein d'une équipe, cela représente des milliers par mois rien qu'en retouches.

Le format Stitch design-md de Google élimine cette boucle. Et Branding5 génère automatiquement votre brand-guidelines.md complet — téléchargez-le en un clic, déposez-le dans votre dépôt, et chaque outil d'IA que votre équipe utilise connaît instantanément votre marque.

Qu'est-ce que design-md ? (Et pourquoi les gens l'appellent-ils DESIGN.md ?)

Design-md est une spécification en texte brut, basée sur Markdown, pour les directives de marque et de design. Au lieu d'un PDF que seuls les humains peuvent (théoriquement) lire, c'est un fichier .md structuré que les personnes et les systèmes d'IA peuvent analyser, comprendre et utiliser pour construire.

Google a créé ce format dans le cadre de Stich — leur plateforme de génération d'interface utilisateur basée sur l'IA — avec une prémisse simple : si vous donnez à une IA une description bien structurée de votre système de marque, elle peut générer des interfaces utilisateur, rédiger du texte et prendre des décisions de design qui sont déjà conformes à la marque. Fini de vous répéter à chaque session.

Deux noms, une idée

Les fichiers écrits dans ce format portent deux noms :

• DESIGN.md — l'abréviation dans les communautés de développeurs. Il se trouve à côté de README.md et CONTRIBUTING.md à la racine du projet, et Cursor, Windsurf, et d'autres outils de codage AI le recherchent automatiquement.
• brand-guidelines.md — le nom utilisé par Branding5, car le fichier contient bien plus que des spécifications visuelles. Il capture votre positionnement, vos archétypes, vos ICP, votre voix et votre stratégie — le système de marque complet, pas seulement les couleurs et les polices.

L'un ou l'autre nom fonctionne. Le format et la puissance sont les mêmes.

Ce qui se trouve à l'intérieur d'un brand-guidelines.md

Un fichier complet couvre chaque couche de votre marque, de la stratégie aux spécifications au pixel près. Voici à quoi ressemble un brand-guidelines.md généré par Branding5 en pratique :

# Acme Analytics

## Brand Foundation

- **Positioning:** The only analytics platform built for non-technical marketing teams
  who need enterprise-grade insights without the learning curve.
- **Archetype:** The Sage — wise, trustworthy, data-driven
- **Mission:** Make data literacy accessible to every marketer.
- **Values:** Clarity over complexity. Accuracy over speed. Empowerment over dependency.

## Ideal Customer Profiles

### ICP 1: Growth Marketing Manager

- 28–38, mid-market SaaS (50–500 employees)
- Frustrated by complex BI tools; needs dashboards they can build alone
- Language patterns: "actionable insights", "self-serve", "time-to-value"
- Key objection: "Will this replace our existing BI stack?"

### ICP 2: VP of Marketing

- 35–50, reports to CMO or CEO
- Cares about cross-channel attribution and board-ready reporting
- Buys on ROI proof and integration breadth

## Visual Identity

### Colors

| Role        | Hex       | Usage                                |
| ----------- | --------- | ------------------------------------ |
| Primary     | `#2563eb` | CTAs, active states, key UI elements |
| Secondary   | `#f8fafc` | Backgrounds, cards, containers       |
| Accent      | `#16a34a` | Success states, positive metrics     |
| Neutral 900 | `#0f172a` | Body text, headings                  |
| Neutral 400 | `#94a3b8` | Placeholder text, disabled states    |
| Error       | `#dc2626` | Error states, destructive actions    |
| Warning     | `#f59e0b` | Warning states, attention alerts     |

### Typography

| Role    | Family            | Weight | Size | Line Height | Tracking |
| ------- | ----------------- | ------ | ---- | ----------- | -------- |
| H1      | Plus Jakarta Sans | 800    | 48px | 1.1         | -0.02em  |
| H2      | Plus Jakarta Sans | 700    | 36px | 1.2         | -0.01em  |
| H3      | Plus Jakarta Sans | 700    | 24px | 1.3         | 0        |
| Body    | Inter             | 400    | 16px | 1.6         | 0        |
| Caption | Inter             | 500    | 13px | 1.4         | 0.01em   |
| Code    | JetBrains Mono    | 400    | 14px | 1.5         | 0        |

### Spacing & Layout

- Base unit: 8px
- Component padding: 16px (compact), 24px (default), 32px (spacious)
- Section spacing: 64px (desktop), 48px (mobile)
- Max content width: 1200px
- Border radius: 8px (cards), 12px (modals), 9999px (pills/buttons)

### Shadows & Elevation

- Card: `0 1px 3px rgba(0,0,0,0.08)`
- Dropdown: `0 4px 12px rgba(0,0,0,0.12)`
- Modal: `0 8px 32px rgba(0,0,0,0.16)`

## Brand Voice & Tone

- **Voice:** Direct, confident, jargon-free. We explain, we don't lecture.
- **Tone shifts:** Warmer in onboarding, more assertive in sales copy,
  precise and neutral in documentation.
- **Sentence style:** Short sentences. Active voice. Lead with the benefit.
- **Avoid:** Passive constructions, "leverage", "synergy", filler phrases,
  exclamation marks in product UI.

### Examples

- ✅ "See which campaigns drive revenue — in one click."
- ❌ "Our innovative platform leverages cutting-edge technology to empower
  your marketing team with best-in-class analytics solutions."

## Component Guidelines

### Buttons

- Primary: filled, `#2563eb`, white text, rounded-full, min-height 44px
- Secondary: outlined, 1px border `#2563eb`, transparent background
- Ghost: no border, text-only, used in nav and tertiary actions
- All buttons: 16px horizontal padding, font-weight 600, no uppercase

### Cards

- Background: white, border-radius 8px, subtle shadow
- Padding: 24px
- Header: H3 weight, 8px margin-bottom
- Always include a clear CTA or next action

### Forms

- Label above input, font-weight 500
- Input height: 44px, border-radius 8px, 1px border neutral-300
- Error message below input in red, 13px
- Required fields marked with \* (not colour alone)

## Do's and Don'ts

- ✅ Always include a single, clear CTA per section
- ✅ Use real data in examples and screenshots, never "Lorem ipsum"
- ✅ Test contrast ratios — minimum WCAG AA (4.5:1 for text)
- ❌ Never use more than 3 colours in a single component
- ❌ Don't use stock photos of people pointing at screens
- ❌ Avoid centre-aligning body text longer than 2 lines

C'est du texte brut. Aucun format propriétaire. Aucun outil spécial. Donnez-le à n'importe quel outil d'IA — Cursor, Claude, Stitch, v0, Bolt, Copilot — et votre marque devient une couche de contrainte qui façonne automatiquement chaque sortie.

Pourquoi cela est important dès maintenant

Trois forces ont convergé pour rendre les directives de marque lisibles par machine urgentes, et non optionnelles :

1. Les outils d'IA écrivent désormais la majeure partie du code et du texte

Cursor, GitHub Copilot, Claude, v0, Bolt, Lovable — les développeurs et les spécialistes du marketing expédient plus vite que jamais grâce à l'assistance de l'IA. Mais ces outils n'ont aucune connaissance de votre marque, sauf si vous les informez. À chaque session, à chaque invite, vous réexpliquez votre palette de couleurs. Ce n'est pas un flux de travail — c'est une taxe sur la vitesse.

Un seul fichier brand-guidelines.md dans votre dépôt élimine cette taxe de manière permanente.

2. Google promeut design-md comme standard

Lorsque Google publie une spécification de format via un produit comme Stitch, l'écosystème y prête attention. Les plugins Figma, les extensions VS Code et les générateurs de composants IA commencent déjà à rechercher un DESIGN.md à la racine du projet. Mettre votre fichier en ordre aujourd'hui signifie que les outils de demain fonctionneront simplement — sans migration, sans retravail.

3. La cohérence de la marque à la vitesse de l'IA nécessite des règles lisibles par machine

Si votre équipe génère 50 articles de blog par mois, 20 variantes d'annonces par semaine et une nouvelle page de destination à chaque sprint, un PDF dans Google Drive est inutile. Les règles de la marque doivent vivre là où la génération se produit — dans le dépôt, dans le contexte de l'invite, dans la mémoire de l'outil.

PDF vs. brand-guidelines.md : une comparaison côte à côte

Le PDF n'est pas mort pour les présentations aux parties prenantes. Mais pour l'exécution quotidienne — là où les outils d'IA font la génération — le texte brut gagne de manière décisive.

Comment utiliser brand-guidelines.md avec Google Stitch

Google Stitch lit votre brand-guidelines.md et l'utilise pour contraindre sa génération d'interface utilisateur. Au lieu de produire des composants Material génériques, il génère une interface utilisateur qui correspond à votre système de couleurs, votre typographie, votre espacement et vos conventions de composants.

Le flux de travail se déroule en trois étapes :

1. Téléchargez ou placez le fichier. Déposez brand-guidelines.md à la racine de votre projet, ou téléchargez-le directement dans l'interface Stitch.
2. Lancez une invite naturellement. Demandez ce dont vous avez besoin : "Générez une section de tarification avec trois niveaux et un plan populaire mis en évidence."
3. Obtenez un résultat conforme à la marque. Stitch applique automatiquement vos couleurs, votre hiérarchie typographique, vos styles de bouton et votre espacement. Aucune révision de design n'est nécessaire pour les bases.

Le résultat n'est pas seulement plus proche de votre marque — il est plus rapide à livrer car vous évitez la passe de correction qui prend normalement un après-midi entier.

Utilisation avec Cursor, Copilot et les outils de codage AI

Déposez DESIGN.md (ou brand-guidelines.md) à la racine de votre dépôt et référencez-le dans vos invites :

Cursor :

@DESIGN.md Générer une section hero pour la page d'accueil.
Utiliser le style de CTA principal, la typographie des titres et le système de couleurs du fichier.

GitHub Copilot (mode espace de travail) :

#file:DESIGN.md Construire un composant de grille de cartes de témoignages
en utilisant les directives de carte et le système d'espacement définis ici.

Claude / ChatGPT (coller ou joindre le fichier) :

Voici mes directives de marque [joint : brand-guidelines.md].
Écrire trois options de titre de page d'accueil qui correspondent à la voix de la marque
et s'adressent au client idéal 1 (Responsable Marketing de Croissance).

v0 / Bolt / Lovable : Téléchargez brand-guidelines.md comme fichier de projet, ou collez les sections pertinentes dans votre invite. Ces outils appliqueront vos couleurs, votre typographie et vos spécifications de composants à chaque génération.

Le bénéfice : des développeurs qui n'ont jamais lu les directives de marque produisent du code conforme dès leur première invite. La contrainte est intégrée au flux de travail — et non imposée par des cycles de révision et des messages Slack.

Au-delà des visuels : pourquoi la stratégie dans le fichier change tout

La plupart des fichiers de système de design s'arrêtent aux couleurs et aux polices. Un brand-guidelines.md de Branding5 va plus loin — et c'est cette profondeur qui transforme le résultat de l'IA de "semble correct" à "semble juste".

La fondation de la marque dit à l'IA pourquoi la marque fait les choix qu'elle fait. Lorsqu'une IA sait que vous êtes un archétype du Sage ciblant des marketeurs non techniques, elle ne choisit pas seulement la bonne couleur de bouton — elle écrit un texte clair et confiant au lieu d'un texte trop vantard et essoufflé.

Les profils de clients idéaux donnent à l'IA le contexte d'audience pour générer un message pertinent. Un titre pour un vice-président marketing se lit très différemment de celui destiné à un responsable marketing de croissance. Sans ICP dans le fichier, l'IA devine. Avec eux, elle cible.

Les directives de voix et de ton avec des exemples concrets (bons et mauvais) sont la section la plus efficace pour la qualité du texte. Un exemple "à faire / à ne pas faire" bien rédigé enseigne à une IA plus qu'une centaine de mots de description abstraite de la voix.

Les choses à faire et à ne pas faire agissent comme des contraintes strictes. "N'utilisez jamais plus de 3 couleurs dans un composant" et "incluez toujours un CTA dans chaque section" sont des règles que l'IA peut suivre littéralement, à chaque fois. Pas d'ambiguïté, pas de dérive.

Comment Branding5 génère le vôtre

Après avoir terminé votre analyse de marque dans Branding5, votre brand-guidelines.md est prêt à être téléchargé depuis le tableau de bord. Voici ce qui se passe en coulisses :

1. Votre stratégie de marque alimente le fichier. Positionnement, archétype, ICP, analyse concurrentielle, ton de voix — tout ce que vous avez construit dans Branding5 est directement intégré au fichier Markdown structuré.
2. Les spécifications visuelles sont dérivées de votre positionnement. Les couleurs, la typographie et les conventions de composants sont générées pour correspondre à la personnalité de votre marque — et non tirées d'un modèle générique.
3. Le résultat suit la spécification design-md. Stitch et les outils compatibles l'analysent nativement. Aucune conversion, aucune reformulation.
4. Il est prêt à l'emploi immédiatement. Déposez-le dans votre dépôt, joignez-le à votre outil d'IA ou partagez-le avec votre équipe. Un fichier, tous les outils, dès le premier jour.

Les 30 minutes que vous passez dans Branding5 produisent :

• Un PDF de stratégie pour vos parties prenantes et investisseurs
• Des cadres de messagerie pour votre équipe marketing
• Un brand-guidelines.md pour chaque outil d'IA que votre équipe d'ingénierie et de design utilisera un jour

Pas de rédaction. Pas de formatage manuel. Pas d'expertise Markdown requise.

Pour commencer : une checklist de cinq minutes

Vous avez déjà une stratégie de marque ? Voici comment passer de zéro à un système de marque prêt pour l'IA en cinq minutes :

1. Générez votre fichier. Effectuez votre analyse de marque dans Branding5 et téléchargez brand-guidelines.md depuis votre tableau de bord.
2. Déposez-le à la racine de votre dépôt. Nommez-le DESIGN.md si votre équipe préfère la convention des développeurs, ou gardez brand-guidelines.md pour plus de clarté.
3. Informez votre équipe. Partagez un message simple : "Nos directives de marque sont maintenant dans DESIGN.md à la racine du projet. Référencez-le dans chaque invite d'IA."
4. Référencez-le dans chaque session d'IA. Utilisez @DESIGN.md dans Cursor, attachez-le dans Claude ou ChatGPT, téléchargez-le dans v0 ou Bolt.
5. Maintenez-le à jour. Lorsque votre marque évolue, mettez à jour le fichier et commitez. Git suit le changement. Chaque outil le récupère instantanément.

C'est tout. Pas de présentation d'intégration. Pas de goulot d'étranglement de révision de design. Fini les "quelle est notre couleur de marque ?" sur Slack.

Le résultat final

Les outils d'IA écrivent votre code, génèrent votre texte et échafaudent vos composants. La seule question est de savoir s'ils le font conformément à votre marque — ou s'ils inventent au fur et à mesure.

Un brand-guidelines.md répond à cette question une fois pour toutes. Puis il y répond encore, automatiquement, à chaque génération, à travers chaque outil, pour chaque personne de votre équipe.

Le format Stitch de Google est en train de faire des directives de marque lisibles par machine une norme. DESIGN.md devient le fichier que les développeurs s'attendent à trouver à la racine du projet. Les marques qui l'adoptent maintenant livreront plus rapidement, resteront plus cohérentes et perdront moins de temps à corriger les résultats de l'IA qui ont manqué leur cible.

Votre stratégie de marque est déjà dans Branding5. Votre brand-guidelines.md est à un clic.

Questions fréquemment posées

Quelle est la différence entre DESIGN.md et brand-guidelines.md ?

C'est le même format. DESIGN.md est l'abréviation populaire dans les communautés de développeurs — elle reflète les conventions de nommage de README.md. brand-guidelines.md est plus descriptif, signalant que le fichier contient une stratégie de marque (positionnement, voix, ICP), et pas seulement des spécifications visuelles. Utilisez le nom que votre équipe préfère ; les outils d'IA analysent les deux de manière identique.

Ai-je besoin de connaître Markdown pour créer ou modifier le fichier ?

Non. Branding5 génère le fichier automatiquement à partir de votre analyse de marque. Si vous souhaitez effectuer des modifications manuelles plus tard, Markdown n'est que du texte brut avec un formatage simple (# pour les titres, - pour les listes, ** pour le gras). Tout le monde peut apprendre les bases en deux minutes.

Quels outils d'IA prennent en charge design-md / DESIGN.md ?

Google Stitch le lit nativement. Cursor, GitHub Copilot, Windsurf, Claude, ChatGPT, v0, Bolt et Lovable fonctionnent tous avec lorsque vous référencez ou joignez le fichier. Parce que c'est du Markdown simple, n'importe quel outil basé sur LLM peut l'analyser et le suivre — aucun plugin ni intégration n'est requis.

À quel point mon brand-guidelines.md doit-il être détaillé ?

Assez détaillé pour lever toute ambiguïté. Au minimum, incluez votre palette de couleurs avec les règles d'utilisation, les spécifications typographiques, les conventions de boutons/cartes/formulaires et les directives de voix avec des exemples. Plus vos choses à faire et à ne pas faire sont spécifiques, plus la sortie de l'IA sera cohérente. Branding5 génère un fichier complet par défaut — vous pouvez toujours supprimer les sections dont vous n'avez pas besoin.

Comment maintenir le fichier synchronisé à mesure que ma marque évolue ?

Traitez-le comme n'importe quel autre fichier source : modifiez, commitez, poussez. Parce qu'il vit dans Git, votre équipe voit exactement ce qui a changé et quand. Si vous relancez votre analyse de marque dans Branding5, vous pouvez télécharger une version mise à jour et remplacer l'ancien fichier. Pas de rétention d'agence, pas de cycle de révision d'un mois.

Puis-je utiliser brand-guidelines.md pour des tâches non-code comme la rédaction d'articles de blog ou de textes publicitaires ?

Absolument. Joignez le fichier (ou collez les sections Voix de la Marque et ICP) lorsque vous utilisez Claude, ChatGPT ou tout autre assistant de rédaction. Les directives de voix, les exemples de ton et les détails d'audience sont spécifiquement conçus pour améliorer le texte généré par l'IA — pas seulement le code.

Obtenez votre brand-guidelines.md

Effectuez votre analyse de marque dans Branding5 et téléchargez un brand-guidelines.md (DESIGN.md) conforme à design-md — prêt pour Google Stitch, Cursor, Copilot et l'ensemble de votre pile d'outils d'IA.

Générez votre brand-guidelines.md →