E-investing : direction artistique, design et site Webflow d'une académie d'éducation financière

e-Investing est une académie d'éducation financière fondée par Nicolas Domnesques et Darius C. Shirazi, deux anciens de HEC Paris passés par la banque. Elle apprend aux particuliers à construire et gérer eux-mêmes leur épargne : formation en ligne, coaching individuel, masterclass et communauté privée, avec un objectif affiché, rendre chacun autonome plutôt que dépendant d'un conseiller.

e-Investing a confié à Gemeos, agence web pour la finance, la nouvelle direction artistique de sa marque, le design et le développement Webflow de son site, et son référencement.

MacBook Pro ouvert sur l'accueil e-Investing « Investissez votre épargne avec sécurité »

Rendre l'investissement lisible, sans jargon ni promesse

e-Investing est né de vidéos publiées sur les réseaux sociaux, puis d'appels avec les abonnés : un public souvent débutant, qui veut comprendre avant d'investir. L'ancien site, un bandeau bleu et une longue page de présentation, ne racontait ni l'Académie, ni l'équipe, ni la masse de contenus gratuits produits depuis. Sur un sujet où la méfiance est la norme, la marque devait inspirer confiance par la clarté, pas par l'emphase.

Gemeos a exploré plusieurs directions de look & feel autour du logo existant, fixé un UI kit (couleurs, typographies, boutons, composants), puis conçu et intégré le site sur Webflow : accueil, Académie, équipe, témoignages, partenaires, FAQ, prise de rendez-vous, et une base de ressources pensée pour le référencement.

Industrie: Finance; Éducation
Services: DA; UX/UI Design; Intégration; SEO

Trois pistes de page d'accueil explorées pour e-Investing, posées sur fond encre

Un « e » en trois arcs, et une seule couleur pour l'investissement

Le logo existait déjà : un « e » dessiné par trois arcs de cercle, en dégradé de bleu, et le mot Investing. Le travail a porté sur tout ce qui l'entoure. Plusieurs versions de la page d'accueil ont été explorées, du manifeste en capitales au fond nuit en passant par un bleu ciel plus doux, pour comparer l'univers à contenu égal : la couleur, la typographie, la place de l'équipe et des preuves.

La direction retenue est claire et aérée : un bleu franc (#3284FF) décliné en cinq nuances jusqu'au bleu nuit (#0C0091), un dégradé du bleu outremer au bleu pour les boutons et les mots clés, des fonds en dégradé de bleu glacier et une trame de lignes fines qui ondulent derrière les titres. Les titres sont composés en Fustat, les textes en Rubik ; le pied de page passe à l'encre (#030507) pour porter les mentions réglementaires.

Le UI kit fixe l'ensemble : onze neutres, cinq bleus, deux dégradés, les styles de titres et de textes pour le desktop et le mobile, les boutons à icône, les étiquettes et les composants de page (en-tête, pied de page, appels à l'action).

Piste 1 - Le manifeste
Un titre en capitales, centré, avec le mot « performance » en dégradé violet-bleu sur un fond pastel, puis une section sombre aux cartes en verre fumé. Perception visée : directe et énergique, dans le ton des vidéos de la marque.
Piste 2 - L'onde
Un fond bleu nuit traversé d'une onde de lumière, le titre centré en blanc et la barre des partenaires en transparence. Perception visée : premium et nocturne, plus proche de l'univers des marchés.
Piste 3 - Le ciel
Un dégradé de bleu ciel, le titre ferré à gauche et la promesse « Faites fructifier votre épargne » en sous-titre. Perception visée : calme et rassurante. C'est cette voie claire, poussée ensuite vers la trame de lignes fines, que suit le site en ligne.

Piste 1, Le manifeste : titre en capitales sur fond pastel et carte « Devenez financièrement libre » sur fond sombre

Concept 1

MacBook Pro ouvert sur la page Académie d'e-Investing « Ce qu'il faut savoir sur l'investissement »

Montrer l'Académie, l'équipe et les élèves avant de demander quoi que ce soit

Le visiteur type arrive d'une vidéo, avec une question simple : est-ce sérieux, et pour qui ? Le site répond dans l'ordre. L'accueil présente l'accompagnement en trois volets (coaching, plateforme, communauté), puis les témoignages en vidéo et en texte, les objectifs de la méthode et les ressources gratuites.

Page	Ce qu'elle fait pour le visiteur
Accueil	La promesse, les trois volets de l'accompagnement en onglets, les témoignages, les objectifs de la méthode et l'accès aux ressources
Académie	Le plan d'action, les classes d'actifs abordées, la méthode en deux socles (passif et actif), le curriculum module par module, la communauté et les masterclass
À propos	L'histoire des deux fondateurs, leurs parcours, l'équipe d'experts associés et les valeurs de la maison
Témoignages	Les avis des membres, en vidéo et en texte
Partenaires	Les plateformes testées par l'équipe, classées par enveloppe : compte-titres, PEA, assurance-vie, cryptomonnaies, immobilier et SCPI
Ressources	Articles et guides, avis et comparatifs, livres et simulateur de patrimoine
FAQ et rendez-vous	Les questions sur l'Académie, l'espace membre et la facturation, puis la réservation d'un appel

Les pages partagent les mêmes briques : en-tête avec étiquettes, bande des médias, cartes à bord bleu ciel arrondies à 16 px, accordéons, carrousels de témoignages et appels à l'action en pied de page. Les fonds alternent le blanc et le dégradé de bleu glacier, et le pied de page encre réunit les liens, les numéros d'enregistrement et l'avertissement sur les risques de l'investissement.

Pro Display XDR ouvert sur la page « Notre histoire » d'e-Investing

Un site que l'équipe e-Investing alimente seule, article après article

Le site est développé sur Webflow. Les articles, leurs thèmes, les auteurs, les livres, les partenaires et les témoignages vivent dans des collections CMS, chacune servie par un gabarit unique : publier un guide, ajouter une plateforme partenaire ou une vidéo de membre ne demande aucune mise en page. Chaque article affiche son sommaire cliquable, son fil d'Ariane et son image de partage.

Les composants sont légers et accessibles : les accordéons de la FAQ et du curriculum s'ouvrent sans script, par une case à cocher et une grille qui se déploie, les carrousels de témoignages tournent en boucle et les titres de l'accueil s'écrivent lettre par lettre. La page Contact propose un formulaire, la page Rendez-vous la réservation d'un appel avec l'équipe.

MacBook Pro ouvert sur l'article e-Investing « Assurance-vie : le guide complet pour bien investir et transmettre son patrimoine »

Répondre aux questions des épargnants, une par une

Avant de chercher une formation, un épargnant tape « assurance-vie », « choisir un ETF » ou « meilleur compte-titres ». Le site occupe ces recherches avec une base de ressources rangée par thème, des avis sur les plateformes et des guides longs, chacun avec son sommaire, son auteur et sa date.

Chantier	Détail
Contenus	124 articles et guides en français, rangés en 6 thèmes (investir en bourse, ETF, placements et épargne, finances personnelles, avis et comparatifs, Suisse), et 3 livres
Auteurs	Une page par auteur, avec ses articles, pour les deux fondateurs
Balises & métadonnées	Title et meta description rédigés page par page, pour les articles comme pour les pages principales, image de partage sur les articles et les livres
Données structurées	Article sur chaque article, ProfilePage sur les pages auteurs, fil d'Ariane (BreadcrumbList) sur les articles, les thèmes, les auteurs et les livres
Exploration	Plan du site de 153 URL ; les pages de pagination sont écartées de l'exploration dans le robots.txt

Lisible par les moteurs comme par les assistants IA

Les guides s'ouvrent sur un sommaire fait de questions (« Qu'est-ce que l'assurance-vie ? », « Comment ouvrir une assurance-vie ? »), suivies de réponses courtes et structurées. Signé par l'un des fondateurs, daté et relié à sa page auteur par ses données structurées, chaque guide donne aux moteurs et aux assistants IA des réponses attribuées et faciles à citer.