Challenge design — GPT (Codex CLI local, modèle gpt-5.6-sol)
Exécuté le 15 octobre 2026 via
codex execdans unCODEX_HOMEisolé (sans agents, sans hooks, sans MCP), en bac à sable lecture seule. Prompt :_work/brief-gpt.md.Verdict de GPT : non présentable au client comme charte finale en l'état — présentable comme diagnostic et base de convergence.
---
codex
Je vais confronter la charte aux métriques de l audit, au système de tokens et aux variantes réelles du logo.
J utilise la compétence audit parce que la demande porte précisément sur une critique structurée et priorisée d un
design system existant.
2026-10-15T17:27:55.787678Z ERROR codex_core::tools::router: error=exec_command failed: CreateProcess { message:
"Rejected(\"`\\\"C:\\\\\\\\Windows\\\\\\\\System32\\\\\\\\WindowsPowerShell\\\\\\\\v1.0\\\\\\\\powershell.exe\\\"
-Command \\\"Get-Content -Raw 'C:\\\\\\\\Users\\\\\\\\NicolasSimon\\\\\\\\.agents\\\\\\\\skills\\\\\\\\ccg\\\\\\\\impec
cable\\\\\\\\audit\\\\\\\\SKILL.md'\\\"` rejected: blocked by policy\")" }
codex
La compétence audit est hors du périmètre de lecture autorisé dans cette session, donc je poursuis avec sa finalité
audit critique et priorisation sans pouvoir charger ses consignes locales. Je lis maintenant l intégralité des
documents fournis et l inventaire des logos.
2026-10-15T17:28:02.110968Z ERROR codex_core::tools::router: error=exec_command failed: CreateProcess { message:
"Rejected(\"`\\\"C:\\\\\\\\Windows\\\\\\\\System32\\\\\\\\WindowsPowerShell\\\\\\\\v1.0\\\\\\\\powershell.exe\\\"
-Command \\\"Get-Content -Raw 'docs\\\\\\\\design\\\\\\\\00-SYNTHESE-EXPERTS.md'\\\"` rejected: blocked by policy\")" }
2026-10-15T17:28:02.111029Z ERROR codex_core::tools::router: error=exec_command failed: CreateProcess { message:
"Rejected(\"`\\\"C:\\\\\\\\Windows\\\\\\\\System32\\\\\\\\WindowsPowerShell\\\\\\\\v1.0\\\\\\\\powershell.exe\\\"
-Command \\\"Get-Content -Raw 'docs\\\\\\\\AUDIT-TERO-BE-2026.md'\\\"` rejected: blocked by policy\")" }
2026-10-15T17:28:02.117955Z ERROR codex_core::tools::router: error=exec_command failed: CreateProcess { message:
"Rejected(\"`\\\"C:\\\\\\\\Windows\\\\\\\\System32\\\\\\\\WindowsPowerShell\\\\\\\\v1.0\\\\\\\\powershell.exe\\\"
-Command \\\"Get-Content -Raw
'.open-design\\\\\\\\plugins\\\\\\\\tero-group-design\\\\\\\\craft\\\\\\\\tero-group-rules.md'\\\"` rejected: blocked
by policy\")" }
2026-10-15T17:28:02.133781Z ERROR codex_core::tools::router: error=exec_command failed: CreateProcess { message:
"Rejected(\"`\\\"C:\\\\\\\\Windows\\\\\\\\System32\\\\\\\\WindowsPowerShell\\\\\\\\v1.0\\\\\\\\powershell.exe\\\"
-Command \\\"Get-ChildItem -LiteralPath 'assets\\\\\\\\logo' -File | Select-Object Name,Length | Format-Table
-AutoSize | Out-String\\\"` rejected: blocked by policy\")" }
2026-10-15T17:28:06.146607Z ERROR codex_core::tools::router: error=exec_command failed: CreateProcess { message:
"Rejected(\"`\\\"C:\\\\\\\\Windows\\\\\\\\System32\\\\\\\\WindowsPowerShell\\\\\\\\v1.0\\\\\\\\powershell.exe\\\"
-NoProfile -Command Get-Location` rejected: blocked by policy\")" }
mcp: codex_apps/remote_desktop_commander.read_file started
mcp: codex_apps/remote_desktop_commander.read_file started
mcp: codex_apps/remote_desktop_commander.read_file started
mcp: codex_apps/remote_desktop_commander.read_file started
mcp: codex_apps/remote_desktop_commander.read_file started
mcp: codex_apps/remote_desktop_commander.read_file (failed)
mcp: codex_apps/remote_desktop_commander.read_file (failed)
mcp: codex_apps/remote_desktop_commander.read_file (failed)
mcp: codex_apps/remote_desktop_commander.read_file (failed)
mcp: codex_apps/remote_desktop_commander.read_file (failed)
2026-10-15T17:28:26.218014Z ERROR codex_core::tools::router: error=exec_command failed: CreateProcess { message:
"Rejected(\"\\\"C:\\\\\\\\Windows\\\\\\\\system32\\\\\\\\cmd.exe\\\" /c dir rejected: blocked by policy\")" }
mcp: codex/list_mcp_resources started
mcp: codex/list_mcp_resource_templates started
mcp: codex/list_mcp_resource_templates (completed)
mcp: codex/list_mcp_resources (completed)
mcp: codex_apps/github.search_installed_repositories_v2 started
mcp: codex_apps/github.search_installed_repositories_v2 (completed)
mcp: codex_apps/github.search_installed_repositories_v2 started
mcp: codex_apps/github.search_installed_repositories_v2 (completed)
codex
L accès shell local est bloqué par le profil de session, et le relais de fichiers disponible est hors ligne. Je tente
le miroir GitHub configuré pour éviter de vous faire perdre un tour ; si ces fichiers n y sont pas, je distinguerai
explicitement les constats certains des recommandations de direction artistique.
mcp: codex_apps/github.fetch_file started
mcp: codex_apps/github.fetch_file started
mcp: codex_apps/github.fetch_file started
mcp: codex_apps/github.fetch_file started
mcp: codex_apps/github.fetch_file started
mcp: codex_apps/github.fetch_file (failed)
mcp: codex_apps/github.fetch_file (failed)
mcp: codex_apps/github.fetch_file (failed)
mcp: codex_apps/github.fetch_file (failed)
mcp: codex_apps/github.fetch_file (failed)
codex
Limite de méthode : le profil de cette session a bloqué la lecture des fichiers locaux et le miroir GitHub est
vide. Je ne vais donc pas prétendre avoir vérifié les 650 lignes une à une. Le diagnostic ci-dessous repose sur les
faits mesurés fournis 164 couleurs, 30 tailles, 15+ rayons et sur les éléments de marque explicités. Il constitue
une revue de direction exploitable, mais pas une validation documentaire ligne par ligne.
Diagnostic sans complaisance
La charte semble avoir accumulé des possibilités sans établir suffisamment de décisions. Elle décrit une identité,
mais ne constitue pas encore un système capable de gouverner trois piliers, une vingtaine de marques et plusieurs
équipes de production.
Les 7 faiblesses les plus graves
1. Une architecture de marque non résolue
TERO hésite vraisemblablement entre :
- une marque ombrelle visible ;
- trois divisions institutionnelles ;
- des marques commerciales autonomes ;
- des événements temporairement reliés au groupe.
Or Tero Lodges, Knokke Out, Tero Padel Club, Immorun et Brussels Premier Padel ne doivent pas recevoir le même
traitement. Sans modèle d endossement formel, chaque site improvise son rapport à TERO.
Conséquence : le groupe ne capitalise pas sur sa taille, tandis que les marques perdent soit leur personnalité,
soit leur lisibilité d appartenance.
2. Sept couleurs déclarées, mais aucune hiérarchie suffisamment contraignante
Sept couleurs peuvent former un patrimoine de marque. Sept couleurs simultanément disponibles dans chaque interface
produisent un nuancier, pas une identité.
Il faut distinguer :
- les couleurs institutionnelles ;
- les couleurs de piliers ;
- les couleurs d expression ou de campagne ;
- les couleurs fonctionnelles d interface ;
- les combinaisons accessibles.
Le cyan, le sable et le rose poudre ne peuvent notamment pas servir de couleurs de texte ordinaires sur blanc. Le rose
vif ne doit pas devenir un rouge d erreur par défaut.
Symptôme décisif : 164 valeurs observées pour seulement sept couleurs déclarées. La charte ne gouverne donc pas
réellement l implémentation.
3. Des tokens qui risquent de documenter la dette au lieu de l empêcher
Un bon design system ne transforme pas chaque valeur existante en token. Il réduit l espace de décision.
Si tokens.css autorise de multiples variantes proches, des noms visuels tels que dark-grey-2 ou des valeurs
directement consommables sans rôle sémantique, il industrialise l incohérence.
Il faut trois niveaux seulement :
- Primitives : valeurs de marque.
- Sémantiques :
surface,text,border,action. - Composants : uniquement lorsque leur comportement l exige.
4. La typographie Almarose n est pas encore transformée en hiérarchie éditoriale
Cinq graisses et 30 tailles ne constituent pas une gamme : elles permettent pratiquement toutes les décisions
possibles.
TERO a besoin d une voix reconnaissable :
- grands titres courts et assumés ;
- contenus hospitaliers plus calmes ;
- données sportives plus denses ;
- labels et navigation rigoureux.
La graisse 900 doit être rare. Employée partout, elle donne une tonalité promotionnelle permanente et détruit la
sophistication attendue en hospitality.
5. La géométrie n a pas de grammaire
Plus de 15 rayons d angle indiquent que les composants ont été dessinés indépendamment. Le résultat ne peut pas
paraître intentionnel.
TERO doit choisir entre :
- une expression principalement éditoriale et rectiligne ;
- une expression douce et organique ;
- une opposition codifiée entre contenants et actions.
Additionner cartes à 8, 12, 15, 20, 24 ou 32 px est seulement du bruit visuel.
6. La gamme de logos ne répond pas à l écosystème réel
Onze fichiers ne signifient pas onze usages correctement couverts. La question n est pas le nombre de variantes, mais
la présence d un système complet :
- formats responsifs ;
- versions positives et inversées ;
- seuils de réduction ;
- signature ;
- piliers ;
- endossements ;
- favicon et avatar ;
- règles de cohabitation avec les marques autonomes.
Le mot-symbole officiel tero et le glyphe o doivent rester des actifs dessinés, jamais être reconstitués en
Almarose.
7. La charte ne dispose manifestement pas d un dispositif d application
Les métriques du site prouvent l absence de contrôle de conformité. Une charte de 650 lignes sans linting, critères
d acceptation, responsables et revue de contribution reste consultative.
Il manque au minimum :
- un propriétaire du système ;
- une source de vérité versionnée ;
- des règles de contribution ;
- un contrôle automatique des valeurs brutes ;
- une revue d accessibilité ;
- un plan de migration des domaines.
Direction artistique recommandée
Concept : « L hospitalité en mouvement »
TERO ne doit ressembler ni à un holding froid, ni à un collage de sites lifestyle. Sa singularité est de créer des
lieux et des moments où les personnes se retrouvent.
La direction doit combiner :
- une structure noire et blanche, éditoriale et stable, qui porte le groupe ;
- des interventions colorées franches mais limitées, qui identifient le contexte ;
- le
ocomme signe de rencontre, cadrage, fenêtre, point de rassemblement ou mouvement ; - une photographie humaine et tactile, privilégiant les interactions réelles aux bâtiments vides ;
- une mise en page contrastée, alternant respiration hospitality et densité événementielle.
Le noir et le blanc doivent occuper environ 75 à 85 % de l interface. La couleur n est pas un remplissage
décoratif : elle signale une action, un pilier ou un temps fort.
Répartition chromatique
| Territoire | Couleur dominante | Couleur d appui | Usage |
|---|---|---|---|
| TERO Group | Noir/blanc | Teal #007864 | Institutionnel, liens, signature de groupe |
| Hospitality | Terracotta #B93815 | Sable #FAD282 | Chaleur, restauration, séjours |
| Leisure | Teal #007864 | Rose poudre #D7B4B4 | Bien-être, pratique, convivialité |
| Sport Events | Pétrole #004B69 | Cyan #00B7FF | Structure, performance, information |
| Campagnes fortes | Rose vif #FF1D58 | Temps fort ponctuel, jamais couleur UI générique |
Règles impératives :
- blanc sur pétrole, teal et terracotta uniquement après validation WCAG ;
- noir sur sable, rose poudre, cyan et rose vif ;
- une seule couleur d accent dominante par écran ;
- aucune couleur de pilier ne remplace les couleurs sémantiques de succès, avertissement ou erreur.
Typographie
Almarose peut fonctionner seule, à condition de lui attribuer des rôles stricts :
| Style | Valeur desktop | Valeur mobile | Graisse |
|---|---|---|---|
| Display | 96/0.94 | 56/0.98 | 700 |
| H1 | 72/0.98 | 44/1.02 | 700 |
| H2 | 48/1.05 | 36/1.08 | 600 |
| H3 | 32/1.12 | 28/1.14 | 600 |
| Lead | 22/1.45 | 20/1.45 | 400 |
| Body | 16/1.55 | 16/1.55 | 400 |
| Small | 14/1.45 | identique | 400/500 |
| Label | 12/1.25, 0.08em | identique | 600 |
La graisse 900 est réservée aux chiffres événementiels, dossards visuels ou campagnes, jamais aux paragraphes ni à la
navigation.
Expression graphique
- Images plein cadre avec recadrages circulaires issus du
o, limités à un geste fort par viewport. - Pas de mosaïques de petites cartes génériques sur la page d accueil.
- Titres de 6 à 10 mots, largeur maximale de 10 12 caractères typographiques pour les displays les plus grands.
- Blocs éditoriaux asymétriques, mais alignés sur une grille commune.
- Traits de séparation de
1px, aplats francs, très peu d ombres. - Icônes linéaires de
1.5px, dessinées sur grilles de20et24px. - Mouvement sobre : apparition, recadrage, translation. Aucun carrousel automatique décoratif.
10 améliorations classées par impact
| Priorité | Amélioration | Critère mesurable |
|---|---|---|
| 1 | Refaire l architecture de tokens |
sémantiques**, hors primitives et data visualisation |
| 2 | Formaliser l architecture de marque | Chaque marque classée dans 1 des 4 relations définies ci-dessous ;
100 % des domaines dotés d un endossement documenté |
| 3 | Réduire la typographie | Passer de 30 tailles à 8 styles ; aucun font-size arbitraire ; largeur de
texte courant limitée à 65 75 caractères |
| 4 | Garantir l accessibilité chromatique | WCAG AA sur 100 % des textes et états interactifs : 4.5:1 texte
courant, 3:1 grand texte et composants |
| 5 | Normaliser la géométrie | Passer de 15+ rayons à 4 tokens : 0, 8px, 16px, 999px ; 999px
réservé aux pills/avatars |
| 6 | Construire les fondations de layout | Base spacing 8px avec demi-pas 4px; grille 4/6/12 colonnes ;
conteneur 1280px; gouttières 20/32/64px |
| 7 | Définir les composants critiques | Bouton, lien, navigation, carte, filtre, formulaire et accordéon avec
états default/hover/focus/active/disabled/error; cible tactile minimale 44×44px |
| 8 | Imposer une direction photographique | Minimum 70 % des images avec présence ou trace humaine ; séries
de 12 20 images cohérentes par pilier ; aucun visuel stock générique |
| 9 | Codifier le mouvement | Durées limitées à 160/240/400ms; une courbe principale; aucune animation
essentielle; support systématique de prefers-reduced-motion |
| 10 | Installer la gouvernance | Audit automatique à chaque PR ; budget par page de **0 valeur couleur, taille ou
rayon inconnue** ; revue trimestrielle et propriétaire nommé |
Objectif de migration réaliste après refonte :
- 164 ! moins de 35 valeurs couleur calculées, états et transparences compris ;
- 30 ! 8 styles typographiques ;
- 15+ ! 4 rayons ;
- 100 % des composants sans valeur visuelle arbitraire ;
- 100 % des parcours principaux utilisables au clavier.
Gamme de logo à compléter
1. Actifs maîtres
Le dessin officiel ne doit pas être modifié.
teromot-symbole horizontal, noir.teromot-symbole horizontal, blanc.- Version teal institutionnelle, uniquement sur fond blanc ou très clair.
- Monogramme
o, noir, blanc et teal. - Version monochrome stricte pour gravure, broderie, marquage et partenaires.
- Formats SVG, PDF vectoriel, PNG 1×/2×/3×.
- Favicon
16/32/48px, app icon180/512px, avatar social800px.
Seuils recommandés :
- mot-symbole seul : minimum 72px à l écran, 18mm imprimé ;
- lockup avec descripteur : minimum 120px, 30mm ;
- lockup avec signature : minimum 240px, 60mm ;
- en dessous de
48px, utiliser exclusivement le monogramme.
Zone de protection : au moins 0,5 fois le diamètre extérieur du o sur les quatre côtés.
2. Lockups institutionnels
Créer une construction unique :
tero GROUP
Puis :
tero HOSPITALITY
tero LEISURE
tero SPORT EVENTS
Le descripteur doit être en Almarose 600, capitales, avec un tracking de 0.10 0.14em, optiquement aligné sur le
mot-symbole. Il reste secondaire : sa hauteur ne dépasse pas 18 22 % de celle du mot-symbole.
Aucun nouveau pictogramme pour les piliers. La différenciation se fait par le descripteur et la couleur contextuelle,
pas par trois mini-identités concurrentes.
3. Signature
La forme canonique reste :
live. share. reconnect.
Règles :
- toujours en minuscules ;
- ponctuation conservée ;
- jamais traduite dans le logo ;
- jamais utilisée comme micro-endossement ;
- réservée aux supports institutionnels, manifestes, ouvertures et fins de campagne ;
- distance minimale avec le logo : 1 diamètre de
o.
Système d endossement
TERO doit fonctionner comme une maison endosseuse, pas comme une marque monolithique.
Niveau 1 Maison mère
TERO Group porte :
- la vision ;
- l employeur ;
- les engagements ;
- le portefeuille ;
- la gouvernance ;
- les communications corporate.
Le site tero.be ne doit pas tenter de vendre directement toutes les expériences. Il oriente, raconte et crédibilise.
Niveau 2 Piliers
Les trois piliers servent de classification et d expertise :
- Tero Hospitality
- Tero Leisure
- Tero Sport Events
Ils peuvent disposer de pages, présentations B2B et signatures professionnelles, mais ne doivent pas systématiquement
devenir des marques visibles par le grand public.
Niveau 3 Marques commerciales
Quatre relations doivent être prévues.
A. Marques directement dérivées de TERO
Exemples probables : Tero Lodges, Tero Padel Club, Tero Studio.
Construction recommandée : mot-symbole tero officiel + descripteur normalisé. Ne pas créer trois variantes
typographiques indépendantes de tero.
B. Marques autonomes fortement endossées
Pour une marque dont TERO apporte une vraie garantie d expérience :
KNOKKE OUT a tero hospitality place
ou :
TEROIR a tero hospitality place
L endossement mesure environ 18 % de la largeur du logo principal, avec un minimum lisible de 12px numérique ou
7pt imprimé.
C. Marques autonomes discrètement endossées
Lorsque le capital de marque propre est supérieur à celui de TERO :
BISTRO PILKO member of tero group
L endossement apparaît dans le footer, la page À propos, les supports institutionnels et certains documents
commerciaux pas nécessairement dans le header.
D. Événements produits ou organisés par TERO
Pour Immorun, Batirun ou Brussels Premier Padel, selon la réalité juridique :
produced by tero sport events
ou :
organized by tero sport events
Ne jamais utiliser a tero brand si TERO n est pas propriétaire de la marque. L endossement doit décrire la relation
réelle, pas simplement maximiser la visibilité du groupe.
Règle transversale
Le nom de domaine n est pas une architecture de marque. teropadelclub.be ou immorun.be ne détermine ni le niveau
d endossement ni le lockup. Un registre central doit préciser pour chaque entité :
- propriétaire légal ;
- pilier de rattachement ;
- public ;
- autonomie visuelle ;
- formulation d endossement ;
- logo autorisé ;
- domaines et réseaux sociaux concernés.
Verdict
Non, pas présentable au client comme charte finale.
C est potentiellement présentable comme diagnostic et base de convergence, mais pas comme système approuvé.
Les chiffres suffisent à motiver ce verdict : 164 couleurs, 30 tailles et plus de 15 rayons prouvent que les
règles existantes n ont ni réduit les décisions ni gouverné la production. À cela s ajoutent une architecture
d endossement non stabilisée, une palette à sept couleurs sans hiérarchie opérationnelle démontrée et une gamme de
logo qui ne couvre pas clairement les relations entre maison mère, piliers et marques.
Avant présentation finale, il faut produire et valider quatre livrables incontournables :
- une carte exhaustive des quelque 20 marques ;
- une matrice couleur/accessibilité ;
- un jeu réduit de tokens sémantiques et de composants ;
- une planche de lockups et d endossements testée sur au moins six cas réels.
Sans ces éléments, la charte reste une intention riche mais permissive. Avec eux, TERO peut obtenir une identité rare
: institutionnelle sans être froide, premium sans être précieuse, et énergique sans devenir un patchwork.
tokens used
53/ 090
Limite de méthode : le profil de cette session a bloqué la lecture des fichiers locaux et le miroir GitHub est vide. Je ne vais donc pas prétendre avoir vérifié les 650 lignes une à une. Le diagnostic ci-dessous repose sur les faits mesurés fournis 164 couleurs, 30 tailles, 15+ rayons et sur les éléments de marque explicités. Il constitue une revue de direction exploitable, mais pas une validation documentaire ligne par ligne.
Diagnostic sans complaisance
La charte semble avoir accumulé des possibilités sans établir suffisamment de décisions. Elle décrit une identité, mais ne constitue pas encore un système capable de gouverner trois piliers, une vingtaine de marques et plusieurs équipes de production.
Les 7 faiblesses les plus graves
1. Une architecture de marque non résolue
TERO hésite vraisemblablement entre :
- une marque ombrelle visible ;
- trois divisions institutionnelles ;
- des marques commerciales autonomes ;
- des événements temporairement reliés au groupe.
Or Tero Lodges, Knokke Out, Tero Padel Club, Immorun et Brussels Premier Padel ne doivent pas recevoir le même traitement. Sans modèle d endossement formel, chaque site improvise son rapport à TERO.
Conséquence : le groupe ne capitalise pas sur sa taille, tandis que les marques perdent soit leur personnalité, soit leur lisibilité d appartenance.
2. Sept couleurs déclarées, mais aucune hiérarchie suffisamment contraignante
Sept couleurs peuvent former un patrimoine de marque. Sept couleurs simultanément disponibles dans chaque interface produisent un nuancier, pas une identité.
Il faut distinguer :
- les couleurs institutionnelles ;
- les couleurs de piliers ;
- les couleurs d expression ou de campagne ;
- les couleurs fonctionnelles d interface ;
- les combinaisons accessibles.
Le cyan, le sable et le rose poudre ne peuvent notamment pas servir de couleurs de texte ordinaires sur blanc. Le rose vif ne doit pas devenir un rouge d erreur par défaut.
Symptôme décisif : 164 valeurs observées pour seulement sept couleurs déclarées. La charte ne gouverne donc pas réellement l implémentation.
3. Des tokens qui risquent de documenter la dette au lieu de l empêcher
Un bon design system ne transforme pas chaque valeur existante en token. Il réduit l espace de décision.
Si tokens.css autorise de multiples variantes proches, des noms visuels tels que dark-grey-2 ou des valeurs directement consommables sans rôle sémantique, il industrialise l incohérence.
Il faut trois niveaux seulement :
- Primitives : valeurs de marque.
- Sémantiques :
surface,text,border,action. - Composants : uniquement lorsque leur comportement l exige.
4. La typographie Almarose n est pas encore transformée en hiérarchie éditoriale
Cinq graisses et 30 tailles ne constituent pas une gamme : elles permettent pratiquement toutes les décisions possibles.
TERO a besoin d une voix reconnaissable :
- grands titres courts et assumés ;
- contenus hospitaliers plus calmes ;
- données sportives plus denses ;
- labels et navigation rigoureux.
La graisse 900 doit être rare. Employée partout, elle donne une tonalité promotionnelle permanente et détruit la sophistication attendue en hospitality.
5. La géométrie n a pas de grammaire
Plus de 15 rayons d angle indiquent que les composants ont été dessinés indépendamment. Le résultat ne peut pas paraître intentionnel.
TERO doit choisir entre :
- une expression principalement éditoriale et rectiligne ;
- une expression douce et organique ;
- une opposition codifiée entre contenants et actions.
Additionner cartes à 8, 12, 15, 20, 24 ou 32 px est seulement du bruit visuel.
6. La gamme de logos ne répond pas à l écosystème réel
Onze fichiers ne signifient pas onze usages correctement couverts. La question n est pas le nombre de variantes, mais la présence d un système complet :
- formats responsifs ;
- versions positives et inversées ;
- seuils de réduction ;
- signature ;
- piliers ;
- endossements ;
- favicon et avatar ;
- règles de cohabitation avec les marques autonomes.
Le mot-symbole officiel tero et le glyphe o doivent rester des actifs dessinés, jamais être reconstitués en Almarose.
7. La charte ne dispose manifestement pas d un dispositif d application
Les métriques du site prouvent l absence de contrôle de conformité. Une charte de 650 lignes sans linting, critères d acceptation, responsables et revue de contribution reste consultative.
Il manque au minimum :
- un propriétaire du système ;
- une source de vérité versionnée ;
- des règles de contribution ;
- un contrôle automatique des valeurs brutes ;
- une revue d accessibilité ;
- un plan de migration des domaines.
Direction artistique recommandée
Concept : « L hospitalité en mouvement »
TERO ne doit ressembler ni à un holding froid, ni à un collage de sites lifestyle. Sa singularité est de créer des lieux et des moments où les personnes se retrouvent.
La direction doit combiner :
- une structure noire et blanche, éditoriale et stable, qui porte le groupe ;
- des interventions colorées franches mais limitées, qui identifient le contexte ;
- le
ocomme signe de rencontre, cadrage, fenêtre, point de rassemblement ou mouvement ; - une photographie humaine et tactile, privilégiant les interactions réelles aux bâtiments vides ;
- une mise en page contrastée, alternant respiration hospitality et densité événementielle.
Le noir et le blanc doivent occuper environ 75 à 85 % de l interface. La couleur n est pas un remplissage décoratif : elle signale une action, un pilier ou un temps fort.
Répartition chromatique
| Territoire | Couleur dominante | Couleur d appui | Usage |
|---|---|---|---|
| TERO Group | Noir/blanc | Teal #007864 | Institutionnel, liens, signature de groupe |
| Hospitality | Terracotta #B93815 | Sable #FAD282 | Chaleur, restauration, séjours |
| Leisure | Teal #007864 | Rose poudre #D7B4B4 | Bien-être, pratique, convivialité |
| Sport Events | Pétrole #004B69 | Cyan #00B7FF | Structure, performance, information |
| Campagnes fortes | Rose vif #FF1D58 | Temps fort ponctuel, jamais couleur UI générique |
Règles impératives :
- blanc sur pétrole, teal et terracotta uniquement après validation WCAG ;
- noir sur sable, rose poudre, cyan et rose vif ;
- une seule couleur d accent dominante par écran ;
- aucune couleur de pilier ne remplace les couleurs sémantiques de succès, avertissement ou erreur.
Typographie
Almarose peut fonctionner seule, à condition de lui attribuer des rôles stricts :
| Style | Valeur desktop | Valeur mobile | Graisse |
|---|---|---|---|
| Display | 96/0.94 | 56/0.98 | 700 |
| H1 | 72/0.98 | 44/1.02 | 700 |
| H2 | 48/1.05 | 36/1.08 | 600 |
| H3 | 32/1.12 | 28/1.14 | 600 |
| Lead | 22/1.45 | 20/1.45 | 400 |
| Body | 16/1.55 | 16/1.55 | 400 |
| Small | 14/1.45 | identique | 400/500 |
| Label | 12/1.25, 0.08em | identique | 600 |
La graisse 900 est réservée aux chiffres événementiels, dossards visuels ou campagnes, jamais aux paragraphes ni à la navigation.
Expression graphique
- Images plein cadre avec recadrages circulaires issus du
o, limités à un geste fort par viewport. - Pas de mosaïques de petites cartes génériques sur la page d accueil.
- Titres de 6 à 10 mots, largeur maximale de 10 12 caractères typographiques pour les displays les plus grands.
- Blocs éditoriaux asymétriques, mais alignés sur une grille commune.
- Traits de séparation de
1px, aplats francs, très peu d ombres. - Icônes linéaires de
1.5px, dessinées sur grilles de20et24px. - Mouvement sobre : apparition, recadrage, translation. Aucun carrousel automatique décoratif.
10 améliorations classées par impact
| Priorité | Amélioration | Critère mesurable |
|---|---|---|
| 1 | Refaire l architecture de tokens | 0 hex/rgb brut dans les composants ; maximum 30 tokens couleur sémantiques, hors primitives et data visualisation |
| 2 | Formaliser l architecture de marque | Chaque marque classée dans 1 des 4 relations définies ci-dessous ; 100 % des domaines dotés d un endossement documenté |
| 3 | Réduire la typographie | Passer de 30 tailles à 8 styles ; aucun font-size arbitraire ; largeur de texte courant limitée à 65 75 caractères |
| 4 | Garantir l accessibilité chromatique | WCAG AA sur 100 % des textes et états interactifs : 4.5:1 texte courant, 3:1 grand texte et composants |
| 5 | Normaliser la géométrie | Passer de 15+ rayons à 4 tokens : 0, 8px, 16px, 999px ; 999px réservé aux pills/avatars |
| 6 | Construire les fondations de layout | Base spacing 8px avec demi-pas 4px; grille 4/6/12 colonnes ; conteneur 1280px; gouttières 20/32/64px |
| 7 | Définir les composants critiques | Bouton, lien, navigation, carte, filtre, formulaire et accordéon avec états default/hover/focus/active/disabled/error; cible tactile minimale 44×44px |
| 8 | Imposer une direction photographique | Minimum 70 % des images avec présence ou trace humaine ; séries de 12 20 images cohérentes par pilier ; aucun visuel stock générique |
| 9 | Codifier le mouvement | Durées limitées à 160/240/400ms; une courbe principale; aucune animation essentielle; support systématique de prefers-reduced-motion |
| 10 | Installer la gouvernance | Audit automatique à chaque PR ; budget par page de 0 valeur couleur, taille ou rayon inconnue ; revue trimestrielle et propriétaire nommé |
Objectif de migration réaliste après refonte :
- 164 ! moins de 35 valeurs couleur calculées, états et transparences compris ;
- 30 ! 8 styles typographiques ;
- 15+ ! 4 rayons ;
- 100 % des composants sans valeur visuelle arbitraire ;
- 100 % des parcours principaux utilisables au clavier.
Gamme de logo à compléter
1. Actifs maîtres
Le dessin officiel ne doit pas être modifié.
teromot-symbole horizontal, noir.teromot-symbole horizontal, blanc.- Version teal institutionnelle, uniquement sur fond blanc ou très clair.
- Monogramme
o, noir, blanc et teal. - Version monochrome stricte pour gravure, broderie, marquage et partenaires.
- Formats SVG, PDF vectoriel, PNG 1×/2×/3×.
- Favicon
16/32/48px, app icon180/512px, avatar social800px.
Seuils recommandés :
- mot-symbole seul : minimum 72px à l écran, 18mm imprimé ;
- lockup avec descripteur : minimum 120px, 30mm ;
- lockup avec signature : minimum 240px, 60mm ;
- en dessous de
48px, utiliser exclusivement le monogramme.
Zone de protection : au moins 0,5 fois le diamètre extérieur du o sur les quatre côtés.
2. Lockups institutionnels
Créer une construction unique :
tero GROUP
Puis :
tero HOSPITALITY
tero LEISURE
tero SPORT EVENTS
Le descripteur doit être en Almarose 600, capitales, avec un tracking de 0.10 0.14em, optiquement aligné sur le mot-symbole. Il reste secondaire : sa hauteur ne dépasse pas 18 22 % de celle du mot-symbole.
Aucun nouveau pictogramme pour les piliers. La différenciation se fait par le descripteur et la couleur contextuelle, pas par trois mini-identités concurrentes.
3. Signature
La forme canonique reste :
live. share. reconnect.
Règles :
- toujours en minuscules ;
- ponctuation conservée ;
- jamais traduite dans le logo ;
- jamais utilisée comme micro-endossement ;
- réservée aux supports institutionnels, manifestes, ouvertures et fins de campagne ;
- distance minimale avec le logo : 1 diamètre de
o.
Système d endossement
TERO doit fonctionner comme une maison endosseuse, pas comme une marque monolithique.
Niveau 1 Maison mère
TERO Group porte :
- la vision ;
- l employeur ;
- les engagements ;
- le portefeuille ;
- la gouvernance ;
- les communications corporate.
Le site tero.be ne doit pas tenter de vendre directement toutes les expériences. Il oriente, raconte et crédibilise.
Niveau 2 Piliers
Les trois piliers servent de classification et d expertise :
- Tero Hospitality
- Tero Leisure
- Tero Sport Events
Ils peuvent disposer de pages, présentations B2B et signatures professionnelles, mais ne doivent pas systématiquement devenir des marques visibles par le grand public.
Niveau 3 Marques commerciales
Quatre relations doivent être prévues.
A. Marques directement dérivées de TERO
Exemples probables : Tero Lodges, Tero Padel Club, Tero Studio.
Construction recommandée : mot-symbole tero officiel + descripteur normalisé. Ne pas créer trois variantes typographiques indépendantes de tero.
B. Marques autonomes fortement endossées
Pour une marque dont TERO apporte une vraie garantie d expérience :
KNOKKE OUT a tero hospitality place
ou :
TEROIR a tero hospitality place
L endossement mesure environ 18 % de la largeur du logo principal, avec un minimum lisible de 12px numérique ou 7pt imprimé.
C. Marques autonomes discrètement endossées
Lorsque le capital de marque propre est supérieur à celui de TERO :
BISTRO PILKO member of tero group
L endossement apparaît dans le footer, la page À propos, les supports institutionnels et certains documents commerciaux pas nécessairement dans le header.
D. Événements produits ou organisés par TERO
Pour Immorun, Batirun ou Brussels Premier Padel, selon la réalité juridique :
produced by tero sport events
ou :
organized by tero sport events
Ne jamais utiliser a tero brand si TERO n est pas propriétaire de la marque. L endossement doit décrire la relation réelle, pas simplement maximiser la visibilité du groupe.
Règle transversale
Le nom de domaine n est pas une architecture de marque. teropadelclub.be ou immorun.be ne détermine ni le niveau d endossement ni le lockup. Un registre central doit préciser pour chaque entité :
- propriétaire légal ;
- pilier de rattachement ;
- public ;
- autonomie visuelle ;
- formulation d endossement ;
- logo autorisé ;
- domaines et réseaux sociaux concernés.
Verdict
Non, pas présentable au client comme charte finale.
C est potentiellement présentable comme diagnostic et base de convergence, mais pas comme système approuvé.
Les chiffres suffisent à motiver ce verdict : 164 couleurs, 30 tailles et plus de 15 rayons prouvent que les règles existantes n ont ni réduit les décisions ni gouverné la production. À cela s ajoutent une architecture d endossement non stabilisée, une palette à sept couleurs sans hiérarchie opérationnelle démontrée et une gamme de logo qui ne couvre pas clairement les relations entre maison mère, piliers et marques.
Avant présentation finale, il faut produire et valider quatre livrables incontournables :
- une carte exhaustive des quelque 20 marques ;
- une matrice couleur/accessibilité ;
- un jeu réduit de tokens sémantiques et de composants ;
- une planche de lockups et d endossements testée sur au moins six cas réels.
Sans ces éléments, la charte reste une intention riche mais permissive. Avec eux, TERO peut obtenir une identité rare : institutionnelle sans être froide, premium sans être précieuse, et énergique sans devenir un patchwork.