Aller au contenu

Blue Train : création du site d'une plateforme IA pour les écoles

Blue Train développe une IA de correction d'examens pour les grandes écoles. Son site devait rassurer sur la place des enseignants, la compatibilité avec les outils et la protection des données.

Comme agence web pour les acteurs de l'éducation, Gemeos a conçu la direction artistique, l'UX/UI et les pages Webflow autour de ces questions.

Page d’accueil BlueTrain sur un ordinateur portable : « Ne laissez pas passer le train de la correction par IA »

Lever les objections des établissements face à la correction par IA

Blue Train propose une plateforme de correction assistée par IA destinée aux grandes écoles. Pour convaincre des décideurs académiques, il fallait apporter des réponses concrètes aux questions des établissements : compatibilité avec les LMS, contrôle de la correction par les enseignants et protection des données. L'enjeu n'était pas seulement de présenter un outil innovant, mais de montrer comment il s'intègre aux processus pédagogiques existants.

Gemeos a conçu une direction artistique sobre, adaptée à une clientèle institutionnelle, puis structuré les pages autour des bénéfices et des objections les plus fréquentes. Les maquettes UX/UI et les composants Webflow présentent les principaux cas d'usage, les garanties attendues par les établissements et un parcours orienté demande de démonstration.

Industrie
Éducation
Services
DA
UX/UI Design
Intégration
Deux pistes de page d’accueil BlueTrain, claire et sombre : « Ne laissez pas passer le train de la correction par IA »

Direction artistique : Un univers EdTech premium, sobre et crédible

La direction artistique de Blue Train devait incarner la rigueur académique et la modernité technologique. Gemeos a développé un univers visuel épuré, au service du produit et de la crédibilité institutionnelle, sans tomber dans les codes génériques du SaaS ou de l'EdTech grand public.

Élément DAApproche
Univers visuelEdTech premium, sobre et institutionnel
Mise en avant produitInterface de relecture en avant-scène
Preuves socialesEDHEC, EMLyon, portraits professeurs
Ton graphiqueÉlégant, noir et blanc, témoignages vidéo
  • Typographie Manrope de BlueTrain, « Aa » blanc et cyan sur fond encre
  • Palette animée BlueTrain : encre, cyan, lavande et gris
  1. Technologie & humanité

    Une direction inspirée de l'univers académique, dominée par des blancs et gris doux qui laissent respirer le contenu. Le bleu BlueTrain intervient comme repère visuel et couleur d'accent pour structurer les interactions. La typographie sobre et élégante évoque le monde pédagogique, professionnelle et accessible à la fois. Les visuels alternent portraits et paysages calmes, prenant de l'ampleur au scroll pour accompagner une lecture fluide. Les interfaces restent volontairement simples : cartes légères, surfaces claires, ombres discrètes. Une direction qui traduit la confiance, la lisibilité et la rigueur des établissements les plus exigeants.

  2. L’IA en mouvement

    Une direction plus contemplative qui s'appuie sur l'idée de mouvement propre à BlueTrain, un train qui avance, symbole de progrès et d'évolution. Fond sombre qui met en valeur la lumière des contenus, touches de bleu lumineux comme points d'ancrage technologiques. Les paysages, nuages, horizons, reflets, construisent un univers inspiré de la peinture romantique, presque onirique. Les éléments d'interface apparaissent comme des fragments flottants : cartes transparentes, surfaces en verre qui semblent émerger du décor. Une vision prospective et sensible de l'IA, où l'innovation s'inscrit dans un mouvement calme et maîtrisé.

Page d’accueil BlueTrain : « Ne laissez pas passer le train de la correction par IA », paysage peint et portraits
Concept 1
Ordinateur portable affichant les maquettes Figma des pages Accueil et Contact du site BlueTrain

UX/UI Design : Des pages qui lèvent les objections et convertissent les écoles

Le design UX/UI des pages Blue Train a été pensé pour répondre aux questions d'un décideur institutionnel exigeant. Chaque section répond à une crainte spécifique : RGPD, contrôle professeur, compatibilité LMS. Le parcours guide naturellement vers la demande de démo.

Page designéeObjectif UX
HomepagePitch produit, use cases EDHEC/EMLyon, CTA démo
Section processBarème → Calibration → Relecture → Publication
Section FAQObjections RGPD, LMS, contrôle professeur
Section témoignagesPortraits professeurs + vidéos (5-8 profils)
Page contactCalendly intégré pour prise de RDV directe
  • Carte d'étude de cas BlueTrain « EDHEC Business School » sur une peinture du campus, posée sur fond cyan
Site mobile Blue Train sur smartphone : « Ne laissez pas passer le train de la correction par IA »

Intégration Webflow : Un site performant, précis et orienté conversion

Le développement Webflow de Blue Train reprend fidèlement le design conçu pour les décideurs des grandes écoles. Chaque composant, du carrousel de use cases aux FAQ accordéon, a été intégré avec soin pour garantir fluidité et performance.

Aspect techniqueDétail
PlateformeWebflow
ResponsiveDesktop, tablette et mobile
InteractionsCarrousel, accordéon FAQ, tabs verticaux
IntégrationCalendly pour prise de RDV directe
PerformanceOptimisation core web vitals
  • iPhone dont la page défile, sur fond cyan, ouvert sur l'accueil mobile de BlueTrain « Ne laissez pas passer le train de la correction par IA »
  • Illustration peinte du hero BlueTrain : lac et montagnes, train sur le pont, cartes de copies corrigées et assistant IA

Nos dernières réalisations

+250 entreprises accompagnées

Des sites designés et développés avec

Voir tous les projets

Vous allez notre collaboration, c’est garanti

Prêt à faire décoller votre activité ?

demander un devis

Let’s f*****G GO !!