Workflow Visualizer & Orchestrator

2026

Visualisation 3D & Orchestration

Ce projet permet de suivre graphiquement ce qui se passe quand des agents de code autonomes collaborent. J'ai conçu un orchestrateur en Node.js (orchestrate.js) qui répartit et délègue des tâches de développement à un agent Claude. Côté visuel, un serveur local génère une interface 3D sur le port 3000 pour cartographier le workflow et suivre la progression en temps réel.

Optimisation et économie de tokens

Au-delà du retour visuel, le but principal de cette architecture est de maximiser la rentabilité des tokens. En passant par une note synthétique indexée par la map (~75 tokens) au lieu de faire relire à chaque fois des fichiers entiers de 250 lignes (~2 500 tokens), on réduit drastiquement la consommation.

La formule de rentabilité réelle :

Économies = (Nfichiers évités × Taille) - (Nmessages × 850 t) - (Nmises à jour × 120 t)

Sur un projet complexe avec délégation d'un sous-agent (comme Claude Code), le system permet d'économiser 25 % à 60 % de tokens globaux car il évite la double lecture de découverte.

Pistes de gain maximal

Si l'on visait uniquement la rentabilité brute des tokens (au détriment du visuel), ne plus mettre à jour la position des agents sur la carte 3D à chaque étape (comme thinking, planning ou coding) ferait gagner instantanément 500 à 700 tokens par tâche (chaque commande de statut coûtant ~120 tokens dans l'historique). Alléger les instructions visuelles dans GEMINI.md ajouterait encore 200 tokens d'économie par message. Dans ce cas pur, l'économie grimperait de 40 % à 70 %.

  • Installateur automatique PowerShell et script Batch
  • Cartographie 3D interactive (React / Node.js) sur le port 3000
  • Algorithme d'orchestration avec indexation de notes de fichiers
Aperçu de l'interface 3D de Workflow Visualizer
Interface 3D de suivi du workflow
PowerShellBatchfileNode.jsAgentic AI3D Graphics