Removed:
- All emojis from code and UI (using minimal styling instead)
- Classic debate mode completely (orchestrator.js, debate.js routes)
- Debate components (DebateThread.vue, PromptInput.vue)
- Debate store (debate.js)
- Unused database tables (debates, responses)
Simplified:
- App.vue: Single direct flow (input -> session)
- Backend: Only /api/collaborate routes
- NetworkStatus: Simple dot indicator with colors
- README.md: Consolidated documentation
- UX: Cleaner, more minimal interface
Cleanup focused on keeping only collaborative design system
Files removed: 6 | Files modified: 6
🤖 Generated with Claude Code
Co-Authored-By: Claude <noreply@anthropic.com>
201 lines
6.2 KiB
Markdown
201 lines
6.2 KiB
Markdown
# Project Agora
|
|
|
|
## Description
|
|
|
|
Project Agora est une plateforme web permettant à plusieurs intelligences artificielles de **collaborer** pour concevoir une architecture logicielle complète à partir d'une **description de projet** et optionnellement d'une **documentation contexte**.
|
|
|
|
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
|
|
|
|
```mermaid
|
|
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
|
|
|
|
### Conception Collaborative par IA
|
|
|
|
- **7 agents spécialisés** : Architecte, Backend Engineer, Frontend Engineer, UI Designer, DevOps Engineer, Product Manager, Security Specialist
|
|
- **Création itérative** : Lead Architect crée le document initial
|
|
- **Tours de table** : Chaque agent revoit et propose des améliorations
|
|
- **Document évolutif** : Amélioration progressive à chaque passage
|
|
- **Convergence naturelle** : Arrêt automatique quand tous les agents sont satisfaits
|
|
- **Traçabilité complète** : Historique de toutes les modifications
|
|
- **Format Markdown** : Output toujours en Markdown (.md)
|
|
- **Context files** : Support d'upload de fichiers MD/TXT en entrée (optionnel)
|
|
- **Network monitoring** : Indicateur temps réel de latence et qualité réseau
|
|
|
|
### 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](https://console.mistral.ai/))
|
|
|
|
### Installation
|
|
|
|
**1. Backend**
|
|
```bash
|
|
cd backend
|
|
npm install
|
|
cp .env.example .env
|
|
# Éditer .env et ajouter votre MISTRAL_API_KEY
|
|
npm start
|
|
```
|
|
|
|
**2. Frontend**
|
|
```bash
|
|
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
|
|
|
|
```mermaid
|
|
sequenceDiagram
|
|
participant User
|
|
participant Backend
|
|
participant Agents
|
|
User->>Backend: Project description + optional context file
|
|
Backend->>Agents: Lead Architect creates initial document
|
|
Agents-->>Backend: Document v1
|
|
Backend->>Agents: Round 1: Review and improve
|
|
Agents-->>Backend: Updates proposed
|
|
Backend->>Agents: Round 2-N: Review updated document
|
|
Agents-->>Backend: More updates OR no changes
|
|
Backend-->>User: Final Markdown document + history
|
|
```
|
|
|
|
---
|
|
|
|
## Utilisation
|
|
|
|
### Étapes
|
|
|
|
1. **Décrire le projet** : Entrez une description détaillée
|
|
2. **Ajouter un contexte** (optionnel) : Upload un fichier MD ou TXT
|
|
3. **Sélectionner** : Nombre d'agents (3, 5, ou 7)
|
|
4. **Lancer** : Start Design Session
|
|
5. **Suivre** :
|
|
- Visualisez le document en temps réel
|
|
- Consultez la timeline
|
|
- Lancez les tours avec "Next Review Round"
|
|
6. **Résultat** : Document Markdown téléchargeable
|
|
|
|
### Exemple
|
|
|
|
Entrée:
|
|
```
|
|
Plateforme gestion projets temps réel, équipes distribuées,
|
|
gestion tâches, communication, partage fichiers, 10K+ users
|
|
```
|
|
|
|
Processus:
|
|
- Round 1: Lead Architect - Architecture générale
|
|
- Round 2: Backend - APIs et base de données
|
|
- Round 3: Frontend - Structure UI
|
|
- Round 4: UI Designer - Guidelines UX
|
|
- Round 5: DevOps - Infrastructure
|
|
- Round 6: Product Manager - Besoins métier
|
|
- Round 7: Security - Mesures sécurité
|
|
|
|
Sortie: Spécification architecturale Markdown complète
|
|
|
|
---
|
|
|
|
## Licence
|
|
|
|
MIT License — Open-source
|