Ergonomie des interfaces WEB et UX DESIGN
5-068
Besoin d’adapter cette formation à vos besoins ?
N’hésitez pas à nous contacter afin d’obtenir un devis sur mesure !
Formation créée le 26/11/2024. Dernière mise à jour le 06/03/2025.
Version du programme : 2
Programme de la formation Version PDF
À l’issue de la formation, l’apprenant sera capable de mettre en œuvre les principes clés d’ergonomie et d’UX Design (Expérience Utilisateur) dans la conception ou l’amélioration d’un site web, afin d’en optimiser la navigation et la performance. Cette formation a pour but d'amener les apprenants à un niveau SAME "Maîtrise" et d'enrichir les compétences : * Maîtriser les méthodes de conception des solutions informatiques du système d'information * Réaliser la maquette de la solution informatique répondant au cahier des charges * Assurer la démonstration et argumenter auprès du commanditaire la maquette de la solution * Prendre en charge les recettes (fonctionnelle et technique) du projet
Objectifs de la formation
- Intégrer l'ergonomie et l'UX Design dans les processus de conception Web
- Appréhender les normes et techniques existantes pour améliorer la qualité des interfaces
- Modéliser les utilisateurs et les tâches liées à une application Web pour adapter son IHM
- Réaliser la maquette d'un écran Web au moyen d'outils de design
- Effectuer l'audit qualité d'une interface Web selon des critères ergonomiques spécifiques
- Monter un scénario de test utilisateurs et recueillir des résultats
Profil des bénéficiaires
- Webmasters, Webdesigners, Chefs de projet digitaux, Graphistes, Concepteurs de sites Web, UX designers
- Avoir une bonne connaissance de l'outil informatique et d'Internet.
Contenu de la formation
-
Définitions, enjeux et principes
- La psychologie cognitive, le fonctionnement cognitif, la mémorisation et l'apprentissage.
- Ergonomie et UX. Définition de Don Norman.
- Rôle et intégration dans le cycle de développement.
- Mesures de performances (KPI) et retour sur investissement (ROI).
- Lois et principes en ergonomie : Fitts, Hick-Hyman, Miller, Doherty, etc.
- Les grandes figures du monde de l’ergonomie et UX.
- Techniques d'ergonomie.
- Exemple : Présentation de produits à faible ergonomie. Calcul de ROI.
-
La modélisation des utilisateurs
- Recueil d'informations : entretiens, étude contextuelle, observation utilisateurs, questionnaires...
- Recueil d'informations : focus groups,tri de cartes...
- Recueil de données : A/B Testing, Eye and Mouse Tracking, Web Analytics.
- Différences avec les études marketing.
- Les livrables : persona, experience map, arbre des tâches, cartes mentales.
-
Le maquettage
- Distinguer prototypage horizontal et vertical, portail et application.
- Classification des parcours utilisateur (principaux, secondaires).
- Les niveaux de maquettage : basse/moyenne/haute-fidélité. L’intérêt du wireframe, du papier, des thèmes.
- Technique du « mobile first », « responsive/adaptive design ».
- Présentation du User Centered Design : maximisation du feed-back utilisateur.
- Intégration du graphisme, aspect esthétiques et hédoniques, gestion des émotions, gamification.
- Philosophies de design : « material design, minimalist design, skewmorphism », etc.
- Logiciels : Figma, Adobe XD, Balsamiq, Axure... Heuristiques : widgets, layout, verticalisation des interfaces.
-
Evaluer les IHM Web
- Recueil de données directes : questionnaire post-test, évocation, Eye Tracking.
- L'évaluation en ergonomie de conception/correction.
- Audit expert : grilles d'évaluation Web.
- Critères de Bastien Scapin.
- Heuristiques de Jakob Nielsen.
- Lois de Gestalt.
-
Les tests utilisateur
- Description d’un protocole de test utilisateur.
- Recrutement des utilisateurs.
- Déroulé du test et debriefing, lieux et timing.
- Les types de tests : Guerilla/Remote/Lab Usability Testing.
- Les pratiques à éviter.
- Les questionnaires d’évaluation.
- Livrables et KPI.
-
Les spécificités du Web
- Contextes et usages : digitalisation, mobilité, accessibilité.
- Aspects fonctionnels : sites, pages, hyperliens, multimédia, animations.
- Webographie, Bibliographie.
- Feuilles de présence
- Mises en situation
- Formulaires d'évaluation de la formation
- Certificat de réalisation de l’action de formation
- TP :
- - Identifier les personas d'une application Web et leurs tâches principales. Conception d'un persona.
- - Maquetter les écrans d'une application Web d'après un cahier des charges.
- - Audit d'une interface Web existante.
- - Réalisation d’un test utilisateur sur une application web avec débriefing et livrables.
- Démonstration : Illustrations tout au long de la formation sur des sites Web actuels.
- Certains exercices peuvent nécessiter des PCs