2 / 16
Do Corp

Do Corp est née chez SP Formation pour automatiser le référencement par l'IA, y compris pour les moteurs conversationnels (le LLMO). Pendant un an, j'ai fait partie de l'équipe technique de trois personnes qui a construit le moteur. À deux mois et demi du lancement, prévu le 1er janvier 2026, le constat était clair : la technologie marchait, mais l'interface n'avait ni identité ni ergonomie. On m'a confié la direction artistique et l'UX/UI, avec une alternante en graphisme à encadrer. C'est devenu le sujet de mon mémoire de Master.
Comment concevoir une identité et un design system pour une plateforme automatisée, qui concilient une accessibilité stricte avec une esthétique innovante et rassurante, pour des utilisateurs très différents ?
Trouver la place libre
J'ai placé le marché sur deux axes : SEO classique ou LLMO, outil d'expert ou outil accessible. Les experts sont tenus par Semrush et Ahrefs, l'accessible par Yoast et RankMath, l'innovation par des API sans interface. Restait une case vide : l'innovation accessible. Do Corp s'y installe, avec une promesse simple : rendre l'IA du référencement compréhensible pour tous, sans brider les pros.
Deux utilisateurs que tout oppose
Marie, 34 ans, gère une boutique en ligne : elle veut du SEO sans jargon, guidé et rassurant. Thomas, 29 ans, est responsable SEO en agence : il veut des raccourcis, des exports et une interface qui répond en moins de 100 ms. Règle d'arbitrage : la couche visible par défaut sert Marie ; tout ce dont Thomas a besoin reste disponible, mais se déplie à la demande (divulgation progressive).
Un benchmark mesuré, pas ressenti
Dix interfaces analysées (formes, couleurs, typographie, style) et leur accessibilité mesurée avec Lighthouse. Écartés : la densité de Semrush (78/100), le brutalisme de Gov.uk (100/100 mais austère), le multicolore de Figma. Retenus : les filets fins et les ombres diffuses de Stripe (98/100), la chaleur de Claude, le dégradé bleu-violet de RankMath (88/100).

Des courbes pour rassurer
Les angles vifs évoquent la rigidité, les courbes rassurent (le « biais de contour » de Lidwell). Le monogramme « do » est donc fait de cercles parfaits et d'un seul trait continu. Premier lettrage : « DO CORP » tout en capitales. Trop autoritaire pour Marie. Version finale : « Do Corp » en Cal Sans, plus conversationnel.
- texte sur fond (AAA)
- 16,4:1
- bleu d'action (AA)
- 5,6:1
- accessibilité (Lighthouse)
- 94/100
- zone cliquable minimale
- 44 px
L'accessibilité comme règle de départ
WCAG 2.1 AA et RGAA 4.1 n'ont pas servi de vérification finale : ils ont dicté les choix. Le gris bleuté très clair que j'aimais pour les textes secondaires plafonnait à 3:1 ; il est parti. Sans nuances subtiles, la hiérarchie passe par le vide, les écarts d'échelle typographique et la forme des composants. C'est cette contrainte qui a produit le minimalisme de la marque.
Couleurs : bleu d'action #2558E5 pour tout ce qui se clique, violet d'innovation #7F2CCB pour l'IA, et un dégradé à 35° avec un palier indigo #5D4AED à 50 % pour éviter le gris terne au milieu. Fond blanc cassé, texte gris foncé plutôt que noir.


Direct-to-Code
Pas de maquettes haute fidélité : la charte a été écrite comme des design tokens (grille de 8 px, échelle typographique, couleurs du dégradé), puis intégrée directement en React. Le risque : moins de support pour faire valider la direction. Le gain : l'accessibilité vérifiée sur le vrai navigateur, à chaque étape, avec Lighthouse. Côté équipe, briefs écrits, moodboards et validation par étapes pour transmettre la direction à une alternante de première année.

Sur les réseaux et en vidéo
La charte se décline sur Instagram et LinkedIn, et dans une pub en motion design réalisée sous After Effects : « Do Corp parle LLMO », du sujet à l'article, jusqu'à « vu par les IA, trouvé sur Google ».
Ce que j'en retiens
L'accessibilité et l'innovation visuelle ne s'opposent pas, à condition que l'une structure l'autre dès le départ. Et en passant du code au design, j'ai compris qu'une technologie, aussi puissante soit-elle, ne vaut rien si personne ne comprend son interface.
Outils
Illustrator · Figma · After Effects · React · Vite · TypeScript · Tailwind CSS · Framer Motion · Lighthouse · Notion
Liens
Documents
Crédits
- Rôle
- Direction artistique, UX/UI & intégration front-end
- Période
- 2 mois et demi (fin 2025)
- Client
- Do Corp








