Démarches en ligne : Simplification au service de l’e-citoyen
La dernière version de CapDémat déployée au Conseil Général de Seine et Marne dans le cadre de la demande de bourse Mobil’études est le résultat de travaux R&D de Zenexity Labs. Cette nouvelle version propose une révision complète de l’ergonomie des services en ligne et de nouveaux concepts dans la gestion des comptes e-citoyens.
Des retours d’expériences concrets
Le lancement de la demande de bourses Mobil’études, effectué en juillet 2009, nous a permis, au travers des retours des utilisateurs de ce service, d’identifier clairement des difficultés d’utilisation de ce service en ligne.
L’étude des comportements, commentaires et critiques des e-citoyens a alors mis en évidence deux grandes zones de confusions :
- La gestion des comptes familles : La création et, dans une moindre mesure, la modification de compte concrétisées sous forme de services en ligne sont peu naturelles (eu égard à ce qu’il se fait couramment sur Internet) et trop fastidieuses. Certains e-citoyens pensaient par exemple avoir fait leur demande de bourse à l’issue de leur demande de création de compte.
- La logique de remplissage d’un formulaire : Le manque de balisage clair du processus de remplissage d’une demande s’est avéré troublant pour les e-citoyens. Cela a été d’autant plus flagrant au Conseil Général de Seine et Marne que le service proposé est complexe et volumineux.
Afin d’améliorer l’expérience utilisateur de saisie des demandes, nous avons donc mis en œuvre des refontes fonctionnelles, ergonomiques et techniques que nous allons présenter dans la suite de cet article.
Gestion simplifiée des comptes e-citoyens
Création de compte intégrée
Les nouveaux e-citoyens ont désormais la possibilité de créer un compte famille simplifié, dans le cadre de la demande qui les intéresse.
Le formulaire de création de compte est alors matérialisé comme une simple étape préliminaire au formulaire du service en ligne. La transition de l’un vers l’autre se fait alors de façon complètement transparente.
Modification de compte transparente
L’e-citoyen peut modifier son compte à la volée dans le contexte d’une demande. Par exemple, le responsable de compte est libre d’ajouter à la volée un enfant à son compte pour l’inscrire directement aux centres de loisirs de sa commune.
Saisie simplifiée et intuitive des demandes
Afin de faciliter leur tâche, les fonctionnalités suivantes ont été développées pour abstraire les e-citoyens d’opérations auparavant fastidieuses ou peu intuitives :
- Webflow de remplissage relaxé
- Brouillon automatique et transparent des demandes et des pièces justificatives
- Feed-back e-citoyen unifié (état d’avancement / rapport d’erreur)
Principes ergonomiques mis en œuvre
La refonte de l’ergonomie des formulaires en ligne a été un des principaux chantiers de cette nouvelle version. L’objectif était d’unifier et de standardiser toutes les informations de feed-back e-citoyen dans le module graphique représentant les étapes. L’e-citoyen suit l’état de complétion de son formulaire grâce à un code couleur totalement naturel.
Le remplissage des formulaires est guidé par un webflow relaxé. C’est un composant technique de CapDémat chargé de guider les e-citoyens à travers les étapes du formulaire. On peut le voir comme le chef d’orchestre du processus de saisie d’une demande. Il intègre entre autre les fonctionnalités suivantes :
- Affichage de l’état de complétion
- Gestion des transitions entre étapes
- Modification (par accès direct) de toute étape déjà complétée
- Validation des données à chaque transition entre étapes
- Sauvegarde transparente du brouillon entre les transitions
- Gestion de la reprise sur erreur
Voici quelques exemples qui illustrent bien les principes de simplicité et d’accompagnement à la base de la conception des nouveaux services en lignes de CapDémat.
Navigation à travers les étapes du formulaire
Chaque opération de navigation à travers les étapes du formulaire déclenche les opérations de validation des données, de sauvegarde du brouillon de la demande et de mise à jour du composant de feed-back unifié.
Validation des données et mise en évidence des erreurs
Les contrôles de saisie des données invalides sont effectués côté client et coté serveur. La présentation du rapport d’erreur est unifiée pour ces 2 types de validation.
Le webflow relaxé n’autorise la soumission du formulaire que lorsque toutes les étapes obligatoires sont correctement complétées.
Sauvegarde transparente des brouillons
Le brouillon d’une demande est mis à jour automatiquement à chaque transition d’étape. L’e-citoyen a la possibilité d’abandonner sa demande, de la reprendre plus tard et même de fermer son navigateur. Dans les 2 derniers cas, la nouvelle implémentation sans état (stateless) des services en ligne lui permet de ne pas perdre les informations qu’il a déjà saisi.
Améliorations techniques
Les évolutions fonctionnelles et ergonomiques présentées ci-avant s’appuient sur une révision complète du socle technique Web sous-tendant les services en ligne. Voici un aperçu des notes de la version 4.2.1 :
- Création de demandes en mode stateless
- Chargement unitaire des étapes des formulaires (permettant en outre une amélioration drastique des performances)
- Découplage de l’ajout / modification de pièces justificatives
- Validation coté serveur native (via le framework de génération)
- Rapport d’erreur de validation coté client et coté serveur unifié. Par conséquent, si l’e-citoyen ne dispose pas de javascript, il ne subira aucune dégradation fonctionnelle. C’est un point très important qui permet de garantir l’accessibilité des services en ligne proposés sur la plate-forme.
Cela nous a permis de mettre en œuvre techniquement le découpage fonctionnel des composants des services en ligne et de simplifier le code source en exploitant les opportunités de structuration offertes par les architectures stateless.

























