1fcea6ed7d
All checks were successful
Deploy to Production / Build and Deploy (push) Successful in 7s
- Add brainstorm feature with collaborative canvas, AI idea generation, live cursors, playback, and export - Add PDF upload/extraction/ingestion pipeline with pgvector document search (RAG) - Add document Q&A overlay with streaming chat and PDF preview - Add note attachments UI with status polling, grid layout, and auto-scroll - Add task extraction AI tool and agent executor improvements - Fix NoteEmbedding missing updatedAt column, re-index 66 notes with 1536-dim embeddings - Fix brainstorm 'Create Note' button: add success toast and redirect to created note - Fix memory echo notification infinite polling - Fix chat route to always include document_search tool - Add brainstorm i18n keys across all 14 locales - Add socket server for real-time brainstorm collaboration - Add hierarchical notebook selector and organize notebook dialog improvements - Add sidebar brainstorm section with session management - Update prisma schema with brainstorm tables, attachments, and document chunks
7.4 KiB
7.4 KiB
stepsCompleted, inputDocuments
| stepsCompleted | inputDocuments | ||||||||
|---|---|---|---|---|---|---|---|---|---|
|
|
UX Design Specification Momento
Author: devparsa Date: 2026-05-14
Executive Summary
Project Vision
(Audit d'Intégration Commerciale) : Le produit de base (Éditeur, PDF, Vecteurs) est achevé et fonctionnel. L'unique objectif de cette phase UX est le "Packaging de Vente" : greffer les leviers de monétisation (Quotas, BYOK) et lever les bloqueurs légaux européens (RGPD) en s'intégrant strictement dans l'interface Ethereal Precision v2 actuelle, sans ajouter de fonctionnalités de productivité supplémentaires.
Target Users
- Utilisateurs Freemium (Cibles de conversion) : Doivent être confrontés à leurs limites d'utilisation (Quotas Redis) de manière explicite et frictionnelle dans la navigation (Sidebar) pour déclencher l'upgrade.
- Clients B2B / Administrateurs (Acheteurs) : Priorisent la rentabilité et la sécurité légale. Ils exigent une UI claire pour le contrôle des coûts de l'API (BYOK) et une gestion stricte des consentements RGPD pour s'engager.
Key Design Challenges
- Contrôle des Coûts (BYOK) : Intégrer un panel de gestion des clés BYOK dans les Paramètres Globaux du Dashboard. L'UI doit permettre l'ajout, la rotation et la validation des clés LLM externes (sécurisées via AES-256-GCM) sans perturber le flux des utilisateurs non-admin.
- Conversion & Quotas (Redis) : Intégrer un composant visuel de consommation (ex: jauge ou compteur "Discovery Pack") dans le Footer de la Sidebar existante. Ce composant doit réagir en temps réel (sous 10ms) et servir de point d'entrée prioritaire vers le tunnel d'achat (Stripe).
- Conformité Européenne (RGPD & Cookies) :
- Implémenter le bandeau de consentement Cookie (bloqueur légal) dès le premier accès.
- Créer une interface de consentement IA (NFR-GDPR4) qui bloque l'envoi de données personnelles vers des API tierces tant que l'opt-in explicite n'est pas validé.
- Ajouter un bouton "Suppression Définitive" clair dans les paramètres du compte ("Right to be Forgotten").
Design Opportunities
- L'Upgrade "Just-in-Time" : Transformer l'épuisement des quotas Redis en opportunité d'achat immédiate, via des modales contextuelles claires, plutôt qu'en simple message d'erreur.
- La Conformité comme Outil de Vente : Concevoir une modale "Privacy & Compliance" d'apparence très professionnelle, rassurant immédiatement les acheteurs B2B sur la conformité stricte aux lois européennes (EU Data Residency, Zéro-Rétention).
Core User Experience
Defining Experience
(Parcours de Monétisation et Conformité) : L'expérience centrale se définit par la fluidité avec laquelle l'utilisateur traverse les étapes légales (RGPD) et commerciales (BYOK, Quotas) sans quitter son flux de travail principal (Éditeur / Canvas).
Platform Strategy
(Intégration au Dashboard Existant) : Les interactions critiques se déploient exclusivement via des composants superposés (Modales, Toasts) ou des zones dédiées du layout existant (Footer de la Sidebar, Drawer de Configuration). Aucune nouvelle page isolée n'est créée.
Effortless Interactions
(Flux Critiques : Argent et Loi)
1. Flux d'Onboarding Légal (Cookies & IA)
- Déclencheur : Première connexion de l'utilisateur ou clic sur une fonctionnalité IA (ex. "Vague d'idéation").
- Interaction :
- Cookies : Bandeau persistant et fin en bas de l'écran avec bouton "Accepter Essentiels" ou "Gérer".
- Consentement IA (NFR-GDPR4) : Micro-modale contextuelle au moment du clic sur l'action IA. Bouton "Autoriser l'envoi à l'IA tierce" avec case à cocher pour mémorisation ("Ne plus demander").
- Zéro Friction : Le consentement est demandé "Just-in-Time", exactement là où l'utilisateur en voit l'utilité, sans le bloquer dès le login.
2. Flux de Configuration BYOK
- Déclencheur : Clic sur "Gérer mes clés" depuis l'indicateur de quota (Sidebar) ou l'interface d'administration B2B.
- Interaction : Ouverture d'un panel latéral (Settings Drawer) permettant de coller la clé API (AES-256-GCM).
- Feedback : Validation en direct de la clé. Dès validation, un badge visuel persistant (ex. "Mode BYOK Actif" avec icône de cadenas) apparaît dans le header de l'application ou de la Sidebar.
- Zéro Friction : L'utilisateur n'a jamais à choisir manuellement le mode de paiement une fois la clé validée, le routeur (LLM Router) bascule automatiquement et de manière transparente.
3. Flux d'Épuisement de Quotas (Conversion Freemium)
- Déclencheur : Consommation de jetons IA au fil de l'utilisation.
- Interaction : Dans le bas de la Sidebar existante, un micro-composant de jauge de progression (Discovery Pack) se remplit.
- Transition d'état :
- Normal : Jauge discrète (grise/bleue).
- Bloqué (100%) : La jauge passe au rouge. Le clic IA suivant ne lance plus la requête mais déclenche instantanément une modale superposée ("Upgrade to Pro" ou "Ajouter une clé BYOK").
- Zéro Friction : La modale de blocage est un pont direct vers la popup de paiement Stripe en surimpression. Pas de redirection.
Critical Success Moments
- Légalité Validée : L'utilisateur clique sur l'action IA, valide le consentement en 1 clic, et voit le résultat dans l'éditeur sans rupture.
- Autonomie B2B (BYOK) : L'administrateur colle sa clé, voit la validation visuelle ("Mode BYOK Actif") et constate instantanément le dégel de ses requêtes bloquées.
- Conversion Instantanée : Le dépassement de quota déclenche l'achat Stripe en "Overlay", l'utilisateur paie, et la jauge Sidebar redevient verte instantanément sans rechargement de la page.
Experience Principles
- Just-in-Time Compliance : Le consentement légal se demande au moment précis de l'action pour maximiser le taux d'acceptation.
- Zero-Redirect Conversion : Tout acte d'achat (Stripe) ou de configuration (BYOK) se fait sans quitter la page active.
- Visual Assurance : Le statut de paiement (BYOK vs Quota SaaS) est visible de manière périphérique sans réduire l'espace d'édition cognitif.
Technical Visual Integration Anchors
Intégration Visuelle (Règle Absolue)
- Utilisation exclusive des classes CSS et des variables de thème (couleurs, polices, espacements) du design actuel.
- Aucune invention visuelle. Aucun nouveau style. Les composants commerciaux s'insèrent strictement dans les trous libres du code existant.
Emplacement Quotas (Conversion)
- Composant : Compteur de jetons / Jauge Redis.
- Point d'ancrage : Injection directe dans le footer de la Sidebar existante.
Emplacement BYOK (Contrôle des coûts)
- Composant : Champ de saisie sécurisé.
- Point d'ancrage : Ajout dans l'écran des Paramètres actuels.
- Comportement technique : Masquage obligatoire des caractères tapés. Validation par ping API silencieux en arrière-plan sans rechargement.
Emplacement Légal (Conformité EU)
- Cookies : Bandeau ancré en bas de page de l'interface principale.
- Consentement IA : Modale déclenchée uniquement au premier clic sur l'outil IA, sans interrompre le flow global avant cette action.