Debrief de la session du Club Produit
préparé avec l'outil IA Euria (Infomaniak)
🎯 Contexte de la session
Deuxième rendez-vous 2026 du Club Produit, animé par Axel Aigret (fondateur de StorytoDoc), dédié au prototypage fonctionnel assisté par IA.
L’objectif : démontrer comment passer d’une idée à un prototype
interactif et fidèle au produit réel en quelques heures, sans dépendre
des équipes de développement ou de design.
La session a combiné une démonstration live sur le SaaS StorytoDoc,
une comparaison d’outils (Lovable, Manus, v0), et des échanges sur les
bonnes pratiques de configuration et de gestion de contexte.
🛠️ Bénéfices clés du workflow démontré
1. Fidélité au produit réel (vs. prototypes "génériques")
Contrairement aux outils "no-code" comme Lovable ou Manus qui génèrent des interfaces standardisées, l’approche d’Axel utilise Claude Code couplé à Figma (via MCP) pour récupérer l’écran exact du produit.
- Résultat : Un prototype qui respecte le design system existant, les couleurs de la marque et la structure réelle du SaaS.
- Citation : «
Le but de prototyper, c’est de se rendre compte en interne si ça
marche. Mais si on veut le montrer à des clients, il faut que ça
ressemble à notre SaaS. » — Axel Aigret.
...la suite pour les adhérents (connectez-vous pour consulter le reste).
2. Itérations rapides en langage naturel
La démo a montré la modification d’une interface (ajout d’un sélecteur de couleur) par simple commande textuelle.
- Gain de temps : Passage de plusieurs jours (processus classique Design → Dev) à quelques minutes.
- Flexibilité : Possibilité de tester plusieurs variantes (couleurs, layouts) sans coder manuellement.
3. Intégration dans le workflow Produit (PRD → Proto → Tickets)
Axel a illustré comment intégrer le prototypage dans son dossier feature/ structuré :
- Contexte persistant : Utilisation de fichiers cloud-point.md pour définir les règles du dossier (ex: "toujours vérifier les retours clients avant de prototyper").
- Mémoire et traçabilité : Utilisation d’outils comme AutoMem pour sauvegarder l’historique des décisions et des itérations, évitant la perte de contexte entre les sessions.
4. Validation par la donnée client
Avant même de prototyper, le workflow inclut une étape automatique de recherche dans les enregistrements d’appels (via Circleback) pour valider le besoin.
- Exemple concret : Pour la feature "masquage de données sensibles", Claude Code a extrait les verbatims exacts des clients expliquant pourquoi le floutage manuel était trop lourd.
⚠️ Limites et précautions identifiées
1. La dette technique du "Design First"
Utiliser Figma comme source de vérité pose le problème de la dérive entre la maquette et la production.
- Risque : Prototyper sur une maquette Figma obsolète peut conduire à des incohérences avec le code réel.
- Conseil : Privilégier l’extraction directe depuis le code ou s’assurer d’une synchronisation Figma ↔ Prod stricte.
2. Gestion du contexte et de la mémoire
- Problème : Sans outil de mémoire externe (comme AutoMem), fermer le terminal efface le contexte des itérations précédentes.
- Solution : Configurer des hooks pour sauvegarder automatiquement les décisions dans des fichiers .md locaux.
3. Coût et consommation de tokens
- Observation : Le prototypage intensif et la génération d’images consomment beaucoup de tokens.
- Astuce : Axel utilise un plan partagé en entreprise et délègue la génération d’images à des modèles moins coûteux (ex: Gemini via MCP) pour optimiser les coûts.
4. Comparatif des outils "One-Shot" (v0, Lovable, Manus)
- Avantage : Génération ultra-rapide d’applications complètes à partir de zéro (ex: outil de calcul de devis montré par Christophe Denuziere avec v0).
- Limite
: Ces outils partent d’une page blanche et ne connaissent pas votre
produit existant. Idéal pour valider une nouvelle idée (Greenfield),
moins pour itérer sur un SaaS existant (Brownfield).
💡 Conseils pour le déploiement
1. Structurer son environnement de travail
- Arborescence claire : Créer un dossier prototype/ par feature avec son propre fichier d’instructions (cloud-point.md).
- Règles strictes : Définir dans le fichier d’instructions que l’IA doit toujours sauvegarder l’historique des modifications et valider les changements majeurs.
2. Ne pas négliger la validation humaine
- Règle d’or : L’IA génère vite, mais peut halluciner sur les contraintes techniques. Une revue rapide par un développeur reste nécessaire avant de promettre une feature.
- Citation : « On arrive à une finesse où la frontière entre proto et front sera très fine. La question est : comment s’y rapprocher le plus vite possible sans casser la prod ? » — Axel Aigret.
3. Former les équipes à la "culture IA"
- Besoin identifié : Passer d’une utilisation "gentille" de l’IA à une utilisation structurée et industrielle.
- Action : Une formation pratique (prévue en juin 2026 avec Digitaly/Portage) est proposée pour apprendre à configurer ces workflows en entreprise.
4. Choisir le bon outil selon le besoin
- Pour du Greenfield (nouveau produit) : Utiliser v0 ou Lovable pour aller vite.
- Pour du Brownfield (itération sur produit existant) : Utiliser Claude Code + Figma/Codebase pour la fidélité.
📌 À retenir pour les CPO & PM
- Le prototypage IA n’est plus un gadget : C’est un levier stratégique pour réduire le Time-to-Market et valider des hypothèses avec des clients réels.
- La clé du succès réside dans le contexte : Plus vous donnez de contexte pertinent (design system, retours clients, contraintes techniques) à l’IA, plus le prototype sera usable.
- L’outil ne fait pas tout : La structuration du workflow (fichiers d’instructions, mémoire, validation) est aussi importante que le modèle d’IA lui-même.
📅 Prochaines étapes
- Formation "Claude Code pour le Product" : 4 sessions en juin 2026 (distanciel). Contact : Stéphane Mosnier.
- Communauté : Rejoignez le groupe WhatsApp du Club Produit pour échanger sur vos setups et partager des prompts (lien partagé par Axel).
