Market Opportunity Map

Un outil web qui transforme un dossier de CSV de recherche ou des notes collées en une carte d’opportunités scorée, visualisée et imprimable — pour qu’un PM passe de signaux de discovery bruts à un brief défendable en moins de dix minutes, sans le moindre tableur

Rôle
Solo de bout en bout — stratégie produit, UX, front-end (React + Vite + Tailwind), back-end (FastAPI + Python), déploiement
Disciplines
Product DesignUXData / AnalyticsArchitecture de l’informationPrototypage
Liens
En bref
  • Problème — La priorisation PM repose sur l’intuition ; la recherche reste dispersée, si bien que l’étape d’assemblage (et non le tableur) est le vrai goulot d’étranglement
  • Insight — Un score ne mérite la confiance que si on peut l’interroger : une formule transparente, fondée sur des règles, l’emporte sur un verdict d’IA en boîte noire
  • Solution — J’ai construit seule la webapp complète (React + FastAPI) : CSV ou collage en entrée, score de 0 à 100 sur 4 composantes, carte force-directed, tiroir de décomposition + brief imprimable
  • Résultat — En ligne sur marketmap.ontwrpn.com, construit seule en quatre semaines environ ; 24 opportunités sourcées, scoring en <200 ms, WCAG 2.2 AA, €0 d’hébergement

Le tableur n’est pas le goulot d’étranglement — c’est l’étape d’assemblage

La priorisation produit repose sur l’intuition habillée en rigueur. RICE, ICE, Kano — chaque framework existe, mais ses entrées ne sont presque jamais calculées à partir de données réelles. Un PM remplit une cellule de tableur avec une « sévérité ressentie : 7 » au jugé, et la formule multiplie des intuitions entre elles. Le résultat paraît défendable. Il ne l’est pas. La cause se situe en amont : la recherche de marché est éparpillée entre des dépôts Dovetail, des pages Notion, des enregistrements d’interviews et des fils Slack. Personne ne la rassemble sous une forme que l’on puisse scorer. Corriger la formule du tableur ne sert à rien tant que le problème d’assemblage n’est pas réglé.

Le tableur n’est pas le goulot d’étranglement — c’est l’étape d’assemblage

Le manque que je visais : un outil qui (1) ingère des signaux de marché structurés depuis un CSV simple ou un collage brut, (2) score chaque opportunité avec une formule à quatre composantes auditables, (3) visualise dans un seul graphe les liens entre segments, points de douleur, concurrents et fonctionnalités, et (4) produit un one-pager imprimable qu’un PM peut partager avec ses stakeholders — sans le moindre tableur. Aucun outil existant ne fait les quatre à la fois. Productboard gère les roadmaps mais ne score pas les signaux de discovery. Dovetail stocke la recherche mais ne fait pas remonter d’opportunités scorées. Les tableurs savent scorer, mais ne visualisent pas, n’exportent pas de briefs et ne renvoient pas aux sources.

Chaque ligne ancrée dans une source publique — la rigueur par conception

Plutôt que de fabriquer des données de démo simplement plausibles, j’ai ancré chaque ligne dans des signaux primaires publiquement accessibles : fils « Ask HN » de Hacker News (janvier 2026), Lenny’s Newsletter pour les thèmes de douleur récurrents dans les workflows PM, recherche McKinsey sur le reskilling (2024–2025) et enquêtes annuelles CareerKarma pour le jeu de données EdTech, et pages de tarification de chaque fournisseur (Aha, Productboard, Figma, Coursera, Pluralsight) pour les prix concurrents. Les articles du Nielsen Norman Group et les enquêtes sectorielles en recherche UX ont ancré le jeu de données product-tools.

Deux jeux de données, 24 opportunités préchargées : le jeu product-tools (PM seniors, chercheurs UX, design leads) et le jeu EdTech (responsables L&D, diplômés de bootcamps, personnes en reconversion). Le point de douleur PM le plus constant dans les fils HN était la stratégie qui reste dans la tête du CEO et ne redescend jamais jusqu’aux décisions au niveau des squads. Le signal EdTech le plus fort : la grande majorité des équipes L&D peinent à démontrer la valeur business, et seule une minorité mesure la formation jusqu’au Level 4 de Kirkpatrick (résultats business). Le calibrage des scores était délibérément honnête — les meilleurs scores de démo se regroupent entre 60 et 65 (« Vaut la peine d’être validé »), pas ≥75 (« Opportunité forte »), car affirmer un verdict fort sans validation client sur un marché concurrentiel serait malhonnête.

Ancrer chaque ligne dans l’URL d’une source publique discipline le scoring et garde la démo honnête. La qualité de la recherche reste déterminante — l’outil score ce que vous lui apportez

Scoring transparent, carte force-directed et brief imprimable

La formule de scoring est délibérément mécanique — quatre entrées pondérées, aucune IA en boîte noire, chaque composante visible dans un tiroir de décomposition, chaque signal relié à une source publique. La sévérité (35 %) pèse le plus : la profondeur d’une douleur est le signal le plus susceptible de stimuler l’adoption. La disposition à payer (25 %) capte l’attrait commercial. La concurrence (25 %, inversée) récompense les niches sous-servies. Les preuves (15 %, plafonnées à 10 signaux) ajoutent de la confiance sans laisser un flot de signaux confirmatifs écraser un problème de faible sévérité. Un PM en désaccord avec un score peut modifier la formule en six lignes de pandas et en voir l’effet aussitôt — c’est précisément cette auditabilité qui compte.

Le tableau de bord : la carte réseau force-directed d’abord (six types de noeuds, six couleurs), puis le nuage de points de la matrice d’opportunités, la heatmap concurrentielle, et le tableau classé en dernier — la sortie décisionnelle, pas l’accroche

Trois chemins d’entrée couvrent tout l’éventail, du structuré au brut : un import CSV à schéma complet (~5 secondes jusqu’au premier score), une fenêtre modale de collage à trois onglets (concurrents / points de douleur / citations, scoring heuristique par détection de mots-clés — « frustrated », « painful », « broken ») pour des notes de discovery brutes, et deux jeux de données de démo préchargés pour une première prise en main. Sans état par conception — pas de base de données, pas d’authentification, pas d’état serveur persistant. Toute l’analyse se fait au moment de la requête, avec pandas et networkx.

marketmap.ontwrpn.com — aperçu en ligne
Démo en ligne
marketmap.ontwrpn.com
Ouvrir

En ligne — chargez un jeu de données de démo, ou collez des notes de discovery brutes, et explorez

Le visuel comme accroche, l’explicabilité comme confiance

Deux décisions de conception délibérées : placer le graphe réseau en premier, et rendre chaque score décomposable. Le graphe force-directed — six types de noeuds en six couleurs, interactif au survol et au clic — gagne la confiance avant que le tableau classé ne demande à quiconque de lire des chiffres. C’est le point d’entrée vers un jeu de données dense. Le tiroir de décomposition est le deuxième pilier de confiance : quatre barres de progression codées par couleur (sévérité = rouge, WTP = bleu, concurrence = violet, preuves = ambre), avec les URL de source en ligne. Un PM qui examine une opportunité voit exactement quelles entrées ont déterminé le score et clique jusqu’aux preuves d’origine.

Carte réseau : la première chose qu’un visiteur voit sur desktop

Tiroir de décomposition : chaque score remonte jusqu’à ses entrées

Chaque opportunité dispose d’une route /opportunity/:id/brief — composantes du score, paysage concurrentiel (quels concurrents adressent ce segment et quels points de douleur ils laissent à découvert), les trois principaux signaux d’appui, les questions ouvertes et la prochaine étape selon la catégorie de décision. Le CSS @media print le rend compatible PDF sans navigateur headless. La page de brief est la sortie la plus partageable : une URL, et non la capture d’écran d’un tableur.

Brief imprimable : partageable via une URL directe, compatible PDF grâce au print CSS

L’accessibilité a été une contrainte de premier ordre d’un bout à l’autre du projet : lien skip-to-content, lignes de tableau navigables au clavier (Tab + Entrée/Espace pour ouvrir le tiroir de décomposition), pièges de focus sur le tiroir et la fenêtre modale de collage, aria-modal et aria-labelledby sur toutes les superpositions, role="progressbar" sur les barres de score, prise en charge de reduced-motion, et un ratio de contraste minimum de 7,0:1 sur le texte atténué. WCAG 2.2 AA partout.

Quatre semaines, en solo, de l’hypothèse à la mise en ligne — avec une rétrospective honnête

Construit en quatre semaines jalonnées (13 janvier – 10 février 2026) : la semaine 1 a livré l’import CSV → tableau scoré, graphe réseau, matrice d’opportunités. La semaine 2 a ajouté la heatmap de fonctionnalités concurrentes, la fenêtre modale de collage (la friction était le principal frein à la première utilisation — ajoutée plus tôt que prévu) et un audit complet d’accessibilité WCAG 2.2 AA. La semaine 3 a livré la page de brief d’opportunité, la copie en Markdown et l’export PDF via print CSS (ajouté quand les tests sur mobile ont révélé l’absence de sortie propre). Semaine 4 : visite guidée via driver.js, jeu de données de démo EdTech, finitions visuelles.

Stack : React 18 + Vite + Tailwind CSS en front-end, react-force-graph-2d (basé sur canvas, encaisse 50+ noeuds sans à-coups de mise en page), Recharts pour le nuage de points de la matrice d’opportunités, driver.js (13 Ko gzippé) pour la visite guidée. FastAPI + Python en back-end, pandas pour la formule de scoring en six lignes, networkx pour la construction du graphe, slowapi pour limiter le débit à 15 req/min par IP sur les endpoints d’écriture. Conteneur Docker unique sur Coolify (Hetzner), uvicorn sert la SPA et /api sur la même origine, auto-déploiement depuis GitHub à chaque push. €0 d’hébergement, 7 endpoints API.

Ce que je ferais autrement : commencer par la fenêtre modale de collage, pas par le CSV — la plupart des visiteurs n’arrivent pas avec un CSV de recherche prêt, et la modale de collage demande moins d’efforts pour une première démo. Ajouter plus tôt des URL de session partageables — la page de brief est partageable, mais le tableau de bord scoré complet ne vit que le temps de la session ; une route /session/:id adossée à une clé de 24 heures (Redis ou Upstash) permettrait aux PM de partager la carte entière. Le jeu de données EdTech a été construit la dernière semaine sous la pression du temps — solide, mais moins finement sourcé que le jeu product-tools.

En ligne, sourcé et honnête sur la suite

En ligne sur marketmap.ontwrpn.com depuis le 10 février 2026. Deux jeux de données de démo entièrement documentés, 24 opportunités sourcées, WCAG 2.2 AA, €0 d’hébergement. Les meilleurs scores de démo se regroupent entre 60 et 65 (« Vaut la peine d’être validé ») — délibérément, pas par hasard. La métrique north star : un PM passe d’un CSV de recherche à un brief d’opportunité partagé en moins de dix minutes. Ce parcours fonctionne de bout en bout. Les paris du prochain trimestre : scoring collaboratif (plusieurs membres de l’équipe apportent leurs entrées, scores moyennés pour nourrir le débat), clustering assisté par IA (on colle des retranscriptions d’interviews brutes, un LLM en extrait les points de douleur avant que le scoring commence) et URL de session partageables adossées à Upstash Redis.

Sources

Projet suivant
SpotFinder Geo