Écrit par Morgane Urbain, cofondatrice et directrice de création de Bonhomme.

Principe 1 : Noyau invariant
Le noyau invariant est ce qui ne change jamais. C'est l'ADN de la marque sur le plan visuel. Composantes du noyau invariant :
• Typographie : Une ou deux polices maximum. Non-négociable.
• Hiérarchie : Les H1, H2, H3 se comportent toujours de la même façon.
• Couleur primaire : La couleur de marque. Utilisée de la même façon partout.
• Grille et espacement : Les marges, paddings, gaps obéissent à la même base (8px généralement).
• Logo et son placement : Inviolable. Jamais déformé, redimensionné arbitrairement, ou réinterprété.
Le noyau invariant est la promesse : "Si tu reconnais ces éléments, tu sais que tu es avec cette marque."
Principe 2 : Expressions adaptables
Les expressions adaptables sont ce qui change selon le contexte. Elles vivent toujours dans le cadre du noyau invariant.
Exemples d'expressions adaptables :
• Couleurs secondaires et accents : Peuvent varier selon le contexte (produit, saison, campagne)
• Imagerie : Les photos ou illustrations changent, mais le style reste cohérent
• Typographie de titre : La base est la même, mais le poids ou la taille adaptent par contexte
• Animations : Les mouvements adaptent la tonalité de marque, mais pas son essence
• Layouts : Les compositions changent selon la page, mais respeitent la grille
Les expressions adaptables disent : "Je suis flexible assez pour m'adapter, mais jamais assez pour me perdre."
Principe 3 : Règles de composition
Les règles de composition définissent comment assembler les éléments.
Inclut :
• La grille (12 colonnes, 8 colonnes ? Comment se divise l'espace ?)
• Le rythme (espacement constant, proportions harmonieus)
• La proportion (le ratio entre texte et espace blanc)
• L'alignement (toujours au grid, jamais arbitraire)
• L'hiérarchie (comment on signale "important" vs "secondaire")
Les règles de composition permettent à des designers différents de créer des choses qui paraissent du même univers.
Principe 4 : Vocabulaire émotionnel
Le vocabulaire émotionnel défini ce que chaque élément communique.
Exemples :
• Une animation lente = sérieux, luxe, soin (vs rapide = urgence, technologie, énergie)
• Serif = tradition, héritage (vs sans-serif = moderne, accessible)
• Espace blanc généreux = luxe, calme (vs espace serré = urgence, densité)
• Image monochrome = minimalisme, clarté (vs multicolore = richesse, diversité)
Quand le vocabulaire émotionnel est clair, tout le monde crée "dans la tonalité" sans avoir à demander.
Principe 5 : Documentation permanente
Une direction artistique forte n'existe que si elle est documentée. Et pas dans un PDF oublié.
La documentation doit :
• Être accessible à tous (designers, developers, copywriters)
• Être vivante (mise à jour quand le contexte change)
• Inclure des exemples concrets (pas juste des règles abstraites)
• Montrer les exceptions autorisées (parce qu'il y en a quelques-unes)
• Être implementée en code (Figma components, CSS variables, etc.)
La meilleur direction artistique est celle qui se respecte toute seule par automatisation, pas par discipline manuelle.

Phase 1 : Analyser l'identité de marque
Avant de définir les règles digitales, comprendre l'identité de marque.
Questions :
• Quels sont les 3 adjectifs qui définissent cette marque ?
• Comment cette marque parlerait-elle ? (ton)
• Qu'est-ce qui est non-négociable pour cette marque ?
• Quels précédents visuels existent (logo, typographie, couleur) ?
Phase 2 : Définir le noyau invariant
À partir de cette analyse, isoler ce qui ne change jamais. C'est généralement peu d'éléments. La discipline :
• Choisir UNE typographie principale (vraiment une, pas deux "principales")
• Définir UNE grille et system d'espacement
• Choisir UNE couleur primaire (d'autres peuvent exister, mais une est dominante)
• Figurer l'usage immuable du logo
Phase 3 : Définir les expressions adaptables
Ensuite, definir ce qui peut changer, comment, et dans quels limites.
• Couleurs secondaires : comment sont-elles utilisées ?
• Typographies additionnelles : y en a-t-il ? Pour quoi faire ?
• Imagerie : quel style ? Photographique ? Illustratif ? Mixte ?
• Animations : quels mouvements sont autorisés ?
Phase 4 : Documenter les règles
Documenter dans un format qu'on va vraiment utiliser. Pas un PDF de 50 pages
• Figma avec composants réutilisables
• Notion ou wiki avec exemples concrets
• CSS variables et design tokens
• Storybook pour les components frontend
Phase 5 : Implémenter en automatisation
La meilleur direction artistique est celle qui ne demande pas de discipline. Elle est automatisée.
• Composants dans Figma que tout le monde utilise
• CSS classes prêtes à l'emploi
• Figma plugins qui force l'alignement au grid

Après avoir construit 50+ directions artistiques digitales, Bonhomme observe :
• Les marques avec une direction artistique forte sont reconnaissables au premier regard, même sur des contextes radicalement nouveaux.
• Les équipes travaillent 30-40% plus vite avec une direction artistique automatisée. Les designers ne décident pas, ils créent.
• L'une des plus grandes sources de confusion est "qu'est-ce qui change et qu'est-ce qui ne change pas". Documenter les deux explicitement élimine 80% des questions.
• Les exceptions non-documentées deviennent vite la règle. Après 3 exceptions, t'as plus de direction artistique, t'as du chaos.
• La direction artistique la plus forte est souvent la plus simple. 2 typographies, 3 couleurs, une grille. Pas plus.
• Les marques qui changent leur direction artistique tous les ans perdent la reconnaissance. La force vient de la consistance sur des années.

Type 1 : Direction stricte
Beaucoup de règles, peu d'exceptions. Utilisée par : luxury, corporate, fintech.
Avantages : cohérence maximale, reconnaissance immédiate.
Inconvénients : peut sembler rigide, demande discipline.
Type 2 : Direction flexible
Peu de règles, beaucoup d'exceptions autorisées. Utilisée par : startups, créatif, tech. Avantages : permet innovation, renouvellement fréquent.
Inconvénients : peut manquer de cohérence, reconnaissance difficile.
Type 3 : Direction hybride
Noyau invariant très strict, expressions adaptables très flexibles. Utilisée par : les meilleures marques. Avantages : reconnaissable mais jamais figée, création facile.
Inconvénients : plus complexe à documenter

• Créer une direction artistique trop complexe. Si tu dois l'expliquer en plus de 2 pages, c'est trop.
• Ignorer le contexte digital. Une direction artistique pensée pour print doit être réinterprétée pour le digital.
• Documenter mais ne pas implémenter. Les PDFs ne suffisent pas. Il faut du code.
• Permettre trop d'exceptions. Les exceptions se multiplient. En 6 mois, tu as 20 exceptions et plus de direction.
• Ne pas impliquer les makers (designers, devs). Une direction artistique imposée ne sera pas suivie.
• Penser que la direction artistique étouffera la créativité. Au contraire, elle la canalise.
• Oublier que les règles changent. La direction artistique doit évoluer (lentement) avec le marché

Principe 1 : La direction guide sans étouffer
Elle dit "voici le cadre". Pas "tu dois faire ça et pas ça".
Principe 2 : Moins de règles = plus de respect
5 règles strictes sont plus efficaces que 50 suggestions.
Principe 3 : L'exception prouve la règle
Les exceptions peuvent exister, si elles sont justifiées et documentées.
Principe 4 : La direction artistique doit être vivante
Elle évolue (lentement) quand le contexte change, pas figée.
Principe 5 : L'automatisation est l'objectif
Si les gens doivent penser à la direction artistique, c'est qu'elle n'est pas bien implémentée.

Marque : Luxury Watch Brand
Noyau invariant :
• Serif classique (Garamond)
• Noir et or uniquement
• Grille 12 colonnes
• Typographie en caps lock pour les titres
Expressions adaptables :
• Photographie : produit vs lifestyle
• Accent de couleur : or classique vs or rose selon la collection
• Animations : hautement conservative pour heritage, légèrement plus liberté pour les campagnes
Marque : Tech Startup
Noyau invariant :
• Sans-serif moderne (Helvetica Neue)
• Bleu primaire + blanc
• Grille très loose (responsive, pas fixe)
• Logo toujours minimal
Expressions adaptables :
• Couleurs accent : par équipe ou produit
• Illustrations : style cohérent mais variations thématiques
• Animations : rapides et énergiques, styles varied

Bonhomme a comparé marques avec direction artistique forte vs faible :
• Direction forte : +45-55% reconnaissance de marque, +30-40% temps de création réduit, +25-35% adhésion équipe
• Direction faible : baseline ou moins
• Absence de direction : -50-60% reconnaissance, chaos créatif, confusion message.

"Une direction artistique forte est comme une constitution. Elle dit ce qui est immuable et ce qui peut s'adapter. Sans elle, chacun crée son propre univers."
Morgane Urbain, cofondatrice & directrice de création
"La meilleur direction artistique est celle que personne ne remarque, parce que tout le monde la suit automatiquement. Elle s'est implémentée jusqu'à l'invisible."
Emmanuel Cruellas, co-fondateur & directeur du design