Cas 04 · Identité de marque
Un instrument,
pas une brochure.
L’identité de JOVION, notre agent Web IA : du cuivre sur un quasi-noir, des panneaux en filets fins aux coins cuivrés et une typographie ultra-large d’ingénierie — codifiée en une trousse de design dont le produit, l’extension et le site Web se servent tous.
- 01 // Rôle
- Stratégie · Identité · Système de design
- 02 // Livrable
- Trousse de design — jetons et règles
- 03 // Année
- 2026
- 04 // En usage
- jovionwp.com · l’admin de l’extension
A Le mandat
Les produits IA se ressemblent souvent — dégradés doux, cartes arrondies, lueur amicale. Cela dessert un outil qui demande la permission de modifier un site Web en ligne. JOVION devait paraître précis et responsable avant même qu’on en lise un mot.
A.2 Ce qu’il devait faire
- 01Emprunter la grammaire visuelle des instruments d’aviation et de laboratoire
- 02Une seule couleur d’accent, si rare que chaque usage a un sens
- 03Un système typographique où chaque police a un seul rôle
- 04Des règles assez précises pour qu’une machine les applique — JOVION compris
B · La trousse
Des règles, pas des planches d’ambiance.
Chaque décision de l’identité est une règle justifiée. Essayez-les : appuyez sur le bouton, changez les coins, changez de mode.
01 // Typo — trois polices, trois rôles
En pilote automatique.
Archivo 800 · 125 % large pour les titres
JOVION est votre agent Web IA, intégré à WordPress — un agent qui comprend votre site Web et agit sur commande.
Inter pour la lecture
100+ capacités // prêtes · WordPress // connecté
IBM Plex Mono pour les étiquettes
02 // Boutons — le filet d’abord
Appuyez et maintenez. Le filet se remplit de cuivre plein, avec une étiquette foncée — le seul moment où le cuivre remplit quoi que ce soit, si bien qu’il signale toujours un changement d’état.
03 // Coins — des repères, pas des ombres
Modifier les éléments Elementor par id PRÊT
Vérifier et prendre un instantané avant PRÊT
Conforme à la marque04 // Couleur — un seul accent
- Cuivre
#CA8459Filets, repères, étiquettes — le seul accent - Cuivre vif
#FABA8EÉtiquettes de boutons et accents sur fond sombre - Cuivre sur clair
#9C5228Le même accent, ajusté pour le blanc - Toile
#030303Le fond presque noir - Encre
#EDE8E3Titres et texte principal - En ligne
#00C853« En ligne » — et rien d’autre
C · Système d’identité
De l’idée à l’identité.
Le logo sur sa grille de construction, la palette et les trois polices — un seul fichier dont le site du produit, l’admin de l’extension et le produit lui-même se servent. Choisissez une couleur pour y voir le logo.
Couleur
Typographie
Aa Titre
Aa Texte — Inter
Aa Étiquette — IBM Plex Mono
D · Les règles
Six règles, sans exception.
- 01Le cuivre, seul accent
- Utilisé comme filet, repère ou étiquette — jamais en décoration — si bien qu’un aplat cuivré signale toujours un changement d’état.
- 02Le vert veut dire en ligne
- Une couleur d’état, un seul rôle. Elle n’apparaît jamais pour autre chose.
- 03Trois polices, trois rôles
- Archivo pour les titres, Inter pour la lecture, IBM Plex Mono pour les étiquettes. Aucune police n’empiète sur le rôle d’une autre.
- 04Carré par défaut
- Les courbes sont réservées et ont un sens : pastilles pour l’état, cercles pour les points, un léger arrondi pour les médias seulement.
- 05Des repères, pas des ombres
- Des équerres cuivrées de 14 px marquent un panneau là où d’autres marques miseraient sur les ombres portées et les coins arrondis.
- 06Des boutons qui changent d’état
- Un filet d’abord — puis un aplat cuivré avec une étiquette foncée quand on appuie. L’interface se comporte comme un interrupteur, pas comme un lien.
E · Ingénierie
Comment c’est bâti.
- 01
La trousse, c’est du code
Un seul fichier lisible par machine contient les jetons de couleur, de typographie, d’arrondi, d’espacement et de composants — chacun avec sa justification.
- 02
Appliquée par le produit
La fonction Design System de JOVION peut charger la trousse : la marque qui vend le produit est une marque que le produit peut faire respecter.
- 03
Deux modes, une structure
Le mode clair garde chaque règle et adopte des cuivres plus profonds, ajustés pour le contraste sur fond blanc.
- 04
Aucune requête parasite
L’extension embarque ses polices, si bien que la marque dans wp-admin ne fait jamais appel à un tiers.
Pile technologique
F · Impact
En chiffres.
- 1
- Accent de marque — le cuivre, rien d’autre
- 3
- Polices, un rôle chacune
- 0px
- Arrondi des coins par défaut
- 2
- Modes issus d’un seul jeu de règles