CONCEPTConcept — pas une commande client

VITON13MEDICINE : site concept d’une biotech fictive qui cherche des médicaments par l’IA

Un concept que VITON13 a réalisé pour montrer son éventail : le site d’une entreprise fictive qui cherche des candidats-médicaments grâce à l’IA, avec son équipe IA à Lisbonne et un laboratoire humide à Bâle. Les cinq programmes présentés sont fictifs et précliniques, et le site précise lui-même qu’il ne constitue pas un avis médical.

Site concept biotech · 11 pages · anglais · 2026

La page d’accueil de VITON13MEDICINE dans un cadre de navigateur d’ordinateur, avec la version mobile à côté, sur un fond blanc cassé chaud portant le nom du site : le titre à empattements « We teach machines to imagine medicines » à côté d’une molécule en boules et bâtonnets noirs, bleus, rouges et jaunes.
pages, de l’accueil à la 404
11
programmes précliniques fictifs dans le pipeline
5
poids de la page d’accueil dans Lighthouse, 19 requêtes
0,5 Mo
performance Lighthouse, mobile / ordinateur
75 / 99

Objectif

VITON13 a conçu ce concept pour montrer comment le studio présenterait une entreprise scientifique : une biotech fictive qui découvre des candidats-médicaments grâce à l’IA, avec une équipe IA à Lisbonne et un laboratoire humide à Bâle. Le site devait expliquer deux plateformes technologiques, un pipeline de recherche, les postes ouverts et un blog à un lecteur du métier, sans rien exagérer.

En médecine, le texte demande plus de rigueur. Tous les programmes du site sont fictifs et précliniques, et aucune phrase ne doit se lire comme une promesse de santé ou d’efficacité. Le site avait donc besoin d’une mention claire : l’entreprise est fictive et rien de ce qu’il contient n’est un avis médical.

Ce que nous avons fait

11 pages : accueil, plateformes, pipeline, à propos, carrières, blog, modèle d’article, contact, confidentialité, conditions et 404. L’accueil s’ouvre sur une molécule 3D dessinée en canvas que le visiteur peut faire tourner à la souris, puis vient une frise historique de six jalons, de 1928 à 2024, et un compteur d’investisseurs.

La page Plateformes présente les deux plateformes fictives, l’une pour les petites molécules, l’autre pour les protéines thérapeutiques, chacune avec un problème, une solution et une boucle concevoir-fabriquer-tester-apprendre. Le pipeline montre cinq programmes précliniques dans un tableau dont les barres de progression traversent cinq étapes de découverte. Carrières présente six postes en accordéon, et le formulaire de candidature s’ouvre avec le poste déjà choisi. Le blog compte quatre articles avec un filtre par catégorie et des pages d’article ; Contact propose un formulaire de demande. Le pied de chaque page indique que l’entreprise est fictive et que le site n’est pas un avis médical.

Comment cela fonctionne

Le visiteur rencontre d’abord la molécule : lâchée après un glisser, elle continue de tourner par inertie, s’incline vers le curseur et recadre sa caméra pour rester dans le champ. Plus bas, la frise se fige à l’écran et défile à l’horizontale tandis qu’une hélice d’ADN se dessine au rythme du défilement ; sur téléphone, elle devient une liste verticale. Le parcours principal mène des Plateformes au Pipeline, puis à un article du blog.

Les titres montent ligne par ligne, les images se dévoilent par clip-path et glissent en parallaxe, les pages changent derrière un rideau, et un curseur maison affiche les libellés Drag, Read et Next. Dessous, du HTML, du CSS et du JavaScript sans étape de build : un script partagé génère l’en-tête, le pied de page et les calques pour que chaque page reste identique, GSAP avec ScrollTrigger et Lenis gèrent l’animation et le défilement, et la molécule comme l’hélice sont dessinées en canvas sans bibliothèque 3D. Rien de ce qui est saisi dans les formulaires n’est envoyé.

Ce qui existe aujourd’hui

Le concept existe sous la forme de 11 pages en anglais qui fonctionnent. Le 22 septembre 2026, Lighthouse a mesuré la page d’accueil à 0,5 Mo en 19 requêtes, la plus légère des sept sites concepts de VITON13. Avec le bridage mobile, elle obtient 75 en performance, avec un LCP de 4,3 s et un CLS de 0 ; sur ordinateur, 99, avec un LCP de 0,6 s et un CLS de 0,021. Bonnes pratiques atteint 100 sur les deux, aucune vidéo tierce n’ayant été chargée pendant le test, et SEO aussi 100 sur les deux.

Le point faible est l’accessibilité : 88 sur mobile et 87 sur ordinateur, car une partie du texte manque de contraste et les titres ne suivent pas leur ordre. Sur les 10 pages vérifiées (toutes sauf la 404), les 10 ont un titre unique et un seul H1, toutes les images ont un texte alternatif et aucun lien interne n’est cassé.

Ce que cela ne prouve pas

C’est un concept réalisé par VITON13 pour montrer son éventail, pas un projet commandé. L’entreprise, ses plateformes, ses programmes, ses investisseurs, ses équipes et ses adresses sont fictifs. Le site n’a ni domaine, ni visiteurs, ni trafic de recherche, ni ventes, et ses images sont des photos et vidéos de banque d’images sous licence, issues d’Unsplash et de Pexels.

Les programmes sont inventés et précliniques ; rien sur le site ne vaut preuve sur un médicament réel ni avis médical, et le site le dit lui-même. Les scores Lighthouse sont des mesures de laboratoire de la page d’accueil sur une seule journée, pas des données de vrais visiteurs, et un score SEO de 100 dans Lighthouse ne couvre que les bases : URL canoniques, Open Graph, JSON-LD et sitemap.xml manquent encore.

Revue SEO

Lighthouse sur la page d’accueil, 22 septembre 2026 : SEO 100 et Bonnes pratiques 100 sur mobile et ordinateur, Performance 75 et 99, Accessibilité 88 et 87. Sur les 10 pages vérifiées, titres, H1, textes alternatifs et liens internes sont en ordre, mais seuls 4/10 titres et 6/10 descriptions ont la bonne longueur, et canonical, Open Graph, JSON-LD et sitemap.xml sont absents (0/10), faute de domaine.

Vérifié le 22 septembre 2026 : 10 pages rendues dans Chrome comme les voit un robot d’indexation, et Lighthouse 13 sur la page d’accueil.

Lighthouse, page d’accueil

Performance
Mobile75Ordinateur99
Accessibilité
Mobile88Ordinateur87
Bonnes pratiques
Mobile100Ordinateur100
SEO
Mobile100Ordinateur100

Contrôles de page et SEO technique

  • Titres de page uniquesen place10/10
  • Titre de 30 à 65 caractèresabsent4/10
  • Meta description de 70 à 170 caractèrespartiel6/10
  • Un seul H1 par pageen place10/10
  • Langue de la page déclaréeen placeen
  • Mise en page mobile sans défilement horizontalen place390 px
  • Images avec texte alternatifen place100%
  • Liens internes cassésen place0
  • URL canoniqueabsent0/10
  • Open Graph : titre et imageabsent0/10
  • Données structurées (JSON-LD)absent0/10
  • sitemap.xml et robots.txtabsent0/2

En place sur les 10 pages vérifiées : titres uniques (10/10), un seul H1 par page (10/10), langue déclarée (en), mise en page mobile sans défilement horizontal à 390 px, texte alternatif sur 100 % des images et 0 lien interne cassé. Sur la page d’accueil, Lighthouse a mesuré un LCP de 4,3 s sur mobile et de 0,6 s sur ordinateur, un CLS de 0 et de 0,021, un TBT de 0 ms, et 0,5 Mo en 19 requêtes.

Avant la mise en ligne : URL canoniques (0/10 aujourd’hui) ; titres et images Open Graph (0/10) ; JSON-LD (0/10) : Organization avec la mention d’entreprise fictive toujours visible, BlogPosting pour les articles, JobPosting pour les postes et BreadcrumbList ; sitemap.xml et robots.txt (absents). Allonger les six titres de moins de 30 caractères (4/10 seulement font 30 à 65) et les quatre descriptions de moins de 70 (6/10 font 70 à 170). Pour l’accessibilité, renforcer le contraste du texte le plus pâle et remettre les titres dans l’ordre. Les textes médicaux restent sans allégation de santé.

Services illustrés par ce cas

Décrivez la tâche sur la page du service ; le périmètre, le délai et le prix écrits arrivent sous un jour ouvré.

Parler d’un projet similaire