Service design IA : 3 agents auditent un thème e-commerce en direct

Le service design du Synedre n'est pas un agent. C'est un tribunal.

Cet article fait partie de notre dossier Stratégie › intelligence-artificielle.

Quand un thème visuel passe en revue chez nous, il ne rencontre pas un designer. Il en rencontre trois. Chacun armé d'une méthode de pensée différente, d'un biais déclaré, et d'une question qu'il pose à tout ce qu'il voit.

Le résultat n'est pas un avis. C'est une délibération. Le même principe que Donald Norman décrit dans The Design of Everyday Things : un bon design ne vient pas d'un génie, mais d'un processus de confrontation systématique avec la réalité.

Voici comment fonctionne notre service design — et ce qu'il a dit du thème que vous êtes en train de regarder.

Trois agents, trois façons de penser

Le Synedre — notre système de 30 agents IA spécialisés — assigne trois regards distincts à chaque audit visuel. Pas trois copies du même modèle. Trois méthodes de pensée incompatibles entre elles, comme le recommande le MIT Media Lab dans ses recherches sur les systèmes multi-agents créatifs.

Agent	Rôle	Méthode	Inspiration	Question fondatrice
Itten	Directeur Artistique	Contraste	Johannes Itten, Bauhaus	Ce contraste crée-t-il de la tension utile ou du bruit visuel ?
Coco	Brand Guardian	Soustraction	Coco Chanel	Qu'est-ce qu'on peut enlever encore sans que le message s'effondre ?
Eames	Frontend Engineer	Fonctionnalisme	Charles & Ray Eames	Cette interface serait-elle meilleure si on en retirait un élément ?

Chacun possède un cadre cognitif — une directive épistémique, une question fondatrice, un biais connu et un critère d'arrêt — qui fait de lui non pas un rôle, mais une façon de penser.

Pourquoi les biais sont déclarés, pas cachés

Chaque agent a un angle mort identifié :

• Itten — Esthétisme académique : applique des règles de couleur pensées pour des toiles, pas des écrans tactiles
• Coco — Soustraction compulsive : enlève parfois l'élément qui rendait le design mémorable
• Eames — Fonctionnalisme pur : favorise l'élégance au détriment de la guidance utilisateur

Ces biais ne sont pas des défauts. Ce sont des garde-fous. Comme l'écrit Daniel Kahneman dans Thinking, Fast and Slow : « Un biais que vous connaissez est un biais que vous pouvez compenser. » Appliqué à l'IA : un agent sans biais déclaré est un agent dont on ne peut pas anticiper les erreurs.

L'audit : notre propre thème passé au crible

Nous avons soumis le thème d'alexandrecarette.fr à nos trois agents. Pas un site client. Le nôtre. Transparence totale — pratique du build in public appliquée au design.

Ce qu'Itten a vu : une palette en conflit

Le design system déclarait deux couleurs :

• Primary : indigo #4F46E5 — professionnel, technologique
• Secondary : teal #0D9488 — complémentaire froid, confiance
• Footer : slate-950 — ancrage visuel en bas de page
• Typographie : Playfair Display (titres) + Inter (corps) — contraste serif/sans-serif

Mais le hero racontait une autre histoire. Cinq orbes animées diffusaient du rose (rgba(244,63,94)), du violet, de l'orange et du bleu — quatre familles chromatiques absentes des tokens du design system. Selon la théorie des 7 contrastes de Itten (Bauhaus, 1961) — le même Itten qui inspire les portraits en noir et blanc de nos agents —, chaque couleur ajoutée hors palette crée une tension non contrôlée.

Verdict d'Itten : « Le système de tokens est solide. Le hero l'ignorait. Un squatteur chromatique — une couleur non référencée dans les tokens — échappe au contrôle du design system et crée de l'incohérence. Soit on déclare un accent rose officiel, soit on aligne les orbes sur primary/secondary. »

Ce que Coco a vu : un registre qui hésitait

Coco applique le principe de Chanel : « Avant de sortir, retirez un accessoire. » Son analyse :

• Inter + border-radius large + ombres = le thème dit « expert premium accessible »
• Cinq orbes animées + gradient rose = le thème dit « startup créative en beta »
• Personas en quatre couleurs différentes = fragmentation de l'identité

C'est ce que Marty Neumeier appelle le « brand gap » dans The Brand Gap : quand ce que vous dites et ce que vous montrez ne racontent pas la même histoire, le client ne retient rien.

Verdict de Coco : « Le thème portait deux costumes. Premium artisan : deux orbes max, indigo dominant. Créatif énergie : le rose devient l'accent officiel. Il faut choisir — nos clients ne doivent pas hésiter à notre place. »

Ce qu'Eames a vu : du poids mort mesurable

Charles Eames disait : « The details are not the details. They make the design. » Son héritier numérique a mesuré chaque détail :

Élément	Problème	Impact	Solution
Playfair Display	Police de 45 Ko chargée pour 1 ligne	+700ms FOIT	Inter 800 (déjà chargée)
5 orbes blur-[130px]	5 layers composite GPU	Lag scroll mobile	Réduire à 2 orbes
Token footerBg	Déclare #ffffff, réalité = slate-950	Builder ment	Synchroniser le token

Selon les Core Web Vitals de Google (2024), un LCP > 2.5 secondes pénalise le classement. Chaque milliseconde de FOIT réduit le score. Chaque layer GPU non nécessaire augmente le CLS sur mobile.

Verdict d'Eames : « Inter en bold 800 remplace Playfair sans perte de caractère. Deux orbes suffisent visuellement et performantiellement. Un token qui ment est pire qu'un token absent — le builder doit refléter la réalité. »

La synthèse : quand trois regards convergent

Les trois agents n'ont pas été concertés. Ils ont analysé le même thème avec trois grilles de lecture différentes. Et ils ont convergé sur quatre points.

Constat	Itten (Contraste)	Coco (Soustraction)	Eames (Fonctionnalisme)
Hero hors charte	Couleurs orphelines hors tokens	Registre incohérent avec le premium	Layers GPU inutiles
5 orbes = trop	Trop de familles chromatiques	Trop de mouvement pour du premium	5 layers blur = dette performance
Token footer menteur	—	Builder ≠ réalité visible	Variable CSS désynchronisée
Choix de registre	Harmoniser ou déclarer un accent	Premium ou créatif, trancher	Mesurer le coût de chaque choix

Quand trois méthodes incompatibles convergent sur le même diagnostic, ce n'est plus une opinion. C'est un signal structurel. C'est la force d'un système multi-agents face à un designer unique : la couverture des angles morts est architecturale, pas accidentelle.

Pourquoi trois regards valent mieux qu'un seul designer

La recherche en intelligence collective (Woolley et al., 2010, Science) montre que la performance d'un groupe ne dépend pas de l'intelligence individuelle de ses membres, mais de la diversité cognitive de l'ensemble. Le Synedre applique ce principe à l'IA :

• Convergence = signal fort. Quand les trois pointent le même problème (les orbes), c'est indépendant du prisme d'analyse
• Divergence = débat productif. Sur la typographie, Eames veut supprimer Playfair (performance) mais Itten la défendrait (contraste typographique). Ce désaccord force une décision argumentée au lieu d'un réflexe
• Couverture = zéro angle mort systémique. Chaque biais déclaré d'un agent est compensé par le regard des deux autres

On ne cherche pas l'objectivité — on organise la confrontation de subjectivités compétentes. Un principe qui répond aux 3 failles critiques des agents IA.

Ce qu'on a appliqué concrètement

Suite à cet audit, voici les modifications implémentées sur alexandrecarette.fr par nos automates :

1. Orbes du hero réduites de 5 à 2 — alignées sur la palette primary (indigo) et secondary (teal), zéro couleur orpheline
2. Token footerBg synchronisé — la valeur déclarée (#020617) reflète maintenant le slate-950 réel du footer dark
3. Playfair Display retirée du hero — Inter 800 (font-extrabold) la remplace, gain de ~700ms au premier chargement
4. Ring photo aligné sur la charte — le dégradé conic-gradient utilise indigo/teal au lieu de rose/violet orphelin

Chaque recommandation est traçable dans le git. Chaque décision est documentée dans cet article. C'est ça, un service design qui fonctionne comme un système reproductible, pas comme une intuition ponctuelle.

Comment reproduire cette méthode dans votre équipe

Le service design du Synedre repose sur trois principes que toute équipe — humaine ou IA — peut adopter :

• Assignez des méthodes, pas des rôles. Un « designer » est un titre. Un « agent qui raisonne par contraste » est une grille de lecture. La grille produit des diagnostics reproductibles, le titre produit des opinions.
• Déclarez les biais. Chaque évaluateur a un angle mort. Le rendre explicite permet aux autres de le compenser. Un biais caché est un bug ; un biais déclaré est une feature. C'est la base de la méthode Red Team utilisée par la NSA et les Big Four en audit de sécurité.
• Comparez les convergences, pas les avis. Si trois méthodes incompatibles pointent le même problème, le problème est réel. Si elles divergent, le sujet mérite un débat — pas un vote à la majorité.

« La qualité n'est pas un acte, c'est une habitude. » — Aristote, cité par Will Durant dans The Story of Philosophy. Le Synedre transforme cette habitude en architecture logicielle.

Vous voulez voir comment le Synedre pourrait auditer votre propre design system ?

Réserver un appel stratégique gratuit (30 min)