Audit ergonomique de Action Logement

Présentation du site

Action Logement est un dispositif qui permet d’obtenir de nombreuses aides, prêts ou subventions, tant pour les locataires que les propriétaires de biens immobiliers. 

L’objectif : faciliter l’accès au logement pour favoriser l’emploi.

Malheureusement, ces aides sont souvent méconnues et on ne sait pas comment en profiter.

Nous avons fait le constat que l’interface, ainsi que l’expérience utilisateur du site n’aident en rien à la prise de connaissance de ces aides.

Le parcours audité

Nous avons choisi d’auditer le parcours d’inscription.

De plus, nous avons fait le choix de nous concentrer uniquement sur l’aide “Demande Mobili Jeune”.

Ce parcours présente un énorme frein à la bonne utilisation de la plateforme : il est la première étape à franchir pour constituer son dossier, et il semble rebuter les utilisateurs à cause de sa complexité.

Il nous a alors semblé intéressant d’aborder le sujet d’Action Logement sous l’angle de l’inscription d’un nouvel utilisateur.

Le parcours est constitué de 5 étapes « majeures », dont voici un aperçu : 

Problèmes ergonomiques majeurs

Suite à une évaluation ergonomique (selon les critères Bastien & Scapin, voir l’Annexe), nous avons défini 5 problèmes ergonomiques majeurs.

Nous les avons classés par ordre de priorité, en fonction de leur impact sur la progression naturelle de l’utilisateur et son expérience du service :

1. Navigation peu naturelle (guidage)

2. Alertes et erreurs (gestion/correction des erreurs)

3. Notifications et alertes  (signifiance des codes et dénominations)

4. Gestion de l’espace (guidage)

5. Textes denses (charge de travail)

  1. Navigation peu naturelle
    Le problème :
    Le service présente des problèmes de wording, ainsi que des soucis iconographiques qui empêchent l’utilisateur de naviguer naturellement dans l’interface. 
    En quoi c’est une erreur ergonomique :
    L’utilisateur se sent perdu, et ne comprend pas que pour soumettre un formulaire d’inscription et donc s’inscrire au service, il doit dans un premier temps cliquer sur le bouton “espace bénéficiaire”, qui est le seul et unique biais pour accéder aux informations complémentaires pour une inscription.
    Le risque pour l’utilisateur :
    L’utilisateur perdra patience ou s’énervera, car l’information principale qu’il cherche n’est pas mise en avant clairement avec le bon wording approprié dans la page d’accueil. Le plus gros risque est donc que l’utilisateur quitte la page sans même avoir soumis de formulaire d’inscription.
    La solution proposée :
    Retravailler le wording, de manière à inciter l’utilisateur à soumettre une inscription à l’offre. Ajouter des boutons “s’inscrire” / “se connecter”, plutôt qu’un seul bouton “espace bénéficiaire”
  2. Alertes et erreurs
    Le problème :
    1- Certaines erreurs de l’utilisateur ne sont pas prévenues ni corrigées. L’utilisateur peut entrer un nom et un prénom tronqués (possibilité d’entrer une seule lettre dans le champ “Nom” et une seule dans le champs prénom).
    2- D’autre part, certains messages d’erreur ne sont pas précis et n’aident pas l’utilisateur.
    En quoi c’est une erreur ergonomique :
    Le critère 5 Gestion des erreurs de Bastien Et Scapin recommande de mettre à disposition des utilisateurs des moyens pour leur permettre de corriger leurs erreurs.
    Le risque pour l’utilisateur :
    L’utilisateur risque de se retrouver avec un formulaire incorrect, ce qui peut engendrer du retard dans le traitement de son dossier.
    Mal remplir le formulaire, peut aboutir pour l’utilisateur à ne pas pouvoir finaliser son inscription / ne pas recevoir les mails de confirmation, voire devoir annuler tout son dossier pour devoir le saisir à nouveau avec des informations personnelles correctes.
    Des messages d’erreur imprécis ou inexistants vont créer de l’incompréhension, de la perte de temps et du stress chez l’utilisateur.
    La solution proposée :
    Mieux gérer les erreurs, rédiger des messages d’erreurs plus précis pour éviter une grande confusion à l’utilisateur.
    Prévenir les erreurs de formulaires dans les champs prénom et nom, via plusieurs possibilités :
    • une notification d’alerte : 


  3. “Votre nom est composé d’une seule lettre.  Confirmez-vous cette entrée ?”
    “Veuillez noter qu’un dossier avec des informations personnelles erronées risque de provoquer
    du retard dans le traitement de votre dossier.”
    • un message (sous-titre) affiché au niveau des champs nom et prénom

      “Indiquer vos nom et prénom comme ils apparaissent dans vos documents officiels.”

  4. Notifications et alertes
    Le problème :
    Les messages de notification utilisent les mêmes codes que pour les erreurs (couleur rouge, icône d’alerte, même format) alors que le passage à l’étape suivante est possible et que les entrées sont correctes (icône ✅ )
    En quoi c’est une erreur ergonomique :
    Le critère 7 “Signifiance des codes et dénomination” de Bastien et Scapin préconise que l’information affichée soit adaptée et adéquate à son référent.
    Le risque pour l’utilisateur :
    Utiliser les mêmes codes pour les notifications comme pour les erreurs va susciter de l’incompréhension, possiblement du stress et risque de décourager l’utilisateur quant à la poursuite du formulaire.
    L’utilisateur va se demander :”Où est-ce que je me suis trompé ?”, va vérifier ses entrées, relire les messages.
    (Nous avons mis plus de 30 secondes à comprendre que le message était une notification et non une erreur..)
    La solution proposée :
    Adapter les messages de notifications pour qu’ils apparaissent comme des notifications et non des erreurs, et ce grâce à différentes méthodes :
    • Utiliser les bonnes pratiques des notifications : la couleur orange est très utilisée en gestion des risques (dans ce domaine trois , voire 4 codes couleur sont utilisés pour indiquer un risque croissant : bleu, vert, orange et rouge).
  5.  
    • Réduire le texte de la notification pour qu’il soit plus rapidement lisible et assimilable par l’utilisateur
  6.  
    • Changer d’icône (par exemple : utiliser l’icône      , plus clairement identifiable)
  7.  
  8. Gestion de l’espace
    Le problème :
    Les informations ne sont pas accessibles facilement, car l’utilisateur est obligé de scroller dans la page pour accéder à l’information principale de la page.
    En quoi c’est une erreur ergonomique :
    C’est une erreur car l’utilisateur doit faire un effort pour accéder à l’information principale qu’il souhaitait avoir. La liste déroulante ainsi que le CTA ne sont pas visibles au premier coup d’oeil.
    Le risque pour l’utilisateur :
    L’utilisateur peut ne pas avoir le réflexe de scroller, manquer l’information qu’il était venu chercher, et ainsi ne pas terminer le processus afin de soumettre une inscription au service. 
    La solution proposée :
    Remonter toutes les informations principales de la page ainsi que les CTA au dessus de la ligne de flottaison
  9. Textes denses
    Le problème :
    À plusieurs reprises, l’utilisateur est confronté à de gros blocs de texte.
    Il se retrouve parfois bloqué dans le parcours, devant effectuer des actions préalables à la suite du parcours.
    D’autres blocs texte sont disposés sur une image de fond, qui réduit encore plus la lisibilité.
    Il y a aussi des pop-up (qui interrompent le flow naturel du parcours) qui comportent beaucoup (trop ?) de texte.
    En quoi c’est une erreur ergonomique :
    La charge de travail de l’utilisateur ne doit pas être trop élevée, au risque de freiner sa progression ou de le frustrer dans son parcours. Alors que la brièveté est de rigueur, les textes sont ici trop longs et denses. L’information n’est pas assez claire et concise.

    Le risque pour l’utilisateur :
    Il risque d’être perdu, découragé. Un texte trop long demande un effort mental important pour un utilisateur, surtout lors d’un parcours comme celui-ci (avec des demandes d’aides financières).
    La solution proposée :
    Revoir la rédaction des textes pour les rendre plus faciles à lire, plus digestes.
     

Les solutions proposées

Nous avons donc trouvé 5 solutions, présentées ici par catégorie, sans ordre d’importance;

Wording :

  1. Retravailler le wording, de manière à inciter l’utilisateur à soumettre une inscription à l’offre. Ajouter des boutons “s’inscrire” / “se connecter”, plutôt qu’un seul bouton “espace bénéficiaire”
  2. Revoir la rédaction des textes pour les rendre plus facile à lire, plus digestes. 

Maillage interne :

  1. Remonter toutes les informations principales de la page ainsi que les CTA au-dessus de la ligne de flottaison 

Expérience utilisateur :

  1. Mieux gérer les erreurs, faire des messages d’erreurs plus précis, les personnaliser plus en anticipant mieux les actions de l’utilisateur, changer les codes couleurs pour ne pas induire en erreur l’utilisateur
  2. Adapter les messages de notifications pour qu’ils apparaissent comme des notifications et non des erreurs 

Nous avons donc trouvé 5 solutions.

Elles rentrent dans 3 grandes catégories : Wording, Maillage interne et Expérience utilisateur.

Maquette interactive

Vous pouvez trouver notre maquette interactive ici.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée.