Audit ergonomiqueformulaire
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com    •	 II. Audit ergonomique KelAssur : formu...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com  Élément        Densité d’affichage. Disposi...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com      Élément        Alignement des champs et...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com  Élément        Visibilité du bouton d’actio...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com      Élément          Ordre des champs.    P...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com  Élément        Navigation dans le formulair...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com      Élément         Architecture du site.  ...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com  Élément          Vitesse de chargement / po...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com       Élément        Interprétation des tabl...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com  Élément          Le bouton radioProblématiq...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com       Élément        Les dates     Problémat...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément        Comportement des champs de sa...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com       Élément          Comportement des zone...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com  Élément          Protection contre les erre...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com       Élément          Champ obligatoire VS ...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com  Élément        Détection des erreursProblém...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com       Élément        Affichage des messages ...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.comNaviguer sans perdre le nord.        •	 Regro...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com     Faciliter la tâche de renseignement :   ...
- Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.comAider l’utilisateur à éviter et à corriger se...
Upcoming SlideShare
Loading in...5
×

Audit formulaire

787

Published on

L’objectif de cette recommandation est de présenter nos propositions d’optimisation des
formulaires.

Published in: Lifestyle
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
787
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
15
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Transcript of "Audit formulaire"

  1. 1. Audit ergonomiqueformulaire
  2. 2. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com • II. Audit ergonomique KelAssur : formulaire. • L’objectif de cette recommandation est de présenter nos propositions d’optimisation des formulaires. • Exemples étudiés : les formulaires AUTO, la page de présentation des résultats.2
  3. 3. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Densité d’affichage. Disposition des éléments dans les fenêtresProblématique ° Difficulté d’analyse du formulaire. ° Augmentation du temps de remplissage. ° Dilution de l’information. Parcour d’action ° Rapprocher Les différents éléments d’interaction entre eux.Recommandation ° Supprimer toute pollution visuel. ° Aligner les libellés à droite. ° Augmenter la taille des textes et des champs d’interaction. 3 ° Réserver l’habillage graphique pour le reste de la page.
  4. 4. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Alignement des champs et des libellés Problématique ° Optimiser l’organisation visuelle du formulaire. ° Optimiser la liaison libellés champs. Distance entre la fin du libéllé et la zone d’action (Parcour occulométrique simplifié) Recommandation ° Aligner les libellés du formulaire à droite.4
  5. 5. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Visibilité du bouton d’action principale.Problématique ° Réduire l’analyse de la page. ° Permettre un apprentissage interne. ° Définir une logique d’utilisation. ° Les boutons d’action doivent être dans un format les détachant clairement du fond.Recommandation ° Leur surface cliquable doivent être étendues. ° Utiliser plutôt des verbes, éviter les libellés trop longs. ° Il faut Éviter les boutons composés uniquement d’une icône. 5
  6. 6. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Ordre des champs. Problématique ° Optimiser le temps de remplissage d’analyse du formulaire. ° Miser sur les conventions et apprentissage extérieure. Nom : Prénom : Adresse postal : Code postal : Ville : Tel : Adresse mail : Recommandation ° Respecter les conventions et normes. ° Les utilisateurs ont l’habitude de remplir ces informations dans cette ordre. Ils liront moins les libellés.6
  7. 7. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Navigation dans le formulaireProblématique ° Vue d’ensemble du processus de navigation dans lequel l’utilisateur est : tâche effectués et restantes ° Mettre les étapes en évidence.Recommandation ° Il faut que cela devienne un repaire pour l’utilisateur. ° Plus il saura où il en est plus il acceptera de rester cohérent avec son action de départ. 7
  8. 8. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Architecture du site. Problématique ° Cohérence sur les différentes pages du site. ° Faciliter la familiarisation. page 1 page 1 page 2 page 2 page 3 Présence du menu de navigation sur un formulaire, absent sur d’autre.... (plus généralement le site propose différente mise en page...) ° Prévoir un gabarit type pour l’ensemble des formulaires Recommandation ° Laisser la navigation principale sur l’ensemble du site formulaire et tableau de comparaison compris. ° C’est l’utilisateur qui à le contrôle.8
  9. 9. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Vitesse de chargement / pollution visuelProblématique Les temps de chargement sont beaucoup trop longs. Trop d’éléments à charger en plus des webservices. Trop de script en local, trop de fichier non minifié trop d’images.Recommandation ° Utiliser au maximum l’affichage standard, miser sur les conventions et normes. ° Utiliser les boutons par défaut du navigateur, les slides par défaut et supprimer les images non nécessaires. 9
  10. 10. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Interprétation des tableaux Problématique ° Limiter le temps d’analyse du tableau. ° Optimiser la compréhension. Trop d’éléments inutiles, trop d’habillage graphique. Trop de pollution visuel. ° Choisir les informations à mettre en avant en fonction des objectifs et de l’utilisateur. Recommandation ° Miser sur l’apprentissage externe et utiliser les styles par défauts des éléments du tableau. (bouton, slides, case à cocher...)10 ° Griser les cellules dont les options ne sont pas inclues.) ° Aérer le texte et les cellules.
  11. 11. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Le bouton radioProblématique Prend beaucoup de place à l’écran et complique la lecture du formulaire.Recommandation ° Remplacer les boutons radio par des menus déroulants. ° Cette recommandation n’est pas à appliquer sur les opt-in partenaire qui eux nécessite un aspect différent. 11
  12. 12. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Les dates Problématique Problème d’interprétation. Facilité la lecture du format demandé et optimiser la vitesse de remplissage. ° Faciliter le remplissage. Recommandation ° Donner un exemple qui s’efface lors que l’on clique sur-le-champ. ° Interndire les lettres ou tout autres caractères non nécessaire.12 ° Valider à la volée. ° Interdire les dates non valide (antérieures à la date du jour pour le libellé de l’exemple).
  13. 13. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Comportement des champs de saisisProblématique Faciliter le remplissage, guider l’utilisateur. Non sélectionné ex : 01/10/2013 Pas de contour Sélectionné. l’aide passe à 50% ex : 01/10/2013 Contour 1px d’opacité L’aide disparait 01/10 Contour 1px Après suppression du contenu,le champ ex : 01/10/2013 Pas de contour retrouve son aspect d’origine 13
  14. 14. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Comportement des zones sélectionnées et / ou survolées. Problématique ° Situer rapidement l’emplacement du champ sélectionné. ° Faciliter la mise en avant. Recommandation ° Modifier le focus par défaut afin de rendre bien plus visible l’objet sélectionné. ° Modifier la couleur de fond de chaque cellule d’une ligne au survole de la souris.14
  15. 15. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Protection contre les erreursProblématique ° Limiter en amont les erreurs potentielles. ° Autoriser le type de données en fonction du champ.Recommandation ° Autoriser l’emploi des chiffres pour la date, mais pas des caractères alphabétique. ° Ne pas proposer de rentrer une date 2012 via le calendrier s’il n’est pas possible de débuter un contrat avant la date actuel. ° Autoriser uniquement les chiffres pour le code postal... 15
  16. 16. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Champ obligatoire VS optionnel Problématique ° Prévenir l’utilisateur des champs optionnels et des champs obligatoires. Cas 1: Tous les champs obligatoires : Tous les champs sont obligatoires Cas 2: Seulement quelques champs optionnels et une très grande majorité de champs obligatoires : Indiquez uniquement les champs optionnels par un texte (Optionnel) ou (Facultatif) ° L’indiquer visiblement en début de formulaire et non à la fin. Recommandation ° Si il le sont tous, l’indiquer. ° Si c’est seulement certain, l’indiquer en expliquant comme les différencier.16
  17. 17. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Détection des erreursProblématique Ne pas survalider le formulaire. La pop-up revient tout le temps même après l’avoir fermée. ° Être flexible sur la détection des erreurs et la validation en temps réel.Recommandation ° Une sur-validation risque d’énerver l’utilisateur... ° Exemple autoriser l’utilisation de caractères comme + et () pour le champ téléphone. 17
  18. 18. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Élément Affichage des messages d’erreur et aide à la correction Problématique Qu’affiche-t-on dans les messages d’erreur et comment affiche-t-on ces messages ? Aider l’utilisateur. ° Afficher l’explication en rouge et en gras, sous le champ concerné. Recommandation ° Mise en valeur du fond du champ mal renseigné pour attirer l’attention de l’utilisateur. ° Éviter les pop up. ° Lister toutes les erreurs en même temps.18
  19. 19. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.comNaviguer sans perdre le nord. • Regrouper les items selon une logique attendue par l’utilisateur (tri de carte) • Les items doivent être : • signifiant • complémentaire • exclusifs. • Toujours indiquer ou l’utilisateur se situe dans le formulaire et dans le site. • Eviter de répéter les demandes de saisis. • Éviter l’ouverture de pop-up • Modifier la couleur de fond de chaque cellule au survole de la souris. 19
  20. 20. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.com Faciliter la tâche de renseignement : • Limiter le nombre de données demandées au strict nécessaire. • Permettre le passage de champ en champ à l’aide de la touche TAB • Permettre à l’utilisateur de voir l’ensemble des données qu’il a saisis dans un formulaire. • Ordonner des champs selon une logique attendue par l’utilisateur (Nom puis prénom puis Adresse ...) • Fournir des aides et légendes. • Les libellés doivent être cliquables aussi bien que les champs. • Le bouton d’action principale doit-être visible et suffisamment près du formulaire.20
  21. 21. - Rapport d’audit ergonomique des tunnels de conversions du site KelAssur.comAider l’utilisateur à éviter et à corriger ses erreurs. • Indiquer le format de renseignement attendu. • Certaines données peuvent être validées à la volée. • Toutes les erreurs sont traitées en une seule fois. • Soigner les messages d’erreur : • L’apparence des messages d’erreurs doivent attirer l’attention. • Fournir un message spécifique, contextuel à chaque champ mal renseigné. • Mettre en valeur visuellement les champs mal renseignés. • Expliquer l’erreur et proposer une piste de résolution. 21
  1. Gostou de algum slide específico?

    Recortar slides é uma maneira fácil de colecionar informações para acessar mais tarde.

×