Fiche Descriptive Complète : Suivi Budget Sport
🔷 INFORMATIONS GÉNÉRALES
Champ Détail
Nom du template Suivi_Budget_Sport_Jeunes_Actifs.html
Version 1.0.0
Date de création 19 Mars 2026
Auteur / Designer Refoia Jeremy Tech
Type de page Dashboard de suivi budgétaire personnel
Objectif principal Visualiser l’évolution du budget sport et l’accumulation des dépenses sur 12 mois.
🎯 DESCRIPTION FONCTIONNELLE
📌 Que fait ce template ?
Ce template est un outil de visualisation financière simple et efficace. Il permet à un utilisateur (sportif) de comparer son budget total alloué par rapport à ses dépenses estimées (basées sur un kit « chaussures + chaussettes »). L’interface utilise des cartes de statistiques pour les chiffres clés et un graphique linéaire dynamique pour les projections annuelles.
📌 Public cible (Persona)
👤 Jeunes actifs souhaitant monitorer leur budget passion.
👤 Sportifs réguliers ayant une consommation de matériel prévisible (renouvellement fréquent).
👤 Coachs ou conseillers voulant illustrer le coût annuel d’une pratique sportive.
⚙️ SPÉCIFICATIONS TECHNIQUES
🌐 Environnement & Compatibilité
Standard HTML : HTML5
CSS : CSS3 Pur (Vanilla CSS) avec Flexbox et Grid.
Framework JS : Chart.js (via CDN).
Responsive : ✅ Oui (mise en page fluide, graphique adaptatif).
📦 Dépendances / Assets
HTML
📥 ENTRÉES — CONTENU DYNAMIQUE (Logique Script)
# Variable (JS) Type Valeur par défaut Description
1 budgetMensuel int 500 Allocation mensuelle en Euros.
2 prixKit int 87 Coût unitaire d’un équipement (79€ + 8€).
3 achatsParMois int 5 Nombre d’articles achetés chaque mois.
4 labels array [‘Mars’, …] Les mois de l’année (début au Printemps).
🧱 STRUCTURE DU FICHIER — DOM
Suivi_Budget_Sport_Jeunes_Actifs.html
📌
: Définit l’encodage UTF-8, le viewport mobile et les styles internes (Police Segoe UI, ombres portées, grille de stats).📌
:🏗️ .container : Conteneur principal centré (900px max).
🏗️ .stats-grid : Système de 3 colonnes (grid) affichant le budget, le coût unité et la capacité d’achat.
🏗️
🏗️ Note de bas de page : Information contextuelle sur la période de calcul.
📌