MANDATeamIA
Plateforme d'agents IA et d'automatisation métier
Refonte stratégique, UX et technique complète de TeamIA, intégrateur d'agents IA en France et au Luxembourg. Le projet a commencé par le reverse engineering de l'ancien site Webflow, un audit SEO/GEO et la clarification du positionnement. J'ai ensuite conçu la direction visuelle, l'architecture de contenu et la plateforme Next.js reliée à Payload CMS, PostgreSQL/Supabase, n8n et Resend. Le site réunit des pages marché locales, des démonstrateurs d'agents IA, des cas d'usage, les aides et financements, un espace presse, un blog multilingue et un formulaire métier sécurisé. Le contenu public dispose d'un fallback statique afin que le site reste rapide et disponible même lorsque le CMS est temporairement indisponible.
Refonte d'une plateforme IA B2B
Transformer un site Webflow en plateforme métier pilotable
TeamIA devait passer d'un site vitrine généraliste à une plateforme capable d'expliquer, démontrer et vendre des agents IA métier en France et au Luxembourg. J'ai pris en charge le reverse engineering de l'existant, la clarification du positionnement, la direction UI/UX, l'architecture Next.js et Payload CMS, les connexions Supabase et n8n, ainsi que la migration SEO/GEO. Le résultat est un système éditorial multilingue, mesurable et conçu pour rester disponible même lorsque le CMS distant ne répond pas.
- Périmètre
- stratégie, design, code, CMS et acquisition
- Stack
- Next.js 16, Payload CMS 3 et PostgreSQL
- Automatisation
- formulaires et 9 démonstrateurs reliés à n8n
- Marchés
- France, Luxembourg et contenus FR/EN/DE
Commencer par le positionnement, pas par la maquette
L'ancien site présentait de nombreuses capacités IA sans hiérarchie assez nette entre diagnostic, intégration et résultat métier. Le travail a donc commencé par un reverse engineering des pages, des messages, des parcours et des signaux de confiance. L'enjeu n'était pas de repeindre Webflow, mais de décider ce que TeamIA devait devenir dans l'esprit d'un dirigeant de PME.
Le positionnement retenu présente TeamIA comme l'intégrateur transfrontalier qui transforme un processus métier en agent IA opérationnel, mesurable et finançable. Le parcours relie maintenant deux étapes cohérentes : cadrer le cas d'usage, puis déployer l'agent et mesurer sa valeur. France et Luxembourg restent deux portes locales sans imposer de redirection géographique au visiteur.
Une direction UI/UX conçue pour rassurer un décideur B2B
Plusieurs directions pleine page ont été explorées avant de consolider une interface claire, blanche et opérationnelle. Le premier écran pose une promesse, un seul appel à l'action et un schéma lisible : données et processus entrent dans un agent sécurisé, puis produisent des actions dans les outils, du temps gagné et un ROI suivi.
La suite de la page donne la priorité au parcours, aux démonstrateurs et aux preuves. Les références presse, le fondateur, les marchés locaux, la FAQ et le contact ont chacun une fonction précise. L'iconographie, la typographie et les dimensions des composants sont normalisées afin que l'équipe puisse enrichir le site sans casser sa cohérence visuelle.
Next.js et Payload CMS sans rendre le site dépendant du CMS
Le frontend a été reconstruit avec Next.js tandis que Payload CMS administre les pages, articles, marchés, aides, cas d'usage, démonstrateurs, FAQ, équipe, presse et redirections. PostgreSQL sur Supabase porte les données structurées et un stockage objet séparé accueille les médias.
La lecture distante de Payload est volontairement optionnelle pour le site public. Un snapshot statique sert de contenu de secours : si la base ou le CMS est indisponible, les pages marketing continuent de répondre sans ouvrir une connexion PostgreSQL à chaque visite. Cette décision améliore à la fois la disponibilité, la vitesse et la maîtrise des quotas Vercel/Supabase.
Des démonstrateurs branchés à n8n avec une frontière serveur
Les neuf démonstrateurs ne contactent jamais directement les webhooks depuis le navigateur. Une route Next.js vérifie la demande, applique les limites et relaie l'appel vers n8n avec un secret conservé côté serveur. Le même principe protège le formulaire de contact avant son enregistrement et sa transmission au workflow métier.
Cette architecture sépare la démonstration visible des credentials et de l'orchestration. Elle permet d'ajouter journalisation, contrôle de volume, reprise sur erreur et évolution des workflows sans exposer l'instance n8n ni obliger le frontend à connaître les détails techniques.
Une migration SEO/GEO pensée URL par URL
La refonte conserve l'autorité acquise par l'ancien domaine grâce à une matrice de migration : URL source, nouvelle destination, redirection, canonical et équivalent linguistique. Les pages natives remplacent les contenus difficiles à indexer, avec sitemap, hreflang, métadonnées, données structurées et fichiers lisibles par les agents IA.
Les hubs France, Luxembourg et Paris répondent à des intentions locales distinctes. Les articles, pages marché, cas d'usage et démonstrateurs sont reliés par sujet afin d'éviter des pages isolées. GA4, GTM et PostHog restent soumis au consentement, ce qui permet de mesurer les parcours sans charger les outils marketing avant le choix du visiteur.
Une livraison exploitable après la mise en ligne
Le projet comprend les migrations Payload, les contenus statiques de secours, les scripts d'administration, les procédures Supabase, la sécurité des accès et la documentation d'exploitation. Les comptes de production, le dépôt, les données et les services critiques appartiennent à TeamIA afin d'éviter toute dépendance au prestataire.
Cette réalisation rassemble mon approche complète d'un site métier : comprendre l'offre, dessiner le parcours, construire l'outil éditorial, connecter les opérations, préserver le SEO puis documenter la maintenance. La mise en ligne n'est pas la fin du projet ; elle ouvre une boucle mesurable d'amélioration du contenu et de la conversion.
Voir la plateforme TeamIA
Découvrir le site en production, ses marchés, ses démonstrateurs et ses contenus métier.
Développement de sites et SaaS
Conception Next.js, architecture de contenu et intégrations pour produits et sites métier.
Automatisation n8n à Madagascar
Webhooks sécurisés, workflows documentés, reprise sur erreur et validation humaine.
Consultant SEO et GEO
Architecture de recherche, contenus utiles, données structurées et visibilité dans les moteurs IA.
Quel était l'objectif principal de la refonte TeamIA ?
Faire passer TeamIA d'un catalogue généraliste autour de l'IA à une plateforme B2B qui explique un parcours clair : identifier un cas d'usage, déployer un agent connecté aux outils, sécuriser les actions et mesurer le résultat.
Pourquoi avoir combiné Next.js et Payload CMS ?
Next.js apporte le rendu, la performance et le contrôle SEO. Payload fournit une administration structurée pour les pages, articles, marchés, démonstrateurs et preuves. Un fallback statique évite que le site public dépende d'une lecture CMS à chaque visite.
Comment les démonstrateurs TeamIA sont-ils sécurisés ?
Le navigateur appelle une route serveur Next.js. Celle-ci contrôle la requête et transmet ensuite au webhook n8n avec un secret non exposé au client. Des limites et des chemins d'erreur réduisent les appels abusifs ou incomplets.
La refonte conserve-t-elle le référencement de l'ancien site ?
Oui. Une matrice de migration associe les anciennes URL aux nouvelles pages et pilote redirections, canonicals, hreflang et sitemap. Le contenu a aussi été restructuré en hubs thématiques et locaux plutôt qu'en pages isolées.
TeamIA peut-il modifier le site sans développeur ?
Oui pour le contenu prévu dans Payload : pages, articles, FAQ, marchés, presse, cas d'usage et démonstrateurs. Les composants et types de sections restent encadrés afin de conserver la direction UI/UX et la qualité technique.