Dans un visuel qui montre un produit, l’écran doit être une capture réelle. Quand je laisse Claude redessiner une interface en HTML, il invente : des compteurs, des graphiques, des libellés qui n’existent pas. Ma règle : une capture réelle, des retouches limitées aux noms, ou pas de visuel.
Deux visuels refusés
J’ai demandé des visuels pour une page produit. Claude a redessiné en HTML un écran de segments, avec des compteurs, et un écran de scénario, avec des nœuds et un nombre d’envois. Les deux avaient l’air crédibles. Retour sans appel : « il est interdit de modifier les éléments de la plateforme, là tu as fait à ta sauce ».
Plus tard, sur une autre page, une barre de répartition de l’empreinte carbone avait été reconstituée alors que le produit n’affiche pas ce graphique. Je l’ai remplacée par l’anneau réel, repris d’une image de la documentation.
Un faux écran est une promesse que le produit ne tient pas. Le lecteur qui cherche cette barre dans l’outil ne la trouve pas.
Les règles
- Partir d’une capture réelle, prise dans une banque de captures, ou d’une image de la documentation officielle.
- Ne retoucher que les noms. Deux personnes fictives, prénoms seuls : Emma est l’utilisatrice de l’outil, Lucas est le destinataire des messages, Lumen est la marque. Jamais l’utilisatrice comme destinataire. Un libellé hors sujet se neutralise aux mêmes coordonnées, dans la même police.
- Les chiffres de démonstration peuvent être ajustés, au format exact de l’écran. Dans ce cas, la description du média dit « données de démonstration », jamais « capture réelle ».
- Ce qui n’est pas l’interface peut être créé : un e-mail ou un SMS fictif d’une marque fictive, un cadre de téléphone.
- La capture seule. Pas d’encadrés de légende ni de pastilles sur l’image, pas de montage photo plus capture : le texte explicatif va dans la page.
- Pas d’image générée. Les illustrations néon d’IA sont écartées, même si elles sont déjà en ligne : on les remplace.
- La même rigueur pour le texte : une fonctionnalité n’est affirmée que si elle figure dans la documentation. Les paramètres de suivi non documentés ne sont pas cités, un mode d’affichage absent de la documentation n’est mentionné que là où il est avéré.
Comment je l’applique avec Claude
- Une fiche de mémoire porte la règle, avec le pourquoi (les deux visuels refusés) et le comment, pour que l’agent ne la redécouvre pas à chaque session (voir comment j’organise cette mémoire).
- Le skill de refonte reprend la règle à l’étape des visuels : une carte reconstituée copie la forme et les valeurs d’un écran réel.
- Je regarde chaque image avant qu’elle parte. Quand une capture est trop petite, la demande est une nouvelle capture, pas un redessin.
Les limites
La règle coûte du temps : il faut une banque de captures à jour et, parfois, en demander une nouvelle. Elle exclut aussi des visuels « propres » que l’IA produit en dix secondes. C’est le prix : un visuel vrai vaut mieux qu’un visuel joli.
À retenir
Laissez l’IA créer ce qui n’est pas votre produit (un e-mail fictif, un cadre de téléphone, une mise en page) et jamais ce qui l’est. Un écran inventé, même plausible, finit par se voir.