Landing page & plateforme de coaching

Mental.fr — landing page 3D et plateforme de coaching en ligne

Une page d'entrée qui amène le trafic publicitaire vers l'inscription, puis l'espace membre où les élèves suivent leur parcours.

Logo Mental.fr (pour Luco Médias)
Client
Mental.fr (pour Luco Médias)
Année
2026 - Campus en développement
Type
Landing page & plateforme de coaching
Voir le site public ↗

Contexte

Le client

Mental.fr est une école en ligne gratuite de coaching et de développement personnel, basée à Lyon, avec un podcast. Les deux projets ont été réalisés en sous-traitance de l'agence Luco Médias, qui porte la relation avec Mental.fr. Autre projet réalisé pour Luco Médias : Luconnect, l'outil interne de l'agence.

Deux réalisations pour Mental.fr : une landing page « université en ligne » construite dans Framer, avec une scène 3D d'homme de Vitruve, puis Mental.fr Campus, la plateforme membre (bibliothèque, parcours, points, suivi) en cours de développement.

Problème

Le défi à résoudre

Mental.fr diffuse des publicités et avait besoin d'une page d'entrée qui transforme ce trafic en inscriptions : un titre et un bouton visibles sans défiler, sur ordinateur comme sur mobile, une scène 3D marquante qui ne ralentit pas le chargement, et des textes que l'équipe peut modifier elle-même. Ensuite, les élèves inscrits avaient besoin d'un espace à eux : retrouver les épisodes et les fiches, avancer dans un parcours, gagner des points et être relancés quand ils décrochent.

Ce qui a été construit

Comment je l'ai résolu

1. La landing page (livrée à l'automne 2026) Trois pages dans Framer : l'entrée, la politique de confidentialité et les mentions légales, rédigées. La scène 3D est un homme de Vitruve en nuage d'environ 22 000 points dorés, chargée seulement après l'affichage de la page et remplacée par une image fixe sur mobile. Le clic sur le bouton est mesuré, mais seulement après accord du visiteur. 2. Mental.fr Campus (en cours) Une application web sur mesure pour les élèves : bibliothèque d'épisodes et de fiches, parcours, points, suivi et relances. Le développement suit un registre d'exigences tenu à jour et un découpage par jalons.

  • Landing page : trois pages Framer (entrée, politique de confidentialité, mentions légales rédigées), construites et publiées par script via l'API Framer, en une commande
  • Huit composants React sur mesure intégrés à Framer : scène Vitruve, bandeau de consentement, bouton d'inscription, fond labyrinthe, schéma des dix points, pied de page
  • Scène 3D : homme de Vitruve en nuage d'environ 22 000 points dorés (Three.js / WebGL), chargée après l'affichage de la page
  • Mobile : image fixe à la place de la scène 3D, titre et bouton visibles sans défiler
  • Autonomie : textes, image des locaux, libellé et destination du bouton modifiables par l'équipe, sans développeur
  • Tests automatiques : textes validés verrouillés, consentement, et rendu WebGL réel de la scène vérifié au pixel
  • Mesure : événement de conversion au clic, déclenché seulement après accord du visiteur ; aucun outil publicitaire chargé avant
  • Mental.fr Campus (en cours) : espace membre avec bibliothèque d'épisodes et de fiches, parcours et points
  • Mental.fr Campus (en cours) : suivi des élèves, relances et carte membre en 3D
  • Mental.fr Campus : 89 exigences suivies dans un registre, travail découpé par jalons

Captures réelles

L'outil en production

Landing page de Mental.fr : fond noir, homme de Vitruve doré, titre « Approche innovante de travail sur soi » et bouton « Je postule »
Landing page Mental.fr, version Framer, capture du 13/11/2026

Résultats

Ce que ça a changé

460 ms
premier affichage de la landing page sur ordinateur (mesure interne, 1440 × 900, 18/09/2026)
328 ms
premier affichage sur mobile (mesure interne, 390 × 844, 18/09/2026)
  • Landing page livrée et publiée sur mental.fr à l'automne 2026, avec ses pages légales
  • Mental.fr Campus en développement depuis novembre 2026

Sources : Mesures de premier affichage : relecture de conformité au cahier des charges (18/09/2026) · Dépôt de la landing page, publiée le 18/09/2026 (source locale) · Mental.fr

Et chez vous ?

Les questions qu'on me pose avant de se lancer.

Ce projet part d'une situation banale : des tâches répétitives faites à la main, des informations ressaisies d'un outil à l'autre, du papier qui circule encore. Si vous reconnaissez ça chez vous, voilà ce que les gens me demandent ensuite.

Un projet comme Mental.fr, ça coûte combien ?

Cela dépend surtout du nombre de systèmes à connecter, pas du nombre d'écrans. Une application métier démarre autour de 3 000 € HT, une plateforme complète avec back-office se situe généralement entre 12 000 € et 60 000 €. Le simulateur donne une fourchette chiffrée pour votre cas en quelques minutes, sans engagement.

Combien de temps avant la mise en production ?

Compter 6 à 10 semaines pour une première version en production sur un périmètre bien cadré. Le cadrage initial prend une semaine et conditionne tout le reste : c'est là qu'on décide de ce qui n'est pas dans la V1.

Ce résultat est-il reproductible dans mon entreprise ?

Les gains viennent presque toujours du même endroit : une tâche répétitive faite à la main, une double saisie entre deux outils, ou une information qui circule encore par téléphone et papier. Si vous reconnaissez l'une de ces trois situations chez vous, le raisonnement s'applique — les chiffres, eux, dépendent de vos volumes.

Le code et les données m’appartiennent-ils ?

Oui. Le code source vous revient, l'hébergement se fait sur vos comptes, et il n'y a pas de licence récurrente qui vous lie. Vous pouvez confier la maintenance à quelqu'un d'autre plus tard sans avoir à tout reconstruire.

Et si j’ai déjà des logiciels en place ?

C'est le cas le plus fréquent, et on ne les remplace pas. On les connecte via leurs API pour supprimer les ressaisies. Remplacer un outil qui fonctionne est presque toujours plus coûteux que de le faire dialoguer avec le reste.

Chiffrer votre projet, sans rendez-vous

Le simulateur vous donne une fourchette de budget et de délai en quelques minutes. Pas de commercial, pas de relance : vous repartez avec une estimation.