====== UX Platform ====== ===== Objectif ===== Créer une couche transverse d'expérience utilisateur permettant à toutes les interfaces de la plateforme de partager la même navigation, les mêmes composants, les mêmes comportements et les mêmes mécanismes d'interaction. Cette couche ne contient aucune logique métier. Elle orchestre uniquement l'expérience utilisateur. Elle constitue le socle commun de : * Platform Console * Tenant Console * Experience Builder * Platform Marketing Website * Tenant Marketing Website * Owner Portal * Guest Portal ---- ====== Architecture ====== La UX Platform est composée de plusieurs moteurs indépendants. UX Platform ├── Design System ├── Layout Engine ├── Navigation Engine ├── Workspace Engine ├── Search Engine ├── Command Palette Engine ├── Context Engine ├── Activity Engine ├── Notification Center ├── Favorites Engine ├── Help Engine ├── Personalization Engine ├── Widget Engine ├── Dashboard Engine ├── Timeline Engine ├── Document Preview Engine └── Theme Engine Chaque moteur est indépendant. Tous sont réutilisés par les interfaces. ---- ====== Design System ====== Objectif : Garantir une identité visuelle unique. Responsabilités : * couleurs * typographies * espacements * animations * composants * responsive * accessibilité WCAG Composants : * boutons * formulaires * tableaux * dialogues * cartes * timelines * calendriers * graphiques ---- ====== Layout Engine ====== Objectif : Construire automatiquement les pages. Layouts disponibles : * plein écran * console * cockpit * portail * site marketing Le moteur adapte automatiquement le layout selon : * interface * rôle * appareil ---- ====== Navigation Engine ====== Objectif : Construire automatiquement les menus. Les menus sont calculés à partir de : * rôle * permissions * abonnement * modules installés * marque * préférences utilisateur Le moteur interdit toute navigation supérieure à trois niveaux. ---- ====== Workspace Engine ====== Objectif : Organiser les fonctionnalités par activité métier. Exemple Tenant Console : Accueil Mon activité Commercial Patrimoine Séjours Finance Marketing Configuration Chaque Workspace est totalement indépendant. ---- ====== Search Engine ====== Objectif : Rechercher tous les objets métier. Recherche : * tenants * users * owners * guests * biens * réservations * contrats * factures * documents * tickets La recherche est disponible sur toutes les interfaces. ---- ====== Command Palette Engine ====== Objectif : Permettre l'accès rapide aux fonctionnalités. Raccourci : CTRL + K Recherche : * écrans * commandes * actions * objets * documentation Exemples : Créer une réservation Créer un owner Publier le site Créer un contrat Ajouter un bien ---- ====== Context Engine ====== Objectif : Maintenir le contexte utilisateur. Depuis une réservation, le moteur connaît automatiquement : * guest * owner * property * contrat * facture * paiements * messages L'utilisateur ne revient jamais au menu principal. ---- ====== Activity Engine ====== Objectif : Présenter le travail restant. Le moteur agrège : * tâches * validations * workflows * signatures * messages * incidents * alertes Chaque utilisateur dispose de son Activity Hub. ---- ====== Notification Center ====== Objectif : Centraliser toutes les notifications. Types : * information * rappel * validation * alerte * urgence Canaux : * interface * email * SMS * push * webhook ---- ====== Favorites Engine ====== Objectif : Personnaliser l'interface. Supporte : * menus favoris * recherches * tableaux * propriétaires * biens * guests * réservations Les favoris apparaissent dans le Cockpit. ---- ====== Help Engine ====== Objectif : Afficher l'aide contextuelle. Supporte : * aide rapide * tutoriels * vidéos * FAQ * documentation * onboarding L'utilisateur ne quitte jamais l'application. ---- ====== Personalization Engine ====== Objectif : Adapter automatiquement l'interface. Paramètres : * langue * thème * densité * taille police * raccourcis * widgets * favoris Chaque utilisateur dispose de son propre profil. ---- ====== Widget Engine ====== Objectif : Construire toutes les pages. Widgets disponibles : * KPI * Tableau * Calendrier * Carte * Timeline * Documents * Messages * Activités * Graphiques * Formulaires Chaque widget est : * déplaçable * redimensionnable * configurable * réutilisable ---- ====== Dashboard Engine ====== Objectif : Construire les Cockpits. Chaque Cockpit est composé de widgets. Le Dashboard classique disparaît. Chaque rôle dispose de son Cockpit. ---- ====== Timeline Engine ====== Objectif : Présenter l'historique des objets métier. Supporte : * réservation * guest * owner * property * tenant * contrat Chaque événement est horodaté. ---- ====== Document Preview Engine ====== Objectif : Prévisualiser les documents. Supporte : * PDF * Images * Office * Contrats * Factures Sans téléchargement. ---- ====== Theme Engine ====== Objectif : Appliquer automatiquement la charte graphique. Le thème dépend : * plateforme * tenant * marque * portail Le même moteur est utilisé par toutes les interfaces. ---- ====== Fiches 360° ====== Tous les objets principaux disposent d'une fiche unique. Sont concernés : * Tenant * User * Owner * Guest * Property * Reservation * Contract * Invoice * Ticket Chaque fiche contient : * informations * activité * documents * messages * statistiques * historique * actions ---- ====== Cockpits ====== Chaque rôle possède son Cockpit. Exemples : Platform Owner Tenant Manager Sales Agent Billing Owner Guest Le Cockpit présente uniquement les informations utiles. ---- ====== UX API ====== La UX Platform expose une API interne. Exemples : GET /ui/navigation GET /ui/workspaces GET /ui/widgets GET /ui/dashboard GET /ui/search GET /ui/help GET /ui/context GET /ui/favorites GET /ui/activity GET /ui/theme ---- ====== Architecture technique ====== Le monorepo contient : packages/ ui-core/ ui-design-system/ ui-layout/ ui-navigation/ ui-search/ ui-command-palette/ ui-dashboard/ ui-widgets/ ui-context/ ui-notifications/ ui-help/ ui-theme/ ui-timeline/ Chaque frontend importe uniquement les moteurs nécessaires. ---- ====== Définition de terminé ====== La UX Platform est terminée lorsque : ✓ toutes les interfaces utilisent le même Design System ✓ tous les menus sont générés automatiquement ✓ toutes les fiches sont des vues 360° ✓ la recherche globale est disponible ✓ la Command Palette est disponible ✓ les Cockpits remplacent les anciens Dashboards ✓ les Workspaces remplacent les menus traditionnels ✓ toutes les pages sont composées de widgets ✓ la personnalisation utilisateur est centralisée ✓ l'aide est intégrée partout ✓ les futures fonctionnalités peuvent être ajoutées sans modifier la navigation.