CAD : direction artistique et design du site de l'infrastructure nationale des données génomiques

Le CAD, Collecteur Analyseur de Données, est un groupement d'intérêt public né du Plan France Médecine Génomique 2025. Il construit une infrastructure nationale et souveraine dédiée à la collecte, au stockage et à l'analyse des données génomiques, pour accompagner le soin et soutenir la recherche vers une médecine personnalisée.

Gemeos, agence web pour la santé, a conçu le look & feel et le design de son site, développé ensuite par NoCode Factory à partir des maquettes.

MacBook Pro ouvert sur l'accueil du CAD « Le CAD : un acteur public au service de la santé de demain »

Parler de données génomiques à un patient, à un chercheur et à un médecin

Le site du CAD s'adresse à trois publics qui n'attendent pas la même chose : le citoyen dont les données sont collectées et qui veut comprendre ses droits, le chercheur qui veut déposer un projet et accéder aux données, le professionnel de santé qui intègre la génomique à sa pratique. Le sujet est sensible, la parole très encadrée, et le CAD est un acteur public : le site devait s'inscrire dans l'écosystème des agences de santé, sobre et institutionnel, sans pour autant paraître administratif.

Gemeos a exploré trois directions artistiques, les a confrontées aux retours de la direction du CAD et de ses parties prenantes, puis a dessiné l'ensemble des pages et un UI kit complet. Chaque maquette a été revue avec l'équipe de développement avant d'être présentée, pour tenir dès la conception les contraintes techniques et de sécurité d'un site qui parle de données de santé.

Industrie: Santé; Saas
Services: DA; UX/UI Design

Les trois pistes de page d'accueil explorées pour le CAD, côte à côte sur fond bleu nuit

Institutionnel, mais pas administratif

Le CAD avait déjà son logo : le mot cad et un symbole en double hélice, fait de nœuds et de liens reliés comme un réseau. Le look & feel part de cette figure. Trois pistes ont été explorées pour la page d'accueil, toutes autour de la même phrase, « La santé du futur s'inscrit dans notre ADN » : une piste claire et lumineuse portée par la photographie, une piste plus éditoriale au rose franc, et une piste sombre bâtie sur une image d'ADN.

Les retours de la direction du CAD ont fixé le cap : un acteur public doit s'inscrire dans l'écosystème des agences de santé. La direction retenue est donc plus sobre, avec moins d'images et des visuels plus petits, un logo et un menu mieux mis en valeur, et les trois parcours par public remontés dès l'accueil. Les nœuds et les liens du symbole se prolongent en un réseau discret, en fond des sections.

La palette reprend les couleurs du logo : un bleu (#002FA7), un bleu nuit (#0C1051), un rose (#E01072) et un vert (#85BD54), déclinés en nuances dans l'UI kit avec une gamme de neutres. Chaque public a sa couleur, du menu aux cartes et aux boutons : bleu pour le citoyen, vert pour la recherche, rose pour les professionnels de santé. Les titres sont composés en Montserrat, les textes et l'interface en DM Sans, les étiquettes en Space Mono.

Piste 1 - La lumière
Un dégradé de bleu très clair, des photographies de soignants dans des cadres arrondis, des boutons en pilule et des cartes aux bords fins. Perception visée : accessible et rassurante, tournée vers le patient.
Piste 2 - L'éditorial
Un titre centré, de grandes photographies de laboratoire, le rose du logo pour les actions et des sections pleines en bleu. Perception visée : scientifique et engagée, avec une vraie présence de marque.
Piste 3 - L'ADN
Un hero sombre sur une image d'ADN, une grille visible et les portes d'entrée par public juste sous le hero. La structure de cette piste a été retenue, puis éclaircie et enrichie de sections de la première pour aller vers le registre sobre et institutionnel du site en ligne.

Piste 1, La lumière : hero clair avec une photographie de soignante et une photographie d'équipe médicale

Concept 1

MacBook Pro ouvert sur le registre des projets du CAD

Trois publics, trois chemins, une même rigueur

Dès l'accueil, le visiteur choisit son profil : citoyen et usager du système de santé, professionnel de la recherche ou professionnel de la santé. Chaque parcours a sa page, sa couleur et ses contenus, et renvoie vers les pages qui servent tout le monde : le registre des projets, la compréhension des données et la procédure d'accès.

Page	Ce qu'elle fait pour le visiteur
Accueil	« Le CAD : un acteur public au service de la santé de demain », les dernières actualités, les trois portes d'entrée par public, la mission, les services et les partenaires
Pages par public	Citoyens et usagers, professionnels de la recherche, professionnels de la santé : ce que le CAD fait pour chacun et les démarches qui le concernent
Registre des projets	Les projets de recherche qui réutilisent les données, avec recherche, filtres par type et par filière, et une fiche par projet
Accéder aux données	La procédure de dépôt d'un projet étape par étape, le calendrier des dépôts et des réunions du comité, les documents à télécharger
Comprendre vos données	À quoi servent les données, où elles sont stockées, comment elles sont protégées, et les réponses aux questions des personnes concernées
Le CAD	Qui sommes-nous, les instances et le comité scientifique et éthique, les marchés publics et les offres d'emploi
Actualités	Les annonces et les événements du CAD, une page par actualité

Les mêmes briques reviennent sur toutes les pages : cartes doublées d'un fin liseré, étiquettes en Space Mono, boutons en pilule, accordéons pour les questions, bandeaux pleins en bleu ou en rose pour les appels à l'action. Le design a été livré avec un UI kit complet (couleurs, typographies desktop et mobile, étiquettes, contrôles, boutons dans leurs trois couleurs et leurs états, en-tête et pied de page) pour que l'équipe de NoCode Factory le développe sans réinterpréter.