Épargne Claire
un produit construit autrement
Un site pédagogique sur l'épargne et l'investissement, conçu, architecturé et développé en autonomie par un PM, en s'appuyant sur la méthodologie BMAD d'orchestration multi-agent et le vibe coding.
Voir le site en productionL'épargne est compliquée, et personne ne traduit.
D'un côté, les sites de banques et assurances : commerciaux, biaisés, conçus pour vendre. De l'autre, les ressources institutionnelles (AMF, Bercy) : rigoureuses mais illisibles pour quelqu'un qui n'a pas baigné dans le jargon. Au milieu, des millions de Français qui veulent comprendre PEA, assurance-vie ou Livret A sans avoir à se former en finance.
Le manque côté lecteur
« Je dois choisir entre du contenu vendeur, ou du contenu officiel incompréhensible. »
Le projet
Traduire en français courant, gratuitement, sans promotion, sans affiliation. Un produit personnel, pas un business.
Quatre piliers non négociables.
Avant la première ligne de code, ces quatre engagements ont été posés. Ils contraignent tout le reste : la rédaction, l'architecture, le modèle économique (inexistant), le ton.
Sources publiques
Tout le contenu provient de sources officielles : AMF, Service-Public, Legifrance. Aucune source commerciale, aucun rabattage.
Zéro recommandation
Aucun conseil d'investissement, aucune reco produit, aucune affiliation. La promesse est de comprendre, pas d'orienter.
Open source
Le code est public, la méthodologie est documentée. Tout est vérifiable, reproductible, ré-utilisable.
Construit avec l'IA
Développement intégral en vibe coding et méthodologie BMAD multi-agent. Human in the loop à chaque étape clé.
Une équipe produit, simulée par des agents.
BMAD (Breakthrough Method of Agile AI-Driven Development) est une méthodologie où plusieurs agents IA jouent chacun un rôle de l'équipe produit : analyste, PM, architecte, UX, dev, QA, tech writer. Les artefacts circulent de l'un à l'autre, comme dans une vraie équipe — mais opérée en grande partie par une seule personne.
Le pattern créateur / valideur
Chaque artefact (PRD, architecture, story, code) est produit par un agent créateur, puis revu par un agent valideur au regard adversarial. Le QA cherche systématiquement les défauts du code dev. L'architecte challenge le PRD du PM. Le résultat : moins d'angles morts qu'un développement linéaire, au prix d'une boucle supplémentaire.
Créateur
Produit l'artefact
Valideur
Recherche les défauts, adversarial
Human in the loop
Arbitre, redirige, valide
Les rôles mobilisés
Analyste
Cadrage : problème, marché, persona, hypothèses
PM
PRD : objectifs, user stories, périmètre fonctionnel
Architecte
Décisions techniques : stack, structure, contrats d'API
UX Designer
Parcours utilisateur, wireframes, ergonomie
Scrum Master
Découpage en epics et stories, priorisation
Dev
Implémentation des stories, code production
QA (Quinn)
Revue adversariale, recherche systématique de défauts
Tech Writer
Documentation, archi décisions, rétrospectives
Ce que la méthode ne fait pas.
Le vibe coding et BMAD ne sont pas un raccourci magique. Pour rester crédible auprès d'une DSI ou d'un comité produit, autant nommer franchement ce qui coince.
Process long
10x plus de discussion que de code. Chaque feature passe par cadrage, archi, story, dev, review. Pas un raccourci, un workflow différent.
Coût LLM additionnel
Plusieurs agents par feature signifie plusieurs appels API. Le coût marginal est faible, mais cumulé sur un projet entier, à ne pas ignorer.
Overhead documentaire
Chaque agent produit un artefact explicite (PRD, archi, story, review). C'est la traçabilité — mais c'est aussi de la lecture humaine en plus.
Dépend de la qualité des personas
Si la définition d'agent est mal cadrée, la sortie l'est aussi. Le prompt engineering reste un savoir-faire critique, pas magique.
À retenir : ce n'est pas « moins de travail », c'est un autre travail. Le PM devient orchestrateur, le temps gagné sur l'exécution est réinvesti dans le cadrage, la spécification et l'arbitrage. C'est cohérent avec un profil senior — ça ne remplace pas un junior dev qui découvre son métier.
Un site en production, gratuit, vérifiable.
Du cadrage à la mise en ligne, l'ensemble du produit a été conçu, développé et déployé en solo. Pas de prestataire, pas d'agence, pas de stack d'entreprise. Juste une méthodologie et un orchestrateur.
Stack technique
- · Next.js 16 (App Router, SSG, Turbopack)
- · TypeScript en mode strict
- · Tailwind CSS v4 + design tokens custom
- · MDX pour le contenu pédagogique des produits
- · motion/react pour les transitions
Périmètre fonctionnel
- · Pages produit (livret A, PEA, assurance-vie…) en MDX
- · Comparateur de produits d'épargne
- · Simulateur fiscal interactif
- · Glossaire pédagogique, mentions légales
- · Préparation de rendez-vous conseiller
Ce qui est en place, ce qui s'améliore.
Site statique éducatif : pas d'agent IA en production sur le site lui-même, l'audit porte sur la démarche de construction et le produit livré.
Confirmé — déjà en place
Ce qui est livré et démontrable.
Vibe coding end-to-end
Claude Code utilisé pour génération du site : composants, pages, contenu MDX, design tokens. Le PM orchestre, le LLM produit.
Méthodologie BMAD complète
Agents Analyste, PM, Architecte, UX, SM, Dev, QA, Tech Writer mobilisés selon les phases. Workflow PRD → archi → stories → dev → review.
Pattern créateur / valideur
Chaque artefact (PRD, archi, story, code) passe par un agent producteur puis par un agent valideur adversarial. Moins d'angles morts.
Human in the loop à chaque gate
Validation humaine systématique entre les phases. Le PM arbitre, redirige, refuse. L'autonomie de l'IA est encadrée par design.
Stack moderne et durable
Next.js 16 (App Router, SSG), TypeScript strict, Tailwind v4, MDX, Turbopack. Choix d'architecture explicites, pas par défaut.
Open source et reproductible
Code public, méthodologie BMAD documentée. La démarche peut être inspectée et rejouée, pas un magic show.
Site en production indexé
Déployé sur Vercel, en ligne et accessible. Pas un POC qui dort dans un repo — un produit utilisable.
Améliorations POC
À ajouter pour gagner en crédibilité démo — ROI fort, effort raisonnable.
KPIs produit instrumentés
Plausible Analytics pour visiteurs uniques / pages par session / taux de rebond / temps moyen. Documenter sur la page : « 150 visiteurs / mois, taux rebond 32% ».
Feedback utilisateurs
Formulaire simple « ce contenu vous a-t-il été utile ? » par page produit. Collecte dans Sheets, alimente itération éditoriale.
Pages les plus visitées surfacées
Tableau de bord interne : top 5 pages produit, pages à abandonner / fusionner / approfondir. Itération produit basée sur engagement réel.
Documentation BMAD publiable
Partager les personas, les prompts d'agents, les transitions de phase. Capital méthodologique réutilisable.
A/B test sur angles éditoriaux
Tester deux versions d'introduction d'une page produit (pédagogique vs concret) et mesurer engagement.
Industrialisation
Nécessaire uniquement en production à l'échelle. À nommer mais pas à embarquer pour un POC.
RAG conversationnel sur le corpus
Transformer le site en plateforme interactive : chatbot Q&A sur les produits d'épargne, alimenté par les pages MDX. Idée d'évolution naturelle.
CI/CD et tests automatisés
Playwright sur parcours critiques (comparateur, simulateur), GitHub Actions, lighthouse en preview. Qualité du livrable assurée par la pipeline.
Observabilité production
Sentry pour les erreurs front, Vercel Analytics pour les Core Web Vitals, alerting sur dégradation.
Internationalisation
Extension EN / ES via réutilisation des structures MDX. Pertinent si audience cible internationale.