Votre guide pour créer un tableau de bord low-code

Lorsque nous parlons de tableaux de bord low code, nous faisons généralement référence aux pages à écran unique de votre application, spécialement conçues pour aider les utilisateurs à comprendre les domaines qui nécessitent leur attention. Cependant, il existe plusieurs types de tableaux de bord. Nous allons donc parler des deux principaux types de tableaux de bord que vous rencontrerez lors de la conception et de la création de systèmes.
Cet article vous donnera des conseils pour concevoir un tableau de bord adapté aux besoins que vous essayez de traiter et vous expliquera comment créer vos données pour un tableau de bord. J'aborderai également les tableaux de bord de reporting externes et la manière dont nous pouvons faire apparaître des données pour qu'ils puissent les utiliser.
Gardez à l'esprit que tout ceci n'est qu'une ligne directrice. Il n'existe pas de règles strictes en matière de tableau de bord. Parfois, vous avez besoin d'un tableau de bord de reporting dans votre application. Parfois, vous avez besoin d'avoir beaucoup de données sur un tableau de bord. Vous devez toujours être ouvert aux nouvelles idées et possibilités, mais n'oubliez pas non plus de faire marche arrière si nécessaire !
Si vous voulez une version TL;DR, alors consultez le Mendix – Guide rapide sur le tableau de bord!
Types de tableaux de bord
Lorsque vous développez une application, il arrive un moment où vous aurez besoin d'un tableau de bord. Il y a de fortes chances que le premier type de tableau de bord que vous rencontrerez soit un tableau de bord exploitable, le type de tableau de bord que vous utilisez comme page de destination pour un utilisateur.
Ce type de tableau de bord peut être utilisé pour montrer à un administrateur ses tâches de la journée et quelques avertissements sur les problèmes en suspens, ou pour montrer à un client ses commandes récentes et quelques nouveaux produits qu'il pourrait aimer. Il s'agit de tableaux de bord qui montrent à l'utilisateur des informations pertinentes sur ce qu'il va faire maintenant. En d'autres termes, ils doivent refléter les données actuelles et le guider vers sa prochaine action.
L'autre type majeur de tableau de bord est le tableau de bord de reporting. Ces tableaux de bord sont destinés à gérer une plus grande quantité de données cumulées et sont utilisés pour analyser les performances à plus grande échelle. Il peut s'agir des performances d'une équipe sur un mois donné ou de l'ensemble de l'entreprise sur une année. L'essentiel est qu'il s'agisse de BEAUCOUP d'informations.
Parmi ces deux types, nous nous intéressons principalement aux tableaux de bord exploitables, car ce sont les types de tableaux de bord que vous souhaiterez intégrer à votre Mendix application. Nous aborderons les tableaux de bord de reporting pour discuter de la manière d'exposer les données pour eux, mais la conception de tableaux de bord de reporting est un sujet qu'il vaut mieux laisser aux experts en Business Intelligence.
Concevoir un tableau de bord low-code exploitable
Il est important de définir dès le départ, lors de la conception de votre tableau de bord, la période sur laquelle porteront les données. Le meilleur conseil que je puisse vous donner est de la garder aussi courte que possible. Vous ne souhaitez pas agréger de grands ensembles de données. Une période de sept jours est généralement suffisante. Un mois (30 jours) est généralement la limite supérieure.
Voici quelques principes directeurs à suivre lors de la conception de votre tableau de bord :
- Moins c'est plus – N'essayez pas de surcharger votre tableau de bord. Tout ce que vous y mettez doit ajouter de la valeur.
- Limitez-vous à un seul écran – Le contenu de votre tableau de bord doit tenir sur un seul écran, quel que soit le type d'appareil que vous ciblez. Si l'utilisateur doit faire défiler la page pour voir les éléments, vous en avez probablement ajouté trop. (Cela est légèrement moins important pour les tableaux de bord mobiles)
- Temps de chargement courts – Il est facile de créer un tableau de bord qui prend du temps à charger car il regroupe des données. Vous devez essayer de garder les temps de chargement aussi courts que possible (comme pour toutes les pages d'application).
- Priorités – La plupart des utilisateurs lisent de haut en bas et de gauche à droite. Vous devez donc tenir compte de l'ordre dans lequel vous positionnez vos informations. Par exemple, les indicateurs clés de performance seront généralement sur la première ligne, car c'est ce que l'utilisateur doit prendre en compte en premier. Les graphiques peuvent généralement être placés vers le bas, car, bien qu'informatifs, ils ne sont généralement pas exploitables. Si votre public lit de droite à gauche, envisagez d'inverser votre mise en page.
Il y a quelques questions clés que vous devez prendre en compte lorsque vous concevez un tableau de bord exploitable :
- Y a-t-il des domaines clés que nous devons souligner et qui sont sous-performants/surperformants ? (KPI)
- Y a-t-il des domaines dans lesquels nous devons constater des progrès continus sur une courte période ? (Graphiques)
- Que doit faire le spectateur ensuite ? (Listes de tâches)
Comment utiliser les indicateurs de performance clés (KPI)
L’une des premières choses que vous verrez probablement lorsque vous regarderez un tableau de bord est un KPI (indicateurs clés de performance). Une façon simple de le présenter est de le présenter sous la forme d’une grande valeur numérique mise en évidence pour montrer si une certaine mesure fonctionne bien ou mal. Parfois, il peut également être utile d’afficher une valeur de référence…
En un coup d'œil, nous pouvons voir que le total des commandes sur cette période est en vert, ce qui signifie qu'elles sont supérieures à la moyenne et qu'il n'y a pas de problème à ce niveau. La valeur des livraisons retardées est en rouge, ce qui constitue donc un sujet de préoccupation. Rendre cette valeur cliquable pour vous amener à une liste des livraisons retardées serait idéal pour un contenu exploitable.
Différents types de graphiques et quand les utiliser
Que serait un tableau de bord sans un ou deux graphiques ? Ils sont amusants et aident les utilisateurs à visualiser immédiatement les données. Cependant, les graphiques sont très faciles à utiliser. Lorsque vous les ajoutez à votre tableau de bord, utilisez-les avec parcimonie et essayez de les garder simples. Voici quelques conseils de base.
Conseils sur les graphiques à barres, à lignes et à colonnes
Utilisez des graphiques à barres, à courbes et à colonnes pour comparer des ensembles de données. Si vous effectuez une comparaison dans le temps, veillez à les classer par ordre chronologique. Si ce n'est pas le cas, essayez de les afficher dans un ordre logique.
Cela peut être alphabétique ou de la valeur la plus grande à la plus petite.
N'affichez pas trop de groupes de données. Essayez de vous limiter à cinq séries maximum sur un graphique linéaire et à huit éléments maximum sur un graphique à barres ou à colonnes.
Quand ne pas utiliser de diagrammes à secteurs, de diagrammes en beignets et de cartes thermiques
Ces valeurs sont souvent mal utilisées et doivent généralement être évitées si possible. Cependant, si vous devez les utiliser, essayez de ne pas comparer trop de valeurs et ne les utilisez pas si vos ensembles de données ont des valeurs très similaires.
Pourquoi vous ne devriez pas utiliser de graphiques 3D, de graphiques trop stylisés et de jauges
Gardez vos graphiques simples. Les effets 3D et les graphiques trop stylés peuvent détourner l'attention de l'objectif réel du graphique. Essayez d'utiliser des couleurs et des formats simples pour mettre en valeur les informations importantes. De plus, les jauges étaient autrefois très populaires, mais recréer des affichages physiques numériquement est souvent une mauvaise idée. Les jauges, par exemple, sont généralement mieux représentées sous forme d'indicateurs de performance clés, comme indiqué ci-dessus.
Que doit contenir une liste de tâches ?
Une bonne façon d'inciter l'utilisateur à effectuer une action est de lui fournir une liste de tâches. Je ne parle pas nécessairement de quelque chose qui s'appelle explicitement des tâches. Une liste de tâches peut être composée de commandes à publier ou de commentaires de clients auxquels il faut répondre. Il doit s'agir de toutes les actions que l'utilisateur doit effectuer et qui doivent être exécutées dans un avenir proche ou qui sont même en retard. La liste doit être courte, si possible, pas plus de dix éléments à l'écran, et au pire, elle doit être paginée pour n'afficher qu'un sous-ensemble au premier plan.
Chaque entrée doit afficher uniquement les informations les plus pertinentes et ne pas essayer d'en montrer trop. Les éléments peuvent être cliquables afin que l'utilisateur puisse explorer en profondeur pour trouver plus d'informations si nécessaire.
S'il existe plusieurs types de tâches qui peuvent nécessiter une action de l'utilisateur, vous pouvez envisager d'utiliser un conteneur d'onglets avec un badge affichant le nombre de tâches pour chaque onglet. Sachez simplement que ce format peut facilement commencer à paraître encombré s'il est surutilisé. Essayez de ne pas utiliser plus de trois onglets.
Comment agréger vos données
Lorsque vous créez votre tableau de bord, notamment avec des KPI, vous allez vouloir agréger (regrouper, compter, additionner) certaines de vos données. Il existe plusieurs façons de procéder, certaines plus low-code que d'autres.
- Regroupez les données dont vous avez besoin à l'aide d'une source de données Microflow
- Créer et maintenir un tableau de données pré-enregistrées
- Utilisez le langage de requête objet (OQL) pour créer une requête complexe afin de regrouper vos données
Le choix de ces options dépendra de la quantité de données avec lesquelles vous travaillez, du fait que vous fassiez des comparaisons entre périodes et du nombre de bits ou de données cumulées dont vous avez besoin.
Utilisation d'une source de données microflow pour agréger des données
L'outil que vous utiliserez le plus souvent est une source de données microflow. Il s'agit simplement d'une vue de données simple sur votre page avec sa source de données définie sur un microflow qui renvoie une entité non persistante contenant des données cumulées.
Le microflux lui-même aura des récupérations de données et des actions de liste pour regrouper les données de différentes manières. Ensuite, il créera une instance de l'entité non persistante et la renverra. C'est aussi simple que ça.
Il convient de noter que lorsque vous utilisez une action de récupération et une action de liste, Mendix optimisera automatiquement votre requête pour simplement exécuter la récupération, regrouper les données, puis agréger le résultat. Les autres données d'entité ne sont jamais renvoyées (sauf si vous utilisez l'action de récupération plus tard dans la requête).
Lorsque vous commencez à récupérer de plus en plus de valeurs KPI, à comparer différentes périodes ou à utiliser des ensembles de données plus volumineux, cela peut devenir moins efficace et vous devez penser à passer à l'option suivante.
Quand et comment pré-agréger les données
Si l'agrégation de vos données à la volée pose problème, généralement en raison de requêtes longues, une alternative consiste à stocker des données pré-agrégées. Cela signifie créer une entité spécifiquement destinée à contenir des informations agrégées, ainsi qu'un horodatage de la période qu'elle représente, et l'utiliser comme source pour votre tableau de bord.
Les données seront probablement agrégées de la même manière que dans l'option précédente, à l'aide d'un microflux, mais seront généralement traitées comme une tâche planifiée. La fréquence des tâches dépend de la période de données que vous agrégez, mais en général, il s'agira d'une routine de nuit pour regrouper les données de la veille (bien que cela puisse prendre une semaine ou même un mois).
L'autre option pour la pré-agrégation consiste à incrémenter au fur et à mesure des modifications. Cela peut se faire par le biais d'une mise à jour supplémentaire dans le cadre d'un microflux de création ou d'un événement déclenché lors de la validation d'un objet. Cela dépend, encore une fois, de la quantité de données que vous attendez. Si vous avez un nombre élevé de transactions, il est probablement préférable de le planifier plutôt que de mettre à jour constamment votre table d'agrégation. Si vous recherchez des données en temps réel, vous devrez utiliser cette option.
Comment et quand utiliser le langage de requête objet (OQL)
Le choix final est d'utiliser le langage Object Query. Il vous permet d'écrire votre propre requête qui sera exécutée directement sur votre base de données. Il est préférable de l'utiliser lorsque vous devez renvoyer plusieurs agrégats, peut-être sur plusieurs groupes de données. Ce choix n'est pas destiné à ceux qui recherchent une approche véritablement low-code et est principalement adapté à ceux qui ont des connaissances préalables en SQL.
Pour l'utiliser, vous devrez d'abord installer le Widget OQL du marché et je recommanderais ensuite de vérifier le Guide OQL sur notre site de documentation.
Le cœur de ce choix consiste à créer une chaîne pour constituer votre requête, puis à utiliser l’action Exécuter l’instruction OQL et à capturer les données renvoyées dans une entité non persistante.
L'utilisation d'OQL n'est pas une tâche à prendre à la légère. Assurez-vous de déterminer si c'est la meilleure façon de résoudre votre problème spécifique et vérifiez l'efficacité de votre requête, car la plateforme ne l'optimisera pas pour vous.
Comment créer des graphiques dans Mendix
Si vous souhaitez inclure des graphiques dans votre Mendix Si vous souhaitez créer un tableau de bord, le meilleur endroit pour commencer est le widget Graphiques. Il prend en charge les éléments suivants :
- Graphiques à colonnes
- Diagramme à barres
- Graphiques à bulles
- Cartes de chaleur
- Camemberts
- Graphiques en ligne
- Des séries chronologiques
Un guide complet des widgets de graphiques est disponible dans notre zone de documentation, mais je vais vous faire une brève introduction ici.
Tout d’abord, choisissez le type de graphique que vous souhaitez ajouter et faites glisser le widget sur votre page, nous utiliserons un graphique à colonnes.
Remarque : dans les anciennes versions du widget Graphique, votre widget devait se trouver dans une vue de données ou une liste dont la source de données devait renvoyer un objet. N'importe quel objet pouvait faire l'affaire. Ce n'est plus le cas avec la dernière version.
Ensuite, double-cliquez sur le widget et vous devriez voir l'onglet Propriétés du graphique. Dans cet onglet se trouve la section Série et c'est là que vous pouvez ajouter votre premier ensemble de données.
Cliquez sur le bouton Nouveau dans la liste des séries et une fenêtre contextuelle s'affichera vous demandant d'où vous souhaitez obtenir vos données. Nous allons garder les choses simples et utiliser une source de données statique plutôt que dynamique (c'est-à-dire des points de données prédéfinis plutôt que des points personnalisables) et nous allons obtenir les données à partir de la base de données.
Le point de départ de cette série sera l'entité que nous utilisons pour remplir le graphique, disons qu'il s'agit d'une entité Orders dans ce cas. Nous pouvons ensuite utiliser la contrainte XPath pour la limiter aux commandes passées jusqu'à présent ce mois-ci :
[OrderPlacedDate > '[%BeginOfCurrentMonth%]']
Ensuite, nous allons dans l'onglet Série statique et donnons un nom à notre série, disons « Commandes par jour », puis nous passons à l'onglet Points de données. Ici, nous allons définir notre axe X comme étant « OrderPlacedDate » et l'axe Y peut être ce que nous voulons, « PricePaid » par exemple, car nous allons utiliser l'option Type d'agrégation en bas et la définir sur Nombre. Cela signifie qu'il regroupera automatiquement nos données par jour et nous montrera le nombre total de commandes passées.
Une fois cela fait, vous pouvez fermer cette fenêtre contextuelle et revenir à la fenêtre Propriétés du graphique pour définir les libellés de vos axes sur quelque chose comme « Date de passation » et « Nombre de commandes ». C'est tout ! C'est fait. Vous devriez maintenant avoir un graphique de base qui ressemble à ceci…
Il existe de nombreuses autres options pour personnaliser l'apparence et modifier la manière dont les données sont chargées à l'aide de différentes sources et plages dynamiques. Consultez la documentation pour en savoir plus sur ces fonctionnalités et, mieux encore, expérimentez !
Il convient de mentionner que nos widgets graphiques sont construits à l'aide de Bibliothèque de Plotly et vous pouvez vous y rendre pour en savoir plus et vous inspirer des exemples de leur bibliothèque. Si vous souhaitez vraiment vous libérer et utiliser un graphique entièrement personnalisé, nous vous proposons la Widget AnyChart.
Le widget AnyChart est un widget plus complexe à utiliser et il est préférable de fournir vos données au format JSON, en utilisant des fichiers de structure JSON et des mappages d'exportation. Il vous permet d'utiliser presque tous les types de graphiques de Plotly et de personnaliser entièrement le style. Cependant, gardez à l'esprit qu'il ne s'agit pas d'une approche low-code et qu'il est préférable que les personnes expérimentées en développement y parviennent.
Comment mettre en œuvre des options de reporting externe
Vous avez donc créé vos tableaux de bord exploitables, mais quelqu'un souhaite toujours un niveau de reporting plus élevé. Comment procéder avec Mendix?
L’approche la plus simple consiste à publiez vos données en tant que source OData. Ces données peuvent ensuite être utilisées par la plupart des plateformes de création de rapports telles que Power BI, Grafana et Excel. Une fois utilisées, vous pouvez ensuite modéliser les données et les présenter à l'aide des outils de création de rapports de la plateforme de votre choix.
Il convient également de mentionner que lorsque vous publiez OData, votre source sera mise à disposition dans votre catalogue Data Hub. Cela le rend rapidement et facilement consommable dans d'autres Mendix applications. Lorsque vous utilisez des offres SaaS telles que Power BI et Grafana, vous pouvez même intégrer ces rapports avancés dans Mendix si vous le souhaitez, en utilisant des widgets comme Power BI intégré ou d’une Composant iFrame.
À plus long terme, il peut être plus judicieux de consommer vos données OData dans un lac de données ou un entrepôt de données, car cela peut être utilisé pour précompiler et combiner des sources de données afin de faciliter leur utilisation par l'entreprise. Cela dépendra en grande partie de la stratégie de reporting ou des plans de transformation numérique de votre organisation.
Principaux points à retenir de cet article de blog
Vous devriez maintenant avoir une idée de la manière de procéder pour créer un tableau de bord. Créez des pages exploitables en fonction des besoins actuels de l'utilisateur et présentez uniquement les informations les plus importantes au préalable. Guidez-les vers ce qui nécessite leur attention et ce qu'ils doivent faire ensuite.
N'oubliez pas qu'il s'agit de lignes directrices et que vous devez toujours faire preuve de souplesse face aux besoins de vos utilisateurs dans une certaine mesure. Je dis « dans une certaine mesure » car parfois les utilisateurs demandent des choses qui ne sont pas raisonnables, comme recréer Excel en tant que tableau de bord, et vous devez savoir quand les repousser.
Si vous souhaitez une copie abrégée et visuelle de cet article, n'hésitez pas à télécharger le Mendix – Guide rapide sur le tableau de bord.
Enfin, par-dessus tout, expérimentez ! Vous utilisez Mendix Là où il est facile et rapide de construire quelque chose, de l'essayer et de le jeter si cela ne fonctionne pas. Nous apprenons le plus de nos erreurs, alors soyez audacieux et essayez de nouvelles choses.