Règles UI/UX DMV

Statut

Document de règles projet — v1.0 — relu le 2026-05-10.

Objectif

Règles d'interface et d'expérience utilisateur applicables aux applications de l'écosystème DMV.

Règles strictes

• Ne jamais présenter DMV comme un réseau social généraliste — c'est une plateforme de territoire.
• Ne jamais surcharger l'interface de fonctionnalités gadgets.
• Ne jamais ignorer les états de chargement, d'erreur et de liste vide.
• Ne jamais afficher de données techniques (UUIDs, codes d'erreur bruts) à un utilisateur final.
• Ne jamais bloquer l'accès à une fonctionnalité sans explication claire de pourquoi.

Mobile-first

• Concevoir l'interface pour mobile avant de l'adapter au desktop.
• Tailles de cibles tactiles minimales : 44×44 pixels.
• Éviter les hover-only interactions.
• Tester les formulaires sur clavier mobile.
• Performance : prioriser le Largest Contentful Paint sur mobile.

Principes directeurs

• Simplicité : une interface évidente ne nécessite pas de documentation.
• Cohérence : utiliser les mêmes composants, couleurs et interactions dans toutes les apps.
• Feedback : toute action utilisateur reçoit un retour immédiat (loading, succès, erreur).
• Accessibilité : contraste suffisant, labels sur les inputs, navigation clavier.
• Progressif : afficher le contenu essentiel d'abord, enrichir ensuite.

Recommandations

• Utiliser Tailwind CSS utilitaire — éviter le CSS personnalisé sauf nécessité.
• Préférer des composants petits, composables et réutilisables.
• Afficher des squelettes de chargement plutôt que des spinners pour les listes.
• Confirmer les actions destructives avant exécution.
• Proposer des messages d'erreur actionnables ("Vérifiez votre connexion" plutôt que "Erreur 503").

Tonalité

• Langage simple, direct, humain — éviter le jargon technique.
• Textes courts dans les interfaces.
• Utiliser le français dans toutes les interfaces grand public.
• Adapter le vocabulaire à l'audience : "Votre espace" pour les usagers, termes précis pour le backoffice.

Applications spécifiques

Application	Public cible	Priorité UX
dmv-public	Citoyens et acteurs locaux	Simplicité, mobile, découverte
dmv_backoffice	Administrateurs	Efficacité, densité d'information
PlayLoop	Opérateurs d'écrans	Zéro friction, configuration rapide
Mairie	Agents municipaux	Clarté, alertes visibles
AssoSuite	Responsables associatifs	Guidage, gestion simple

Anti-patterns à éviter

• Modals empilées.
• Formulaires longs sans étapes.
• Textes tronqués sans accès au contenu complet.
• Actions irréversibles sans confirmation.
• Interfaces différentes pour la même fonctionnalité selon l'app.
• Dépendance aux notifications push pour des informations critiques.