Le temps passé à traiter les demandes administratives a un impact sur la satisfaction des citoyens. L'amélioration des flux de travail administratifs est donc un objectif important pour les mairies. Un flux de travail est constitué d'un point de départ, de plusieurs étapes de processus parallèles ou séquentielles (contenant une à plusieurs actions, et un temps d'achèvement théorique) et de points de décision (Figure 1) à traiter par les employés des différents services de la mairie.
Chaque mairie construit les flux de travail à sa manière et chaque service et utilisateur gère le flux de travail différemment, il est donc difficile de se faire une idée de l'utilisation réelle des flux de travail et des améliorations possibles. Les mairies ont donc besoin d'un outil pour visualiser les flux de travail (étapes, utilisateurs, services, temps passé) et identifier les goulots d'étranglement (temps passé à chaque étape, date d'achèvement en retard) afin d'améliorer leurs services.
Il est possible de répondre à ces besoins en affichant un ensemble de divers indicateurs spécifiques dans un outil de veille stratégique (figure 2), ou en représentant et en faisant naviguer les données dans leur ensemble dans une visualisation interactive des données. La question à laquelle nous essayons de répondre est la suivante :
Quels sont les avantages et les inconvénients d'une visualisation interactive des données ?
par rapport à un tableau de bord de Business Intelligence ?
Inspirés par les travaux de recherche sur les visualisations de flux [1,2,6,7], les représentations d'événements temporels [4,5] et les outils d'exploration de processus [3,8], nous avons mené plusieurs itérations de conception entre le DRIT et Berger-Levrault Espagne. Le résultat est une interface interactive divisée en deux étapes :
1. Visualiser les flux de travail en fonction de leur fréquence d'utilisation et de leur taux de retard.
Ce premier écran présente un diagramme ScatterPlot (Figure 3). Chaque point représente un flux de travail. Les points sont placés le long de deux axes. L'axe vertical représente le ratio de retard du flux de travail (quel est le retard moyen du flux de travail) et l'axe horizontal présente la nombre de cas (combien de fois le flux de travail a été utilisé). La taille du point dépend de la nombre d'instances en retard (combien de fois le flux de travail a été en retard). Plus le flux de travail est haut sur la droite, plus il est utilisé et retardé, et donc plus il peut être problématique.
Cette première visualisation montre les flux de travail les plus problématiques et aide à choisir ceux qui seront affichés en détail dans la visualisation suivante.
2. Visualisation des étapes d'un flux de travail, de leur retard et de leur affectation chez les employés de la mairie
Le deuxième écran (figure 4) est divisé en trois sections, avec une divulgation progressive pour faciliter la lecture et la compréhension. L'utilisateur commence par identifier le les étapes du flux de travail les plus retardées dans la visualisation de gauche. Cette visualisation est basée sur la visualisation de l'organigramme déjà connue des utilisateurs de Simplifica, avec un code couleur pour le retard (rouge pour le retard, vert pour l'heure). En sélectionnant une étape, il peut voir le répartition des exécutions d'étapes entre les employés (diagramme de Sankey violet au milieu, l'épaisseur du lien indique le nombre d'exécutions). Enfin, il peut visualiser le comportement des employés charge de travail selon le calendrier figurant dans le graphique de flux de droite. Chaque "vague" est une tâche, dont la longueur représente la durée et l'épaisseur le délai. La superposition des vagues donne la charge de travail de l'employé à chaque instant.
Implémentation web de l'application
L'architecture de l'application est basée sur le framework Angular écrit en Type Script. Pour visualiser graphiquement les informations, nous avons choisi d'utiliser la bibliothèque D3J3. Sa polyvalence a permis de prendre l'avantage sur d'autres bibliothèques bien qu'elle doive être entièrement programmée. L'application web est basée sur architecture micro-frontale qui permet de diviser la visualisation en différentes parties visuelles. Cette architecture récente fragmente ses composants en parties individuelles, de sorte que les différents membres de l'équipe peuvent travailler simultanément sur le code et le développement de l'application. Les différents outils de l'application permettent de communiquer entre les composants.
Nous avons développé l'application avec un composant pour chaque visualisation et des canaux de communication entre eux, comme vous pouvez le voir dans la figure 5.
Grâce à cette structure, le calcul et le formatage des données sont optimisés car ils sont partagés dans le magasin, où tous les composants sont connectés.
L'utilisateur peut maintenant utiliser l'application.
Le prototype que nous avons créé permet de comparer les retards de différents flux de travail et d'en analyser les causes. Avec un design simple et une séquence intuitive, l'utilisateur est assisté tout au long de son expérience d'utilisation. La décomposition du processus en étapes (deux visualisations) et sous-étapes (affichage progressif sur la deuxième visualisation) évite de submerger l'utilisateur d'informations. Il peut les filtrer étape par étape pour cibler précisément le problème de retard.
La prochaine étape du projet consistera à tester et à comparer les deux visualisations (le tableau de bord de la figure 2 et notre prototype) avec nos utilisateurs cibles : Mairie espagnole.
Références
[1] Aly Abdelalim et William O'brien. 2017. Visualisation de la performance des bâtiments à l'aide de diagrammes de Sankey pour améliorer le processus de prise de décision. https://doi.org/10.22360/simaud.2017.simaud.016.
[2] Sara Di Bartolomeo, Yixuan Zhang, Fangfang Sheng, et Cody Dunne. 2020. Tressage de séquences : Aperçus visuels de séquences et d'attributs d'événements temporels. IEEE Transactions on Visualization and Computer Graphics (en anglais): 1–1. https://doi.org/10.1109/tvcg.2020.3030442
[3] Christian W. Günther et Wil M.P. Van Der Aalst. 2007. Fuzzy mining - Simplification adaptative des processus basée sur des métriques multi-perspectives. Dans Lecture Notes in Computer Science (y compris les sous-séries Lecture Notes in Artificial Intelligence et Lecture Notes in Bioinformatics), 328-343. https://doi.org/10.1007/978-3-540-75183-0_24
[4] Miloš Krstajić, Enrico Bertini, et Daniel A. Keim. 2011. Cloudlines : Affichage compact d'épisodes d'événements dans des séries temporelles multiples. IEEE Transactions on Visualization and Computer Graphics (en anglais) 17, 12 : 2432-2439. https://doi.org/10.1109/TVCG.2011.179
[5] Dongning Luo, Jing Yang, Milos Krstajic, William Ribarsky, et Daniel Keim. 2012. Event river : Exploration visuelle de collections de textes avec des références temporelles. IEEE Transactions on Visualization and Computer Graphics (en anglais) 18, 1 : 93-105. https://doi.org/10.1109/TVCG.2010.225
[6] Patrick Riehmann, Manfred Hanfler, et Bernd Froehlich. 2005. Diagrammes de sankey interactifs. Dans Actes - Symposium de l'IEEE sur la visualisation de l'information, INFO VIS, 233-240. https://doi.org/10.1109/INFVIS.2005.1532152
[7] Mario Schmidt. 2008. Le diagramme Sankey dans la gestion des flux énergétiques et matériels. Journal de l'écologie industrielle 12, 2 : 173-185. https://doi.org/10.1111/j.1530-9290.2008.00015.x
[8] Minseok Song et Wil Van Der Aalst. 2007. Supporting process mining by showing events at a glance. Dans Actes du 17e atelier annuel sur les technologies et les systèmes d'information, 139-145.
