Autre réalisation technique · laboratoire d’interface
PulseMetrics.
Une expérimentation statique sur la hiérarchie de cartes KPI et la création d’un graphique SVG léger.
Projet personnel — données de démonstration.
Contexte / Problème
Le besoin avant la réponse.
Contexte
PulseMetrics est un exercice technique ciblé sur la composition d’un tableau de bord compact, et non une application de données complète.
Problématique
Présenter plusieurs indicateurs et une tendance dans un espace réduit sans ajouter de bibliothèque de visualisation.
02 / MON RÔLE
Un périmètre précis. Une contribution assumée.
Conception et développement des cartes KPI et du mini-graphique SVG.
Démarche / Étapes
Du besoin au livrable.
Hiérarchiser les indicateurs dans des cartes responsives.
Tracer une courbe SVG depuis une série statique.
Adapter le graphique à la largeur disponible.
Associer une alternative textuelle aux données représentées.
Réalisation visible
Des écrans pour vérifier.
Cartes KPI et courbe SVG à partir d’une série statique.
Indicateurs empilés et hiérarchie conservée sur mobile.
Décisions / Raisons
Choisir, puis expliquer.
Utiliser un SVG natif pour éviter une dépendance disproportionnée.
Indiquer explicitement le caractère statique et fictif des données.
06 / SOLUTION
La réponse, sans la sur-vendre.
Un composant responsive réunissant cartes KPI, courbe SVG et description textuelle des données.
Livrables
Trois cartes KPI responsives.
Courbe SVG calculée depuis une série statique.
Alternative textuelle accessible.
Recul / Transparence
Résultat et limites.
Technologies / outils
- Next.js
- React
- TypeScript
- Tailwind CSS
- SVG
Résultat / livrables
Un laboratoire consultable qui documente un composant de visualisation léger et réutilisable.
Limites / améliorations
Aucune API n’est connectée et les valeurs ne représentent ni utilisateurs réels ni résultat commercial.