Project Agora

Description

Project Agora est une plateforme web open-source permettant à plusieurs intelligences artificielles de collaborer entre elles pour concevoir la structure complète d'un projet logiciel à partir d'un prompt utilisateur ou d'un document explicatif.

L'objectif est de produire :

• Une architecture logicielle complète, incluant :
  • Une hiérarchie de fichiers structurée pour le projet
  • Une spécification détaillée du contenu attendu pour chaque fichier (sans implémentation de code, uniquement une description fonctionnelle et technique)
• Un raisonnement justifié pour chaque choix technique.
• Des diagrammes explicatifs (Mermaid).
• Une synthèse finale cohérente prête à être utilisée comme base de développement.

Aucune génération de code direct n'est effectuée : seules des explications, réflexions et structures sont produites.

---

Objectif

Reproduire une table ronde d'IA spécialistes, chaque agent IA représentant un rôle spécifique :

• Architecte logiciel
• Développeur backend
• Développeur frontend
• Designer UI/UX
• Data engineer
• Chef de projet
• Éventuellement d'autres rôles selon la complexité du prompt.

Cependant, l'aspect le plus crucial de ces IA réside dans leur capacité à échanger, négocier, voire s'opposer pour déterminer collectivement la meilleure approche à adopter.

---

Exemple d'utilisation

L'utilisateur entre ceci dans l'interface :

« Je souhaite faire une application de calculatrice scientifique responsive web. »

Le système demande alors à plusieurs IA leur point de vue sur :

• Le langage ou framework le plus adapté
• L'organisation du projet (folders, modules)
• Les fichiers essentiels
• Les interactions front/back éventuelles
• Le design minimal (UI/UX conceptuel)

Elles discutent pour converger vers un consensus, puis produisent une fiche conceptuelle du projet au format structuré (JSON + affichage visuel + diagrammes Mermaid).

---

Architecture technique

Stack principal

• Frontend: Vue.js 3 + Vite
• Backend: Node.js + Express
• AI Layer: Multi-agent système avec Mistral API
• Storage: SQLite + JSON backup
• Diagrammes: Mermaid.js

Architecture globale

graph TD
    A[Frontend: Vue.js 3] -->|User Prompt| B[Backend: Node.js]
    B -->|Orchestration| C[AI Layer: Mistral Agents]
    C -->|Debate Data| D[Storage: SQLite/JSON]
    C -->|Diagram Specs| E[Mermaid Engine]
    E -->|SVG/Render| A
    D -->|History| A

---

Fonctionnalités

Deux modes de collaboration

1. Mode Débat Classique (Original)

• 4 agents spécialisés qui débattent en parallèle : Architecte logiciel, Ingénieur backend, Ingénieur frontend, Designer UI/UX
• Sélection automatique des agents pertinents selon le contexte du projet
• Débat collaboratif : Les agents échangent et négocient pour converger vers la meilleure solution
• Système de consensus avec vote pondéré (l'architecte a une voix prépondérante)
• Résultats reçus simultanément

2. Mode Conception Collaborative (Nouveau 🚀)

• 7 agents spécialisés : Architecte Lead, Ingénieur backend, Ingénieur frontend, Designer UI/UX, Ingénieur DevOps, Chef de produit, Spécialiste Sécurité
• Création itérative : L'Architecte Lead crée d'abord un document initial complet
• Tours de table : Chaque agent revoit séquentiellement le document et propose des améliorations
• Document évolutif : Le document s'améliore à chaque passage d'agent
• Convergence naturelle : Le processus continue jusqu'à ce qu'aucun agent ne propose de modifications
• Traçabilité complète : Historique complet de toutes les modifications avec justifications
• Format flexible : Support Markdown (.md) et texte brut (.txt)
• Export facile : Téléchargez le document final en format désiré

Système multi-agents IA

• Intégration Mistral AI pour génération de réponses intelligentes et contextuelles
• System prompts spécialisés pour chaque rôle d'agent
• Contexte intelligent : Les agents voient l'historique et le document actuel

Interface et visualisation

• Saisie de prompt décrivant le projet souhaité
• Visualisation en temps réel des échanges entre agents via WebSocket
• Affichage structuré des propositions avec justifications et niveaux de confiance
• Rendu automatique de diagrammes Mermaid intégrés dans les réponses
• Indicateurs de progression et statuts du débat

Architecture et stockage

• API REST pour gestion des débats et récupération des résultats
• WebSocket pour streaming temps réel des réponses des agents
• Base SQLite pour persistance des débats et historique
• Gestion d'erreurs avec fallbacks et réponses de secours

---

Démarrage rapide

Prérequis

• Node.js 18+
• Clé API Mistral AI (obtenir ici)

Installation

1. Backend

cd backend
npm install
cp .env.example .env
# Éditer .env et ajouter votre MISTRAL_API_KEY
npm start

2. Frontend

cd frontend
npm install
npm run dev

3. Accéder à l'application

• Frontend: http://localhost:5173
• Backend API: http://localhost:3000
• WebSocket: ws://localhost:3000

---

Flux utilisateur

Mode Débat Classique

sequenceDiagram
  participant User
  participant Orchestrator
  participant AI_Architect
  participant AI_Designer
  participant AI_Engineer
  User->>Orchestrator: Prompt project
  Orchestrator->>AI_Architect: Generate approach
  Orchestrator->>AI_Designer: Discuss UI/UX
  Orchestrator->>AI_Engineer: Suggest modules
  AI_Architect-->>Orchestrator: Architecture proposal
  AI_Designer-->>Orchestrator: Interface ideas
  AI_Engineer-->>Orchestrator: Technical design
  Orchestrator-->>User: Final structured response + diagram

Mode Conception Collaborative

sequenceDiagram
  participant User
  participant Orchestrator
  participant Lead_Architect
  participant Agents
  User->>Orchestrator: Prompt project + format choice
  Orchestrator->>Lead_Architect: Create initial document
  Lead_Architect-->>Orchestrator: v1 Document
  Orchestrator->>Agents: Review document Round 1
  Agents-->>Orchestrator: Modifications proposed
  Orchestrator->>Agents: Review document Round 2
  Agents-->>Orchestrator: No changes OR more modifications
  Orchestrator-->>User: Final document + full history

---

Utilisation du Mode Conception Collaborative

Étapes

1. Sélectionner le mode : Cliquez sur "Collaborative Design" depuis l'écran d'accueil
2. Décrire le projet : Entrez une description détaillée de votre projet logiciel
3. Configurer :
   • Format du document : Choisissez entre Markdown (.md) ou Texte brut (.txt)
   • Nombre d'agents : 3 (Quick), 5 (Balanced), ou 7 (Comprehensive)
4. Lancer la session : Cliquez sur "Start Collaborative Design Session"
5. Suivre la progression :
   • Visualisez le document en évolution en temps réel
   • Consultez la timeline pour voir qui a fait quoi
   • Lancez les tours de table avec le bouton "Next Review Round"
6. Convergence automatique : Le système arrête automatiquement quand tous les agents sont satisfaits
7. Télécharger : Exportez le document final en format choisi

Exemple d'utilisation

Prompt utilisateur :

Je veux créer une plateforme de gestion de projets collaboratifs en temps réel,
avec support pour les équipes distribuées. Fonctionnalités clés: gestion des tâches,
communication temps réel, partage de fichiers, intégrations externes.
Besoin de scalabilité pour 10,000+ utilisateurs simultanés.

Résultat :

• Round 1 : Lead Architect crée le document initial avec architecture générale
• Round 2 : Backend Engineer revoit et ajoute détails API et base de données
• Round 3 : Frontend Engineer améliore avec structure UI et composants
• Round 4 : UI Designer ajoute guidelines UX et patterns
• Round 5 : DevOps Engineer propose infrastructure et déploiement
• Round 6 : Product Manager aligne avec besoins métier
• Round 7 : Security Specialist ajoute mesures de sécurité
• Convergence : Plus aucune modification proposée ✓

Document final : Spécification architecturale complète et cohérente !

---

Licence

MIT License — Open-source