À la fin de ce guide
- Comprendre pourquoi coder un visuel bat le générateur d'images
- Constituer une planche de références exploitable
- Extraire un système de design réutilisable de ces références
- Produire une infographie et en corriger les chiffres sans tout refaire
- L'exporter proprement pour LinkedIn ou une présentation
- Figer votre style en compétence pour les suivantes
Ce qu’il vous faut
- Un abonnement Claude payant
- Trois à cinq visuels dont le style vous plaît
- Des données à représenter — de vraies, pas un exemple
- Aucune compétence en design ni en code
Un post LinkedIn accompagné d'un visuel est lu bien plus qu'un mur de texte. Une note interne avec un schéma clair passe en réunion ; la même note en paragraphes finit dans une boîte mail. Le problème, c'est que produire ces visuels demande soit un logiciel qu'on ne maîtrise pas, soit un prestataire pour trois chiffres qui changeront la semaine prochaine.
Les générateurs d'images ne règlent pas la question. Ils produisent de belles compositions et massacrent le texte : les mots sont approximatifs, les chiffres fantaisistes, et corriger une valeur oblige à tout régénérer.
La méthode décrite ici contourne le problème : on demande à Claude de coder l'infographie plutôt que de la dessiner. Le texte est exact parce que c'est du texte, les chiffres se corrigent en une phrase, et le même style se réapplique à l'infini.
Sommaire du guide (6 sections)
01
Pourquoi coder plutôt que générer
| Générateur d'images | Infographie codée |
|---|---|
| Le texte est souvent déformé, les mots inventés | Le texte est exact : c'est du texte, pas un dessin de texte |
| Corriger un chiffre oblige à tout régénérer | Vous dites « remplace 34 % par 41 % », le reste ne bouge pas |
| Chaque image repart de zéro, le style dérive | Le même système de design se réapplique à l'identique |
| Rendu artistique difficile à égaler autrement | Rendu sobre, propre, parfois un peu sage |
| Impossible de réutiliser la structure | Le fichier se duplique et se remplit avec de nouvelles données |
Le verdict est net dès qu'il y a des chiffres, des noms ou des dates à afficher — c'est-à-dire dans la quasi-totalité des visuels professionnels. Réservez le générateur d'images aux illustrations d'ambiance, où aucun mot ne doit être lisible.
Précision utile : Claude ne génère pas d'images. Il écrit le code qui produit le visuel, et vous l'affiche directement dans le panneau latéral. C'est ce qu'on appelle un artefact — un objet vivant, modifiable par la conversation.
02
Étape 1 — la planche de références
L'étape que tout le monde saute, et qui détermine tout le reste.
Décrire un style avec des mots ne fonctionne pas. « Moderne et épuré » ne veut rien dire — tout le monde s'en réclame, et vous obtiendrez la moyenne de tous les visuels existants. Montrer fonctionne.
Réunissez trois à cinq images de visuels dont le rendu vous plaît. Pas des visuels de votre secteur : des visuels dont l'allure vous plaît, quel que soit le sujet. Une capture d'écran suffit.
Ce qui fait une bonne planche
- Trois à cinq images, pas quinze : au-delà, le style extrait devient une bouillie.
- Une cohérence entre elles — si elles se contredisent, vous obtiendrez un compromis mou.
- Une bonne résolution : une capture floue donne une extraction floue.
- Au moins un visuel comportant des chiffres, pour que la mise en forme des données soit couverte.
- Vos propres couleurs de marque à côté, si vous en avez.
03
Étape 2 — extraire le système de design
Plutôt que de demander directement une infographie, on demande d'abord de formaliser le style : couleurs, typographies, espacements, arrondis. Ce document intermédiaire est ce qui rend tout le reste reproductible.
Ouvrez une conversation, déposez vos références, réglez le modèle sur Opus 5 en effort élevé — c'est une tâche de jugement visuel, et l'écart avec un modèle plus léger est net.
Tu es directeur artistique sur ce projet.
Voici des visuels de référence. Analyse-les et produis-moi un système de design réutilisable, sous forme d'un document nommé SYSTEME-DESIGN.md contenant :
1. PALETTE — 4 à 6 couleurs en hexadécimal, chacune nommée par son rôle (fond, texte principal, texte secondaire, accent, alerte). Précise les contrastes.
2. TYPOGRAPHIE — 2 ou 3 niveaux (titre, corps, annotation), avec les tailles et les graisses concrètes, et le nom des polices.
3. ESPACEMENTS — l'échelle utilisée, en valeurs concrètes.
4. FORMES — rayons des angles, épaisseurs de traits, traitement des ombres.
5. MISE EN PAGE — comment l'information est organisée, ce qui attire l'œil en premier, comment les blocs sont séparés.
6. ÉLÉMENT SIGNATURE — le détail qui rend ces visuels reconnaissables entre mille.
7. INTERDITS — ce qu'il ne faut jamais faire pour rester dans ce style.
Écris tout en français. Termine par un exemple de rendu en HTML autonome qui montre le système appliqué, pour que je puisse juger avant d'aller plus loin.Le point 7 est celui qui tient le style dans la durée : sans interdits explicites, la dérive commence dès la troisième infographie.
Regardez l'exemple de rendu et corrigez avant d'aller plus loin : « l'accent est trop agressif », « les titres sont trop gros », « garde plus d'air entre les blocs ». Cinq minutes de réglage ici vous en économisent trente ensuite. Une fois satisfait, demandez-lui d'enregistrer le fichier.
04
Étape 3 — produire l'infographie
Le système validé, la production devient rapide. Donnez vos données réelles et la finalité — la finalité change complètement la mise en page.
En appliquant strictement le système de design, produis une infographie HTML autonome.
SUJET : [EN UNE PHRASE]
DESTINATION : [post LinkedIn / slide de présentation / annexe de rapport]
FORMAT : [carré 1080×1080 / portrait 1080×1350 / paysage 1920×1080]
LECTEUR : [à qui ça s'adresse, et ce qu'il doit comprendre en trois secondes]
DONNÉES :
[COLLER LES CHIFFRES, AVEC LEURS INTITULÉS EXACTS ET LEUR UNITÉ]
MESSAGE PRINCIPAL : [la seule chose à retenir]
Règles :
- Tout en français, y compris les abréviations et les formats de nombres (espace comme séparateur de milliers, virgule décimale).
- N'invente aucune donnée. Si une valeur manque, laisse un espace visible et signale-le-moi.
- Le message principal doit être lisible à deux mètres d'un écran.
- Pas plus de sept blocs d'information.
- Aucune police externe : n'utilise que des polices disponibles partout.La règle sur les polices évite le visuel qui s'affiche parfaitement chez vous et se décompose chez le destinataire. La règle sur les formats de nombres évite les 1,234.56 à l'américaine.
La relecture avant publication
- Chaque chiffre affiché correspond à votre source — vérifiez-les un par un.
- Les unités sont présentes et justes (€ HT, %, tonnes, mois).
- Aucun mot n'est coupé ni tronqué en bord de bloc.
- Le message principal se lit sans zoomer, sur téléphone.
- Les couleurs restent lisibles en niveaux de gris, au cas où ce serait imprimé.
- Aucune donnée client ou nominative n'apparaît.
05
Étape 4 — sortir une image
L'artefact s'affiche dans le panneau latéral. Pour le publier, il faut une image. Trois façons, de la plus simple à la plus propre :
- 1
La capture d'écran
Suffisant pour un usage interne. Agrandissez le panneau au maximum avant de capturer, sinon la définition sera trop faible pour LinkedIn. C'est la méthode la plus rapide, et la moins bonne en qualité.
- 2
Le téléchargement du fichier
Demandez à Claude de vous enregistrer le fichier HTML. Ouvrez-le dans votre navigateur, il s'affiche en plein écran à la bonne taille. La capture est alors nette.
- 3
L'export demandé directement
En session Cowork, demandez « exporte-moi cette infographie en PNG à 1080 × 1350 ». Il produit le fichier image dans votre dossier. C'est la méthode à privilégier dès que vous en faites régulièrement.
06
Étape 5 — figer le style en compétence
Refaire l'extraction du style à chaque fois n'a aucun sens. Une fois le système validé, transformez-le en compétence : les visuels suivants se demandent en une phrase.
- 1« Créer avec Claude » vous fait passer par un entretien.
- 2« Téléverser une compétence » importe un dossier existant.
- 3La compétence apparaît ensuite dans le menu « / ».
Crée une compétence à partir du fichier SYSTEME-DESIGN.md.
Elle doit :
- se déclencher quand je demande une infographie, un visuel de données, une carte de chiffres ou un slide illustré
- NE PAS se déclencher pour un logo, une illustration d'ambiance, une photo, ou un document texte
- appliquer systématiquement le système de design sans que j'aie à le rappeler
- me demander le format de destination si je ne l'ai pas précisé
- refuser d'inventer une donnée absente et me la signaler à la placeEnsuite, une infographie se demande comme ça : « / infographie — les 4 chiffres du trimestre, format LinkedIn portrait », suivi des données.
Une identité visuelle qui tient dans la durée
Quand cinq personnes produisent des visuels avec l'IA sans système commun, la communication devient un patchwork. Nous formalisons la charte, la transformons en compétence partagée et formons les équipes à s'en servir.
Découvrir le pôle DigitalQuestions fréquentes
Faut-il savoir coder pour cette méthode ?
Non, et vous ne verrez jamais le code. Il apparaît sous forme de visuel dans le panneau latéral, et vous le modifiez en français. Le seul moment technique est l'ouverture d'un fichier dans votre navigateur pour une capture nette, ce qui revient à un double-clic.
Le rendu vaut-il celui d'un graphiste ?
Non, et il ne faut pas le prétendre. Vous obtenez un visuel propre, lisible et cohérent — largement au-dessus de ce que produit un tableur, en dessous d'un travail de direction artistique. C'est exactement ce qu'il faut pour un post, une note interne ou une annexe de rapport. Pour une plaquette commerciale ou une identité de marque, prenez un professionnel.
Puis-je réutiliser le style de mon entreprise ?
Oui, et c'est le meilleur point de départ. Déposez votre charte graphique ou quelques documents existants comme références : le système extrait sera le vôtre, pas une esthétique générique. Vos visuels ressembleront enfin à ceux de la maison.
Et si je veux un fond illustré ?
Claude ne génère pas d'images. Produisez le fond avec un outil de génération d'images en lui demandant explicitement de laisser des zones vides pour le texte, puis donnez cette image à Claude comme arrière-plan de l'infographie. Vous cumulez l'illustration et des chiffres exacts.
.png)
Rémi Doyen
Fondateur de Pilote Expertise — pôle Digital
Je conçois des outils sur mesure pour des PME industrielles et de services. Ce que je décris ici, je l'utilise tous les jours — y compris pour construire ce site.
Suivre sur LinkedInAvis des lecteurs
Aucun avis publié pour l’instant. Vous pouvez être la première personne à réagir.
À lire dans la foulée
Créer sa première compétence Claude
Ce qu'est vraiment une compétence, les trois façons d'en créer une, la structure qui fonctionne, et la méthode de débogage quand elle refuse de se déclencher.
Le tour complet de Claude : toutes les briques, et à quoi elles servent
La carte complète des briques de Claude, ce que chacune apporte vraiment, et un plan de démarrage en trente minutes pour les mettre en place.