ccds/portail-associations
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
portail-associations/docs/ux/ROADMAP-OPTIMISATION-PORTAIL.md

10 KiB
Raw Blame History

Roadmap UX - Navigation, Responsive et Cohérence Portail

Objectif

Structurer l'optimisation UX du portail en tickets séparés, chacun dédié a une zone precise, afin d'obtenir une navigation stable, lisible et professionnelle sur ordinateur, tablette et telephone.

Cette methode permet de :

  • traiter les ecrans par perimetre fonctionnel clair ;
  • limiter les regressions ;
  • verifier plus facilement les rendus desktop / tablette / mobile ;
  • deployer par lots plus maitrisables ;
  • obtenir un portail plus coherent pour les associations, les utilisateurs publics et les administrateurs.

Principes de pilotage

Chaque ticket doit contenir :

  • le perimetre exact ;
  • le probleme constate ;
  • les objectifs UX ;
  • les contraintes multi-appareils ;
  • les composants ou vues touches ;
  • les criteres de validation ;
  • le resultat attendu.

Priorisation recommandee

Lot 1 - Navigation critique et ecrans les plus frequents

  1. UX-001 - Home publique et menu mobile
  2. UX-002 - Navigation publique Annuaire / Carte / Aide
  3. UX-003 - Sidebar association et navigation dashboard
  4. UX-004 - Sidebar admin et navigation par onglets

Lot 2 - Ecrans metier a forte frequence

  1. UX-005 - Nouvelle demande
  2. UX-006 - Reservation de salle
  3. UX-007 - Materiel evenementiel
  4. UX-008 - Mes demandes
  5. UX-009 - Mon association

Lot 3 - Ecrans admin de pilotage

  1. UX-010 - Gestion des demandes admin
  2. UX-011 - Bordereau admin
  3. UX-012 - Annuaire CCDS
  4. UX-013 - Logistique / services materiel
  5. UX-014 - Conformite

Lot 4 - Finition et qualite percue

  1. UX-015 - Etats vides, skeletons et confirmations
  2. UX-016 - Densite compacte / detaillee
  3. UX-017 - Micro-interactions, hover, focus, transitions
  4. UX-018 - Revue finale multi-appareils

Tickets detailles

UX-001 - Home publique et menu mobile

Objectif Stabiliser la premiere impression du portail sur mobile et petit desktop.

Perimetre

  • header public ;
  • hero ;
  • navigation mobile ;
  • CTA principaux.

Travaux attendus

  • rendre le menu mobile plus lisible et plus compact ;
  • mieux hierarchiser les CTA ;
  • ajuster finement les textes du hero selon la largeur ;
  • garantir un affichage sans debordement sur iPhone et petits Android.

Validation

  • aucun debordement horizontal ;
  • CTA visibles sans confusion ;
  • navigation claire des l'arrivee sur le site.

UX-002 - Navigation publique Annuaire / Carte / Aide

Objectif Assurer une navigation publique coherente entre les vues de consultation.

Perimetre

  • annuaire public ;
  • carte publique ;
  • liens transverses publics.

Travaux attendus

  • uniformiser les barres de navigation mobile ;
  • harmoniser les libelles ;
  • clarifier le passage carte / liste ;
  • rendre les filtres plus accessibles.

Validation

  • meme logique de navigation entre annuaire et carte ;
  • comprehension immediate des vues disponibles.

UX-003 - Sidebar association et navigation dashboard

Objectif Faire de la sidebar association un repere stable, intuitif et metier.

Perimetre

  • sidebar utilisateur / association ;
  • sections de navigation ;
  • etat actif ;
  • version mobile repliee.

Travaux attendus

  • consolider la hierarchie Suivi / Demarches / Referentiels ;
  • harmoniser les icones, espacements et libelles ;
  • garantir la persistance de la sidebar sur les pages du dashboard ;
  • gerer proprement le comportement mobile.

Validation

  • la meme sidebar apparait de maniere coherente sur toutes les pages association ;
  • les actions principales sont reperables en un coup d'oeil.

UX-004 - Sidebar admin et navigation par onglets

Objectif Stabiliser la navigation interne de l'administration.

Perimetre

  • sidebar admin ;
  • navigation secondaire par onglets ;
  • badges notifications ;
  • etat actif.

Travaux attendus

  • rendre chaque entree reellement cliquable ;
  • clarifier les groupes metier ;
  • renforcer la lisibilite des etats actifs ;
  • optimiser le comportement tablette / mobile.

Validation

  • chaque clic change bien de vue ;
  • aucun conflit de navigation ou de cache visible.

UX-005 - Nouvelle demande

Objectif Transformer l'entree en demande en parcours accompagne.

Perimetre

  • page de choix des demandes ;
  • cartes d'entree ;
  • etats vides ;
  • CTA.

Travaux attendus

  • clarifier les types de demandes ;
  • mieux presenter les priorites ;
  • renforcer le guidage visuel ;
  • optimiser l'affichage mobile.

Validation

  • l'association comprend rapidement quelle demarche lancer ;
  • aucun bloc ne semble surcharge ou secondairement cache.

UX-006 - Reservation de salle

Objectif Rendre le formulaire salle lisible, rassurant et fluide sur tous les supports.

Perimetre

  • progression ;
  • sections du formulaire ;
  • recapitulatif ;
  • actions de validation.

Travaux attendus

  • mieux segmenter les blocs ;
  • renforcer les retours de saisie ;
  • faciliter les actions tactiles ;
  • rendre le parcours plus premium sur mobile.

Validation

  • lecture claire de chaque etape ;
  • aucune perte de contexte pendant la saisie.

UX-007 - Materiel evenementiel

Objectif Aligner la qualite percue du materiel sur celle de la reservation de salle.

Perimetre

  • formulaire materiel ;
  • recapitulatif ;
  • densite des informations ;
  • actions finales.

Travaux attendus

  • clarifier les zones de saisie ;
  • optimiser la presentation du materiel demande ;
  • rendre les informations logistiques plus lisibles.

Validation

  • l'ecran reste clair meme avec beaucoup d'informations.

UX-008 - Mes demandes

Objectif Rendre le suivi des demandes plus clair et plus pilotable.

Perimetre

  • liste des demandes ;
  • badges d'etat ;
  • actions Voir, Repondre, Voir devis, Voir decision ;
  • retour apres consultation.

Travaux attendus

  • densifier sans tasser ;
  • clarifier les statuts ;
  • mieux hierarchiser les demandes a action.

Validation

  • les demandes en attente sont immediatement identifiables ;
  • les documents se consultent sans rompre le parcours.

UX-009 - Mon association

Objectif Securiser et fluidifier la mise a jour de la fiche association.

Perimetre

  • formulaire de profil ;
  • systeme d'alerte avant sortie ;
  • sidebar ;
  • responsive fin.

Travaux attendus

  • proteger les donnees non enregistrees ;
  • clarifier les champs incomplets ;
  • optimiser la lecture du formulaire sur mobile.

Validation

  • aucun risque de perte silencieuse de donnees ;
  • fiche exploitable sur petit ecran.

UX-010 - Gestion des demandes admin

Objectif Faire de la vue admin un poste de traitement lisible et efficace.

Perimetre

  • listes ;
  • panneaux d'action ;
  • modales de traitement ;
  • formulaires longs.

Travaux attendus

  • clarifier la densite ;
  • rendre les modales plus confortables sur mobile ;
  • mieux exposer les actions critiques.

Validation

  • un agent peut traiter vite sans se perdre dans l'ecran.

UX-011 - Bordereau admin

Objectif Faire du bordereau un veritable ecran metier de pilotage.

Perimetre

  • grille desktop ;
  • referentiel ;
  • correspondances a valider ;
  • filtres ;
  • badges de provenance ;
  • mode compact / detaille.

Travaux attendus

  • consolider la grille d'affichage ;
  • renforcer la lisibilite des fiches ;
  • mieux exposer les actions de rapprochement ;
  • rendre la toolbar de filtres plus premium.

Validation

  • lecture immediate des statuts ;
  • ecran exploitable sur grand ecran sans collision visuelle.

UX-012 - Annuaire CCDS

Objectif Uniformiser la qualite des referentiels internes.

Perimetre

  • listes internes ;
  • fiches ;
  • edition ;
  • recherche.

Travaux attendus

  • aligner les composants avec le bordereau ;
  • clarifier les actions d'edition ;
  • densifier proprement.

UX-013 - Logistique / services materiel

Objectif Ameliorer le suivi metier des services internes.

Perimetre

  • assignation ;
  • retour materiel ;
  • liens terrain ;
  • boutons retour.

Travaux attendus

  • clarifier les statuts ;
  • rendre les actions plus visibles ;
  • fluidifier les retours vers la vue source.

UX-014 - Conformite

Objectif Faire du centre conformite un veritable tableau de pilotage.

Perimetre

  • syntheses ;
  • preuves ;
  • registres ;
  • DPA ;
  • sauvegardes ;
  • retention.

Travaux attendus

  • clarifier les niveaux de lecture ;
  • mieux segmenter les preuves et registres ;
  • renforcer la lisibilite des priorites.

UX-015 - Etats vides, skeletons et confirmations

Objectif Ameliorer la qualite percue sur tous les parcours.

Perimetre

  • chargements ;
  • etats vides ;
  • messages de succes ;
  • messages d'erreur.

Travaux attendus

  • uniformiser les skeletons ;
  • rendre les confirmations plus rassurantes ;
  • remplacer les messages trop techniques.

UX-016 - Densite compacte / detaillee

Objectif Permettre un usage adapte au contexte : lecture confortable ou pilotage dense.

Perimetre

  • bordereau ;
  • listes admin ;
  • listes association ;
  • referentiels.

Travaux attendus

  • definir un mode compact ;
  • definir un mode detaille ;
  • garder une coherence de comportement entre modules.

UX-017 - Micro-interactions, hover, focus, transitions

Objectif Rendre le portail plus premium sans tomber dans l'effet decoratif.

Perimetre

  • boutons ;
  • cartes ;
  • filtres ;
  • changements d'onglets ;
  • panneaux.

Travaux attendus

  • standardiser les transitions 150-250 ms ;
  • renforcer hover/focus ;
  • rendre les interactions plus nettes.

UX-018 - Revue finale multi-appareils

Objectif Valider la coherence finale sur desktop, tablette et mobile.

Perimetre

  • toutes les vues critiques ;
  • public ;
  • association ;
  • administration.

Travaux attendus

  • controles visuels ;
  • corrections residuelles ;
  • verification de l'absence de debordements ;
  • validation des actions tactiles.

Ordre d'execution conseille

  1. Navigation globale
  2. Pages publiques principales
  3. Dashboard association
  4. Formulaires critiques
  5. Vues admin de traitement
  6. Bordereau et referentiels
  7. Conformite et ecrans secondaires
  8. Finitions globales
  9. Revue finale multi-appareils

Definition de "termine"

Un ticket est considere termine quand :

  • le rendu desktop est propre et stable ;
  • le rendu tablette est coherent ;
  • le rendu mobile est lisible et sans debordement ;
  • les actions principales sont clairement visibles ;
  • les etats actifs, hover et focus sont nets ;
  • le comportement est verifie localement puis en ligne si necessaire.