Trace 6 - UI d'export et historique utilisateur
Nouvelle expérience utilisateur pour les exports Cockpit.
Compréhension des besoins métier et utilisateurs
Conception d'une architecture d'export robuste
Communication et documentation technique
Trace 6
Rendre l'export visible pour l'utilisateur
Trace 6 - Nouveau menu d'export Cockpit : actions, lien de recherche, derniers exports et téléchargement.
La Trace 6 ci-contre est une copie d'écran du nouveau menu d'export Cockpit. Elle montre comment le travail technique réalisé sur les jobs a été rendu visible dans l'interface : historique, statut, progression, téléchargement et suppression d'un fichier généré. Avant cette évolution, l'export était surtout une action cachée : l'utilisateur cliquait, attendait, puis récupérait ou non un fichier. Le travail d'interface a donc servi à transformer une contrainte technique en expérience compréhensible.
Les zones de l'interface représentent les actions importantes pour l'utilisateur. Une première partie sert à lancer l'export ou à retrouver la recherche associée. Une autre partie liste les derniers exports disponibles. Les informations affichées, comme la taille, la période ou le statut, donnent un contexte qui manquait dans l'ancien fonctionnement. J'ai aussi retravaillé cette UI pour réutiliser PrimeNG : cela permet de garder la même charte graphique, les mêmes couleurs et les mêmes composants que le reste de l'application, au lieu d'introduire une interface isolée.
- L'utilisateur voit les exports en cours et les fichiers disponibles.
- La progression indique d'abord l'envoi des données, puis la génération du fichier.
- Les fichiers restent disponibles dans l'historique et sont supprimés automatiquement après une période définie.
La première étape pour mettre en place cette interface a été de relier le besoin utilisateur aux informations disponibles côté backend. Il fallait afficher un état simple, mais cet état dépendait de plusieurs éléments : le job, la progression, l'erreur possible, le fichier final et l'historique. Cela m'a amené à faire correspondre l'état backend et l'état affiché : les statuts du job, la progression et le lien de téléchargement doivent être cohérents avec ce que PHP stocke en base. Les libellés comme "envoi des données", "génération du fichier", "disponible" ou "en erreur" montrent aussi le travail de nommer clairement les états, pour rendre le système compréhensible sans lire la documentation technique.