Nextflow
Un produit DeFi modulaire qui rassemble intelligence de marché en temps réel, découverte de liquidité, gouvernance et mécaniques communautaires au sein d'une expérience lisible et cohérente.
Démo frontend — l'infrastructure backend n'est pas déployée pour cette vitrine
Résultats clés
Surfaces produit
7 modules
Tableau de bord, intelligence de marché, analytique, pools, jeux, loterie et gouvernance.
Étendue des données temps réel
11 tracked tokens
Les flux de marché sont agrégés en une surface de décision unique avec des signaux de tendance.
Mécaniques communautaires
3 game loops
Des concepts play-to-earn ont été intégrés dans l'écosystème global.
Signaux de confiance
6 prize tiers
Les mécaniques de loterie et l'historique des tours ont été structurés pour une équité transparente.
Le problème
Ce que ce projet devait résoudre
Les expériences DeFi répartissent souvent l'analytique, la découverte de pools, la gouvernance et les mécaniques communautaires entre des outils déconnectés. Nextflow a été conçu pour transformer cette dispersion en un produit unique doté d'un rythme opérationnel clair.
Nextflow est né d'un problème produit simple : la plupart des utilisateurs DeFi naviguent entre tableaux de bord, explorateurs, trackers de pools et outils de gouvernance pour comprendre ce qui se passe. L'objectif était de regrouper cette expérience fragmentée en un produit unique, rapide, expressif et cohérent.
La plateforme a été construite comme une application modulaire React et TypeScript où chaque domaine possède sa propre surface, sa couche de données et son modèle d'interaction. TanStack Query gère la discipline de cache et le rafraîchissement en arrière-plan, tandis que la couche wallet et contrats abstrait les lectures et écritures on-chain en un workflow de développement prévisible.
Le résultat est un produit piloté par le marché plutôt que par les pages. Les utilisateurs peuvent scanner l'état du système, inspecter les performances, découvrir des opportunités de rendement et participer à la gouvernance sans perdre le contexte ni être submergés par la complexité brute des protocoles.
Ce qui a changé
Au lieu de contraindre les utilisateurs à assembler manuellement des tableaux de bord tiers et des outils protocolaires, la plateforme leur offre un espace cohérent pour surveiller les marchés, comparer les opportunités, passer à l'action et rester engagés dans l'écosystème.
Pourquoi c'était difficile
Le défi ne résidait pas seulement dans l'intégration des données. Il fallait déterminer le juste dosage de mouvement, de contexte et d'abstraction avant que le produit ne perde en crédibilité. Le système devait paraître vivant sans sacrifier la vitesse de lecture ni la clarté décisionnelle.
Contraintes
- Les données en temps réel provenant de multiples API et sources on-chain devaient rester lisibles à la vitesse d'un produit grand public.
- Le produit nécessitait une forte densité d'information sans devenir visuellement épuisant.
- Chaque domaine devait rester suffisamment modulaire pour être livré indépendamment et évoluer rapidement.
Mon rôle
- Responsable de l'architecture produit de bout en bout et de la conception système frontend.
- Structuration des modules marché, pools, gouvernance et jeux autour d'une discipline de données partagée.
- Conception de la connectivité wallet et des flux d'interaction avec les smart contracts pour une livraison reproductible.
- Équilibre entre des patterns UI cinétiques et la clarté nécessaire à la prise de décision financière.
Preuves
À quoi ressemble réellement le produit
Captures d'écran réelles du produit — chacune illustre un argument concret de clarté, de contrôle ou d'observabilité.
Surface de signauxCliquer pour agrandirTableau de bord Market Pulse
Une surface d'accueil qui permet aux utilisateurs de comprendre l'état du système en quelques secondes, sans naviguer entre de multiples vues protocolaires.
La disposition des KPI et des sparklines a été pensée pour un balayage rapide avant toute interaction approfondie.
Aide à la décisionCliquer pour agrandirCouche analytique
Des tableaux classés et des vues graphiques transforment des données de pool bruyantes en signaux produit comparatifs.
Cette surface réduit le bruit brut des protocoles en un ordre de lecture exploitable par les utilisateurs.
Lentille de rendementCliquer pour agrandirDécouverte de liquidité
Les vues de pools orientées APR font de la découverte d'opportunités une fonctionnalité produit plutôt qu'un exercice sur tableur.
Les métriques dérivées sont présentées avec des hypothèses explicites afin que l'interface reste exploitable et honnête.
Boucle communautaireCliquer pour agrandirHub de jeux
Les modules gamifiés prolongent l'engagement sans paraître greffés artificiellement ni déconnectés de l'identité de la plateforme.
Le mouvement et la chorégraphie des cartes ont été utilisés pour créer de l'énergie tout en préservant la lisibilité.
Couche de confianceCliquer pour agrandirConsole de gouvernance
La visibilité des propositions, la progression des votes et le système de tags ont été conçus pour rendre la participation à la gouvernance compréhensible.
L'objectif était de rendre la gouvernance navigable pour des utilisateurs qui ne sont pas déjà des power users du protocole.
Décisions
Les compromis qui ont façonné le produit
Le travail le plus solide se révèle dans les choix faits sous pression, pas seulement dans l'interface finale.
Des domaines modulaires plutôt qu'un tableau de bord monolithique
Défi
Le produit couvrait trop de cas d'usage distincts pour tout regrouper dans un modèle d'interface unique.
Décision
Chaque domaine est devenu un module autonome avec ses propres composants, hooks et contrats de données.
Compromis
Cela a accru la coordination autour des patterns partagés, mais a empêché le produit de s'effondrer en un monolithe fragile.
Des signaux d'opportunité dérivés plutôt que des tableaux de pools bruts
Défi
La chasse au rendement devient inutilisable lorsque les utilisateurs doivent interpréter chaque pool depuis zéro.
Décision
Les dérivations d'APR, le filtrage par rendement élevé et l'analytique comparative ont été promus au rang de fonctionnalités produit de premier plan.
Compromis
Les métriques dérivées exigent une explication et une validation plus rigoureuses, mais elles rendent le produit significativement plus utile.
Des visuels cinétiques avec des limites strictes sur le bruit
Défi
Une marque Web3 peut devenir illisible si chaque surface se comporte comme une animation de lancement.
Décision
Le mouvement a été concentré autour des transitions, de la mise en focus des cartes et des moments de découverte, tandis que les graphiques et les surfaces de KPI restaient disciplinés.
Compromis
Un calibrage visuel plus poussé a été nécessaire, mais le résultat est dynamique sans perdre en crédibilité.
Architecture
Comment les données circulent dans le système
Entrées temps réel
CoinGecko, DexScreener et les lectures on-chain fournissent les signaux bruts de marché et de protocole.
→ Des entrées multi-sources fraîches sans exposer les utilisateurs à la complexité de chaque source.
Orchestration des requêtes
TanStack Query gère le polling, la stratégie de stale-time, la réutilisation du cache et le rafraîchissement en arrière-plan.
→ Une sensation de temps réel avec un comportement réseau prévisible et une gestion d'état UI plus propre.
Modules par domaine
Marchés, pools, jeux et gouvernance fonctionnent chacun comme des modules produit ciblés.
→ Des itérations plus rapides et des frontières produit plus claires à travers l'expérience.
Couche wallet + contrats
wagmi, viem et ethers abstraient les lectures et écritures en patterns d'interaction réutilisables.
→ Des actions utilisateur plus sûres et plus cohérentes sur l'ensemble de la surface DeFi.
Surfaces d'action guidées
Les tableaux de bord, l'analytique et les vues de gouvernance transforment la complexité protocolaire en flux UI lisibles.
→ Les utilisateurs peuvent décider et agir sans rebondir entre des outils déconnectés.
Nextflow utilise une architecture frontend basée sur les domaines où chaque module possède son propre modèle d'interaction, ses hooks de données et ses surfaces UI. TanStack Query constitue l'épine dorsale opérationnelle pour les données en temps réel, tandis que les interactions wallet et contrats sont abstraites en patterns reproductibles qui maintiennent l'exploration de marché et les actions utilisateur synchronisées.
Surfaces produit
Les interfaces qui portent l'expérience
Tableau de bord
La surface de commande principale agrège les mouvements de marché en temps réel, les signaux de la watchlist et les KPI de haut niveau en une vue à balayage rapide.
Intelligence de marché
Une vue de marché élargie fait apparaître les changements de tendance, les signaux d'activité et des comparaisons classées entre les actifs suivis.
Analytique
Des graphiques comparatifs et des tableaux classés rendent les performances des pools et des tokens lisibles sans pousser les utilisateurs vers des outils d'analytique externes.
Pools de liquidité
L'exploration des pools se concentre sur la découverte comparative d'opportunités avec dérivation d'APR, vues détaillées et chemins d'action directs.
Hub de jeux
Les modules communautaires prolongent la rétention et l'identité de la plateforme sans fragmenter l'expérience.
Loterie
Une surface de loterie transparente rassemble compte à rebours, structure des prix et signaux d'équité dans une boucle d'interaction lisible.
Gouvernance
Les vues de gouvernance rendent les propositions, le poids des votes et les résultats accessibles plutôt que réservés aux seuls initiés du protocole.
Stack technique
Construit avec
Framework
UI
Web3
Data
Langages
TypeScriptSolidity (smart contracts)CSS/TailwindCe que ce projet démontre