UHA 4.0février 2025
Bricktools
Dashboard utilisateur pour suivre l'évolution d'une collection de briques danoises.
PHPLaravelVue.jsTailwind CSSChart.js
Contexte du projet
Bricktools est un site web dédié aux collectionneurs de la célèbre brique danoise. Ce projet a été réalisé en équipe dans le cadre de ma Licence Professionnelle Métiers de l'Informatique à l'UHA 4.0. Le client, propriétaire du site, nous a confié la mission de développer un dashboard utilisateur complet, permettant de suivre l'évolution de la collection et de centraliser les différentes fonctionnalités du site.
Besoin et objectif
Créer une interface utilisateur claire et intuitive pour visualiser l'évolution de la collection dans le temps, suivre les ajouts et les retraits de pièces, voir la répartition des contenus (sets, pièces, figurines) et suivre ses objectifs via un système de gamification.
Contribution personnelle
Développement des visualisations de données du dashboard avec Vue.js et Chart.js : évolution de la collection, ajouts et retraits, répartition des contenus. Ce travail s’inscrivait dans une réalisation en équipe pour le propriétaire de Bricktools.
Fonctionnalités principales
- Graphique en barres : ajouts et retraits de pièces par semaine ou par mois
- Graphique en courbe : croissance de la collection sur 4 dernières semaines ou 12 derniers mois
- Graphique combiné : superposition barres + courbe pour une vue globale
- Graphique en secteur : répartition entre pièces, sets et figurines
- Filtres et tris dynamiques pour faciliter le suivi des objectifs (gamification)
Défis rencontrés
Ma contribution principale portait sur la visualisation des données via différents graphiques interactifs. Le défi était de transformer des données dynamiques en indicateurs lisibles, utiles et attractifs pour l'utilisateur final.
Résultat livré
Des graphiques interactifs pour suivre la collection dans le temps et comparer sa composition. Le site Bricktools est accessible en ligne ; les vidéos présentent le travail réalisé sur le dashboard.
Ce que j’ai appris
- Manipuler et afficher des données dynamiques sous forme de graphiques
- Créer des visualisations lisibles, utiles et attractives pour l'utilisateur
- Utiliser des librairies de visualisation dans Vue.js (Chart.js)
- Travailler en collaboration sur un projet client réel avec des besoins spécifiques
Vidéos du projet
Bricktools - vidéo 1
En chargeant cette vidéo, vous acceptez la connexion à Google/YouTube, qui peut recevoir des données de navigation et utiliser des traceurs.
Confidentialité des vidéosBricktools - vidéo 2
En chargeant cette vidéo, vous acceptez la connexion à Google/YouTube, qui peut recevoir des données de navigation et utiliser des traceurs.
Confidentialité des vidéosAvis visiteurs
Chargement des avis...