BRANDING⏐UX DESIGN⏐UX WRITING⏐UI DESIGN

BRANDING⏐UX DESIGN⏐UX WRITING⏐UI DESIGN

Concevoir l’interface d’une page de tableau de bord pour une application SaaS.

Concevoir l’interface d’une page de tableau de bord pour une application SaaS.

Dans le cadre d’un exercice de conception UX/UI simulant une commande professionnelle, j’ai imaginé une interface de tableau de bord destinée à un personnel de direction hospitalière. L’objectif : permettre un pilotage fluide des activités critiques, tout en optimisant la gestion des ressources humaines et matérielles.


Après avoir analysé les besoins fonctionnels, j’ai organisé l’interface autour de trois axes : la visibilité immédiate des indicateurs clés, l’action rapide sur les zones critiques, et une lecture intuitive adaptée à un contexte d’urgence.

Chaque décision graphique (typographie, couleur, disposition, affordance) a été prise dans un souci d’efficacité, d’accessibilité et de cohérence avec les standards d’une application SaaS. La version mobile a été conçue comme un véritable outil de terrain, sans compromis sur la lisibilité des données.

Maquette Mobile

Maquette mobile

Détails d'interface

Lecture des KPI's

Les indicateurs critiques sont regroupés en haut du tableau de bord pour un accès direct aux données essentielles. Chaque carte présente un statut clair, une valeur chiffrée, et une tendance visuelle (+2 vs. hier, Capacité presque atteinte, etc.) pour faciliter la prise de décision rapide.

Détails d'interface

Structurer l’information sans la surcharger

Chaque statut est associé à une couleur spécifique pour améliorer la lecture et la mémorisation : rouge pour Critique, jaune pour Moyen, violet pour les effectifs. Les icônes complètent les couleurs pour assurer la lisibilité, même en cas de troubles de la vision.

Chaque statut est associé à une couleur spécifique pour améliorer la lecture et la mémorisation : rouge pour Critique, jaune pour Moyen, violet pour les effectifs. Les icônes complètent les couleurs pour assurer la lisibilité, même en cas de troubles de la vision.

Détails d'interface

Version mobile, une navigation fluide pensée pour le terrain

L’interface mobile reprend les KPI sous forme de cartes défilantes horizontalement pour éviter la surcharge visuelle. 

Les blocs d’information sont reformatés pour une lecture synthétique et des actions accessibles d’un simple tap.

Notes

Enjeux et axes de progression

Ce cas pratique d’une semaine m’a permis de travailler ma capacité à structurer une interface métier complexe dans un délai restreint, en me concentrant sur la hiérarchie de l’information, la lisibilité des données critiques et la logique d’interaction.

Faute de temps pour mener des recherches utilisateurs, j’ai basé mes choix sur des standards UI/UX observés dans des outils SaaS existants, en adaptant leur logique à un contexte hospitalier fictif.


Ce type d’exercice m’aide à affiner ma rigueur dans la conception d’interfaces data-driven, tout en identifiant les éléments qui gagneraient à être validés par des retours terrain dans un cadre réel.

Fait par Élodie Ferreira

Fait par Élodie Ferreira

Fait par Élodie Ferreira

Projets d'étude / Grands gîtes