Aller au contenu principal

ÌTÌ — Identité de marque & brand guide interactif

Identité de marque & brand guide interactif

Charte de marque d'un torréfacteur de spécialité, consultable en ligne : logo, cinq teintes, trois familles typographiques, ton de marque et applications — un document qui survit sans son auteur.

2025-11
  • Branding & identité visuelle
  • Design system
  • Développement frontend
Next.jsTypeScriptTailwind CSSVercel
Aperçu de ÌTÌ — Identité de marque & brand guide interactif
  1. 01

    Charte navigable en six sections plutôt qu'un PDF qui se périme

  2. 02

    Une section « voix » au même rang que le logo, exemples à l'appui

  3. 03

    Cinq teintes et trois familles typographiques — un système applicable

Le brief

Un torréfacteur de café de spécialité à Abidjan, sur des origines d'Afrique de l'Est — Éthiopie, Rwanda, Burundi — avec des relations directes aux producteurs. La marque avait un nom, un propos et rien d'autre.

La commande n'était pas un logo : c'était le document qui permet à d'autres de fabriquer sans se tromper. Une charte se juge le jour où quelqu'un d'extérieur l'ouvre.

Les contraintes

  • La charte doit survivre sans son auteur. Un imprimeur, un développeur, un photographe doivent y trouver leur réponse sans appeler personne.
  • Une identité de café risque le cliché : sac de jute, grain en gros plan, brun sur brun.
  • Elle doit vivre à l'écran comme sur un sachet — deux supports qui ne pardonnent pas les mêmes approximations.

Les décisions

Une charte navigable plutôt qu'un PDF.

Le livrable est un site en six sections : aperçu, logo, couleurs, typographie, voix, applications. Un PDF de quarante pages se consulte une fois puis se périme dans un dossier partagé. Une page en ligne s'ouvre en trois secondes sur un téléphone, au moment où la question se pose.

Une section « voix » au même rang que le logo.

La plupart des chartes s'arrêtent au visuel. Celle-ci consacre une section entière au ton — précis, chaleureux, sans jargon — avec des exemples de ce qu'on écrit et de ce qu'on n'écrit pas. Une marque se reconnaît autant à sa façon de parler qu'à sa couleur, et c'est la partie que tout le monde improvise.

Cinq teintes, trois familles, et pas une de plus.

Espresso, terracotta, ocre doré, olive, papier clair. Fraunces pour les titres, Hanken Grotesk pour le corps, Space Mono pour les données. Un système restreint est un système qu'on applique ; une palette de douze teintes est une palette qu'on interprète.

Le résultat

Une charte consultable en ligne qui couvre le logotype et son sceau, la palette, les trois familles typographiques, le manifeste en quatre piliers — origine traçable, artisanat, chaleur humaine, transparence — et les applications : packaging, boutique, papeterie, objets.

Ce que je referais autrement

La charte montre les applications, elle ne les rend pas téléchargeables. Un gabarit de sachet et un jeu de logos aux bons formats, en accès direct depuis la page, éviteraient l'essentiel des erreurs de fabrication — celles qui viennent d'un fichier reconstitué à la main par un prestataire pressé.

Médiathèque