Metrik ai

Interne · non indexéInternal · not indexed

Système de design & plan du siteDesign system & site map

La mini-charte du site v1 (livrable n° 2) et la carte des sections de chaque page. Cette page n'est pas dans la navigation publique. The v1 mini brand sheet (deliverable #2) and the section map of every page. This page is not in the public navigation.

01

Plan du site — cinq pages publiquesSite map — five public pages

Chaque page existe en FR et EN (§09). Deux pages de service s'y ajoutent : confidentialité (exigée au lancement) et cette page-ci. Every page exists in FR and EN (§09). Two service pages sit alongside: privacy (required at launch) and this one.

01 · index.html

AccueilHome

Passe le test des dix secondes.Passes the ten-second test.

  • H Héro — tagline, promesse, énoncé complet, pour qui, 2 CTA, et la règle de preuve : le test des dix secondes tient dans un écranHero — tagline, promise, one-liner, for whom, 2 CTAs, and the proof rail: the ten-second test fits in one screen
  • 01 Reconnaissance du constructeur interneRecognition of the internal builder
  • 02 Les quatre niveaux (interactif)The four levels (interactive)
  • 03 Trois gestes : mesurer, transférer, formerThree moves: measure, transfer, train
  • 04 La même promesse, trois lecteurs (§08)The same promise, three buyers (§08)
  • 05 Aperçu des quatre phases + bandeFour-phase preview + band
  • 06 Preuve Isobloc — le chiffre attribuéIsobloc proof — the attributed figure
  • 07 Pour qui / pas pour quiWho it's for / not for
  • 08 Aperçu de l'équipe + « premier partenaire au Québec »Team preview + “first partner in Québec”
  • · Bandeau de conversionCTA band

Les quatre lecteurs du §03 : propriétaire-dirigeant, VP Opérations et constructeur en section 04 ; examinateur Anthropic par la règle de preuve du héro et la section 08. Sort vers : Approche (01, 05), Étude de cas (06), Équipe (08), Contact (héro + bandeau). Ne contient jamais : Agence 3A (§10). §03's four readers: owner-president, VP Ops and builder in section 04; Anthropic reviewer via the hero proof rail and section 08. Links out to: Approach (01, 05), Case study (06), Team (08), Contact (hero + band). Never contains: Agence 3A (§10).

02 · approche.html

ApprocheApproach

L'outil de conversion (§02).The conversion device (§02).

  • H Héro sombre — « une échelle, pas un grand projet »Dark hero — “a ladder, not one big project”
  • 01 Les quatre phases + la bande de gouvernanceThe four phases + the governance band
  • 02 Ce que comprend l'évaluation (prix publié)What the assessment includes (price published)
  • 03 Phases ↔ niveaux + calendrier 12 moisPhases ↔ levels + 12-month timeline
  • 04 Nous appliquons ce que nous vendonsWe practise what we sell
  • 05 Objections — six questionsObjections — six questions
  • · Bandeau de conversionCTA band

Sort vers : Contact (héro + bandeau), Étude de cas, Confidentialité (objection « données »). Links out to: Contact (hero + band), Case study, Privacy (the “data” objection).

03 · isobloc.html

Étude de casCase study

La preuve pour l'examinateur (§11).Proof for the reviewer (§11).

  • H Héro — « quatre personnes… » (ligne réservée)Hero — “four people…” (reserved line)
  • · Règle de faits — entreprise, secteur, lieu, nomFact rail — company, sector, place, name
  • 01 L'entreprise (sans « avant »)The company (no “before”)
  • 02 Ce que nous avons fait, vague par vagueWhat we did, wave by wave
  • 03 Du niveau 1 au niveau 3From level 1 to level 3
  • 04 Le chiffre, attribué à Eric DionneThe figure, attributed to Eric Dionne
  • 05 Ses mots — 1 ou 2 citationsIn his words — 1 or 2 quotes
  • 06 Ce qui leur appartient maintenantWhat is theirs now
  • 07 Le PDF d'une page (ancre #pdf)The one-pager PDF (anchor #pdf)
  • · Bandeau de conversionCTA band

Sort vers : Approche (02 et bandeau), Contact. Entrée depuis : Accueil 05, pied de page de chaque page, communiqué de presse. Links out to: Approach (02 and band), Contact. Entered from: Home 05, every page footer, the press release.

04 · equipe.html

ÉquipeTeam

Le test du constructeur (§11).The builder test (§11).

  • H Héro — « deux personnes, vous les aurez toutes les deux »Hero — “two people, you get both”
  • 01 Anaïs — portrait, rôle, ce qu'elle possèdeportrait, role, what she owns
  • 02 Omar — portrait, rôle, ce qu'il possèdeportrait, role, what he owns
  • 03 Conseiller (conditionnel — §12)Advisor (conditional — §12)
  • 04 Comment nous travaillons — six règlesHow we work — six rules
  • 05 Ce qui nous qualifie + emplacement Agence 3AWhat qualifies us + Agence 3A slot
  • · Bandeau de conversionCTA band

Seul endroit où la référence à Agence 3A peut apparaître, si l'option « une ligne » est retenue (§12). The only place the Agence 3A reference may appear, if the “one line” option is chosen (§12).

05 · contact.html

Contact

Le test d'achat (§11).The buy test (§11).

  • H Héro — ce que contient l'évaluationHero — what the assessment contains
  • 01 Trois étapes + formulaire, côte à côteThree steps + form, side by side
  • · Contact direct — les deux courrielsDirect contact — both e-mails
  • 02 Pas prêt ? → Approche, Isobloc, ÉquipeNot ready? → Approach, Isobloc, Team

Entrée depuis : le bouton de l'en-tête sur les 4 autres pages, tous les bandeaux de conversion. Ne se termine jamais en cul-de-sac : la section 02 renvoie vers les trois autres pages. Entered from: the header button on all 4 other pages, every CTA band. Never a dead end: section 02 sends the visitor back to the other three pages.

· presse.html

Espace pressePress kit

Le quatrième lecteur du §03.§03's fourth reader.

  • H Héro — « premier partenaire établi au Québec », en hautHero — “first Québec-based partner”, up top
  • 01 Notice — FR et EN affichées ensembleBoilerplate — FR and EN shown together
  • 02 Ce que Metrik ai n'est pasWhat Metrik ai is not
  • 03 Fiche de faitsFact sheet
  • 04 Les personnes — titres exactsThe people — exact titles
  • 05 Visuels, avec statut honnêteAssets, with honest status
  • 06 Contact pressePress contact

Seule page où les deux langues s'affichent en même temps : un journaliste doit pouvoir reprendre l'une ou l'autre sans manipuler le sélecteur. Entrée depuis : pied de page (Ressources), communiqué de presse. The one page where both languages show at once: a journalist must be able to lift either without operating the toggle. Entered from: footer (Resources), the press release.

· confidentialite.html

Confidentialité & Loi 25Privacy & Law 25

Exigée au lancement (§10).Required at launch (§10).

  • 01 Ce que nous collectonsWhat we collect
  • 02 PourquoiWhy
  • 03 ConservationRetention
  • 04 Où résident les donnéesWhere the data lives
  • 05 Vos droits (ancre #loi25)Your rights (anchor #loi25)
  • 06 Responsable désignéDesignated officer
  • 07 Témoins — il n'y en a pasCookies — there are none
  • 08 Données de nos clientsOur clients' data

Entrée depuis : pied de page (2 liens), consentement du formulaire, objection « données » de l'Approche. Entered from: footer (2 links), the form's consent line, the Approach “data” objection.

02

LogotypeWordmark

Metrik porte le poids ; ai est présent, discret, subordonné — plus léger, légèrement plus petit, même ligne de base. L'espace est conservé. Le k a de l'air autour de lui. Metrik carries the weight; ai is present, quiet, subordinate — lighter, slightly smaller, same baseline. The space is kept. The k is given room.

Metrik ai

Sur chalkOn chalk

Metrik ai

Sur graphiteOn graphite

OrthographeSpelling

  • Metrik ai — M majuscule, ai minuscule, une espace entre les deux.Metrik ai — capital M, lowercase ai, a space between.
  • Jamais « Metrik AI », « Metrikai » ou « Metric AI ».Never “Metrik AI”, “Metrikai” or “Metric AI”.
  • Domaine et courriels restent metrikai.ca ; c'est le logotype qui porte l'espace.Domain and e-mail stay metrikai.ca; the wordmark carries the space.

Le symboleThe mark

À dériver de la mesure : une échelle, des graduations, une jauge, une ligne de calibration. Doit fonctionner à 16 px, en une seule couleur, et en réserve — et rester lisible sans le logotype à côté. To be derived from measurement: a scale, tick marks, a gauge, a calibration line. Must work at 16 px, in one colour, and reversed — and still read without the wordmark beside it.

À proscrire : cerveau, puce, circuit, hexagone, bulle de dialogue, orbite, étincelle ou étoile, i-minuscule-en-personnage, blob dégradé. Do not use: a brain, a chip, a circuit, a hexagon, a speech bubble, an orbit, a spark or star, a lowercase-i-as-person, any gradient blob.

§05 — Le symbole n'est pas dessiné dans ce prototype : c'est le livrable n° 1, dû le 5 sept.

03

Palette — territoire InstrumentPalette — Instrument territory

Le chalk domine sur le site ; le graphite est pour les en-têtes et les panneaux. L'ambre ne sert qu'à un seul chiffre par écran. Chalk dominates on the site; graphite is for headers and panels. Amber is reserved for a single figure per screen.

Graphite

#202226

Texte, en-têtes, panneauxText, headers, panels

Chalk

#F3F2EE

Fond dominantDominant ground

Verdigris

#2F7F78

Règles, remplissages, marquesRules, fills, marks

Gauge

#C98A22

Un chiffre, sur graphiteOne figure, on graphite

Dérivés accessiblesAccessible derivatives

Le verdigris de base atteint 4,23:1 sur chalk — sous le seuil. Deux dérivés le corrigent sans changer le territoire. Base verdigris measures 4.23:1 on chalk — below threshold. Two derivatives fix that without changing the territory.

JetonToken Hex SurOn ContrasteContrast UsageUse
--ink#202226chalk14.2:1Texte courantBody text
--ink-muted#5A5C60chalk5.9:1Texte secondaireSecondary text
--verdigris-ink#2A7168chalk5.1:1Liens, libellés accentuésLinks, accent labels
--verdigris-light#5FB3A9graphite6.5:1Accent sur fond sombreAccent on dark
--gauge#C98A22graphite5.4:1Le chiffre mis en avantThe highlighted figure
--gauge#C98A22chalk2.6:1Interdit pour du texte — remplissages seulementNever for text — fills only
§06 + §10 — Aucun navy #1C2B4A, aucun rouge signal #C8102E, aucune Playfair Display, aucune Open Sans comme police de marque : séparation stricte d'avec Agence 3A. Les territoires Blueprint et Ledger ne sont pas implémentés ici — le prototype engage Instrument.

04

Typographie — deux familles, trois rôlesTypography — two families, three roles

Chaque spécimen est testé avec « Fondation », « Déploiement », « télémétrie » et un nombre à 12 chiffres, comme demandé au §06. Every specimen is tested with « Fondation », « Déploiement », « télémétrie » and a 12-digit figure, as required in §06.

Display · Schibsted Grotesk 700 · titresheadlines

Fondation · Déploiement · télémétrie · 384 207 916 550

Candidats à tester avant arrêt définitif : Schibsted Grotesk, Familjen Grotesk, Hanken Grotesk, Instrument Sans. Ni Inter, ni Space Grotesk, ni Helvetica.Candidates to test before locking: Schibsted Grotesk, Familjen Grotesk, Hanken Grotesk, Instrument Sans. Not Inter, not Space Grotesk, not Helvetica.

Body · IBM Plex Sans 400/600 · texte courant, 17 pxbody copy, 17px

Nous transformons l'IA que vos équipes utilisent déjà chacune de leur côté en une capacité d'entreprise gouvernée, mesurée et transférable — un département à la fois, avec vos propres gens formés pour la faire vivre.

Diacritiques françaises complètes et vraie italique. Taille minimale 16 px sur le web, 11 pt à l'impression.Full French diacritics and a true italic. Minimum 16 px on web, 11 pt in print.

Mono · IBM Plex Mono 400/500 · chiffres, niveaux, libellésfigures, levels, labels

NIVEAU 01 · 02 · 03 · 04  |  60 000 $ / an  |  384 207 916 550

Chiffres tabulaires activés partout (font-variant-numeric: tabular-nums) pour que les colonnes s'alignent.Tabular numerals on everywhere (font-variant-numeric: tabular-nums) so columns align.

§07 — Contrainte de longueur : « Diagnostic multidépartemental » fait 28 caractères. Aucun bouton, onglet ou en-tête de colonne n'a de largeur fixe dans ce prototype.

05

L'échelle et les composantsThe scale and the components

Le motif de graduation sert à structurer, jamais à décorer : une règle doit séparer quelque chose. The tick motif is used for structure, never decoration: a rule must separate something.

Graduation fine — sous les titres de sectionFine ticks — under section headings

Graduation majeure — bords de sectionMajor ticks — section edges

Graduation accentuée — colonne « oui »Accent ticks — the “yes” column

Panneau à chiffre — un seul par écranFigure panel — one per screen

60 000 $$60,000

par an, produit à l'interne.a year, produced in-house.

Estimation d'Eric Dionne, IsoblocEric Dionne's own estimate, Isobloc

Le dispositif à quatre niveauxThe four-level device

Deux variantes du même composant : interactive sur l'accueil, compacte partout ailleurs — sur le site, dans chaque évaluation et dans chaque proposition. Two variants of one component: interactive on the home page, compact everywhere else — on the site, in every assessment and in every proposal.

01NavigateurBrowser
02ÉquipeTeam
03ConnectéConnected
04AgentsAgents

Boutons et liensButtons and links

Action principalePrimary action Action secondaireSecondary action Lien de continuationContinuation link

06

Ce qu'on fait, ce qu'on ne fait pasDo and don't

On faitDo

  • Des angles droits, des filets d'un pixel, aucune ombre portée.Square corners, one-pixel rules, no drop shadows.
  • Un seul chiffre mis en avant par écran, avec sa source.One highlighted figure per screen, with its source.
  • Des photos réelles de personnes réelles dans des lieux réels — sinon, le schéma.Real photos of real people in real places — otherwise, the diagram.
  • Le français d'abord, l'anglais complet, jamais une traduction sentie.French first, complete English, never a translated feel.

On ne fait pasDon't

  • Dégradés violet-bleu, orbes lumineux, champs de particules, réseaux « neuronaux ».Purple-to-blue gradients, glowing orbs, particle fields, “neural” line networks.
  • Photos de banque : doigts sur écrans, poignées de main, hologrammes.Stock photography: fingers on screens, handshakes, holograms.
  • Émojis en marqueurs de section ; cartes arrondies à filet coloré partout.Emoji as section markers; rounded cards with coloured rails on everything.
  • Fond crème + display serif + accent terracotta — le défaut du design généré.Cream ground + serif display + terracotta accent — the default of generated design.
  • Quoi que ce soit du système Agence 3A.Anything from the Agence 3A system.

07

Les six tests, avant la remiseThe six tests, before hand-off

Dix secondesTen seconds

Sur l'accueil : peut-on dire ce qu'on fait, pour qui, et nommer la preuve ?On the home page: can they say what we do, for whom, and name the proof?

L'achatThe buy

Un dirigeant québécois avec 50 k$ réserverait-il un appel ? Qu'est-ce qui l'arrêterait ?Would a Québec owner with a $50K budget book a call? What would stop them?

L'examinateurThe reviewer

En anglais : est-ce une vraie firme, avec un vrai client et une vraie méthode ?In English: a real firm, with a real client and a real method?

Le constructeurThe builder

Se sent-il reconnu ou accusé ? Chaque image et chaque titre doivent passer ce test.Recognized or accused? Every image and headline must pass this.

La confusionThe confusion

Côte à côte avec une page Agence 3A : personne ne doit croire que c'est la même entreprise.Beside an Agence 3A page: nobody should think it's the same company.

Le françaisThe French

Lire la version française en premier, en lecteur francophone. Rien ne doit sonner traduit.Read the French version first, as a French reader. Nothing may read as translated.