Alerting unifié

Projet : Alerting unifié
Produit cible : l’écosystème BraindCode
Type de projet : Agent 3D — Un agent conversationnel à avatar animé, branché sur l’orchestrateur et ses outils MCP.
Promesse : notifications issues de plusieurs MCP
Problème : Les utilisateurs doivent aujourd’hui comprendre notifications issues de plusieurs MCP en passant d’un logiciel et d’un serveur MCP à l’autre. Les périmètres, statuts et formats ne sont pas toujours alignés, ce qui rend les rapprochements fragiles. Une automatisation trop large peut aussi déclencher une action dans le mauvais produit. Alerting unifié doit orchestrer des lectures vérifiées et rendre chaque étape observable avant toute écriture.
Objectif : Créer une expérience transverse pour notifications issues de plusieurs MCP, en montrant clairement quelles données viennent de quel produit et où une validation humaine est exigée.

Conçois dans Figma une interface desktop et mobile dense, claire et orientée métier.

Tu vas produire l'interface d'une extension tierce du logiciel l’écosystème BraindCode, éditée par un développeur indépendant dans le cadre du Hackathon BraindCode.\n\nIDENTITÉ À RESPECTER\nMon extension est un produit distinct : elle porte son propre nom et sa propre identité, mais elle doit être visuellement compatible avec l’écosystème BraindCode et signaler clairement son appartenance à l'écosystème BraindCode.\n\nCouleur d'accent produit : #0098F3\nTypographie produit : Poppins, fallback Poppins\nLogo produit : logo BraindCode officiel, à afficher uniquement dans une mention d'appartenance du type « Extension pour l’écosystème BraindCode », jamais comme logo principal de mon application.\n\nRÈGLES D'USAGE DES LOGOS\nNe jamais déformer, incliner, recolorer ou recomposer le logo l’écosystème BraindCode ni le logo BraindCode.\nNe jamais laisser croire que l'extension est éditée par BraindCode.\nRespecter la zone de protection autour de chaque logo.\n\nSYSTÈME VISUEL DEMANDÉ\nFond clair par défaut, surfaces sombres en #161B2C, texte #000000, gris de bordure #C1C1C1, une seule couleur d'accent : #0098F3. Monospace pour tout élément technique.\nComposants : cartes, tableaux denses, badges d'état, barre latérale de navigation.\nInterface en français, sobre, orientée métier.

Écrans :
- tableau de bord transverse
- catalogue des connexions
- détail d’une exécution
- paramètres et autorisations

États à dessiner :
- chargement
- aucune connexion
- MCP indisponible
- résultats partiels
- validation requise

Entités visibles :
- produit
- serveur MCP
- outil
- routine
- journal d’exécution

Prévois les états vide, chargement, erreur, résultat et confirmation sensible.

Dessine aussi l’avatar de l’agent : anneaux concentriques en profondeur, halo d’accent, états écoute, réflexion, exécution et erreur.