Conception des logiciels interactifs Cours 4 Méthodes de conception centrée utilisateurs M2-EIAH, Paris 6 Elisabeth.Delozanne@upmc.fr http://planning.lutes.upmc.fr/masterEIAH/2007-2008/M2-P6-EIAH-Accueil.htm

Cours 1 : IHM, complexité Tâche Conception Humains Technologie Organisation et environnement social Chacun des facteurs influence les autres Il s’agit d’une première sensibilisation à la conception centrée –utilisateur (User Centred Design UCD, Norman 1986, pour dire que c’est pas tout récent) et de s’approprier des techniques de conception fondées sur le prototypage et l’utilisation de scénario d’utilisation

Cours 1 : Facteurs de succès Cycle de conception Conception centrée usager L’analyse des tâches et les analyses en contexte de travail usuel Le prototypage rapide L’évaluation constante Conception itérative La qualité de la programmation

Cours 2 : les utilisateurs ? L’analyse des tâches et les analyses en contexte de travail usuel Travail prescrit/travail réel Techniques Entretiens, incidents critiques, observation, magicien d’oz, scénarios, jugements d’experts, revue de conception, maquette et prototype

Plan Méthodes de conception et Conception centrée utilisateur Approche génie logiciel Approche ergonomique Exemples de démarches de conception en IHM Points communs à toutes ces méthodes Exemples de méthodes de conception Sites web : Coutaz, Lynch, Landay Lucid Gould Références Ce cours s’inspire principalement : Du cours et des TP sur la conception participative de Wendy Mackay à la conférence IHM’2002, Poitiers, Novembre 2002 Des tutoriels « Design and Rapid Evaluation of usable Web sites » organisé par Gene Lynch et «Scenario Based Usability Engineering » organisé par John M. Caroll et Mary B. Rosson à la conférence CHI’2000 en avril 2000 à la Haye Bibliographie [Bastien et al. 2001] Christian Bastien, Dominique SCAPIN, évaluation des systèmes d’information et critères ergonomiques, in Christophe KOLSKI (Ed.), Environnements évolués et évaluation de l'IHM, Interaction homme-machine pour les systèmes d'information Vol 2, Hermès, 2001, 53-113 [Drouin et al. 2001] Annie Drouin, Annette Valentin, Jean Vanderdonckt, Les apports de l’ergonomie à l’analyse et à la conception des systèmes d’information, in Christophe KOLSKI, (ed.), Analyse et conception de l'IHM, Interaction homme-machine pour les systèmes d'information Vol 1, chapitre 2, Hermès, 2001, 250 p, ISBN 2-7462-0239-5, p. 51-83 [Nielsen 2000], Jakob Nielsen, Conception de sites Web, l'art de la simplicité, Campus Press France, 2000, 385 p., 249 F, ISBN 2-7440-0887-7 [Bastien 1993] J. M. BASTIEN, D. SCAPIN, Ergonomic Criteria for the Evaluation of Human-Computer Interaction , rapport technique N°156 de l'INRIA, 81p., Juin 93 LUCID Software Design : Logical User-Centered Interactive Design, http://www.cognitic.com/method/lucid.html Deux exemples de conception centrée sur les utilisateurs, leur activité et les situations de travail Wendy Mackay, Anne-Laure Fayard, "Radicalement nouveau et néanmoins familier : les strips papiers revus par la réalité augmentée" , Journées IHM 1997 ( Accessible en ligne http://www.daimi.au.dk/~mackay/publications.html) Duplàa Emmanuel, Visser Willemien, « e-Ti », prototype d’assistance à la planification d’itinéraires multimodaux,Spécifications ergonomiques pour une application Web sur la base d’une démarche expérimentale, Actes IHM’2002 (papier écrit à partir du stage de DEA d’E. Duplaa, promotion 2000-2001 du DEA CHM&IE, Le Mans)

Idées de base Concevoir un logiciel interactif nécessite une équipe pluridisciplinaire Au moins : informaticien, ergonome, graphiste, spécialiste du domaine de l’application Dépend des finances et de l’ampleur du projet Techniques « low cost » Syndrome de l’ABS Intégrer des méthodes issues de l’informatique (Génie logiciel) de l’ergonomie Réf. Cours de Joelle Coutaz Interaction Homme-Machine : Points d'ancrage entre ergonomie et génie logiciel, école d'été CHM, Alpe d'Huez, septembre 1998 Le syndrome de l’ABS : « Dans les faits, les moyens financiers et le temps dédiés à l’assurance Utilisabilité font souvent l’objet de coupures radicales. Les évaluateurs sont les développeurs avec leur biais mais aussi avec leur manque de formation (…).Le plus souvent le développeur fait appel à sa seule intuition et, fort des capacités de son générateur d’interfaces, croit concevoir une interface adaptée. C’est ce que j’appelle le syndrome de l’ABS. Ce dispositif qui évite le blocage des roues du véhicule procure une fausse impression de sécurité. De même, les générateurs d’interface ne font pas du développeur un spécialiste en ergonomie. La première tentation est donc d’éliminer de l’équipe de développement les ergonomes sous prétexte que l’on dispose d’un générateur d’interface. Le second danger est de croire que l’exploration sauvage des technologies nouvelles va permettre améliorer les interfaces. » Approches en GL Modèles en cascade et en V fondées sur la rédaction de documents dont la validation permet de passer à l’étape suivantes ; Modèles en spirale fondée sur l’analyse de risques

Différences GL/ergonomie Objet d’étude GL : La machine : fonctionnement du système Ergo : Les humaines : utilisation du système Analyse des besoins GL : Fonctionnalités Ergo : utilisateurs et activité Conception GL : conception de l’application puis de l’interface Ergo : conception en parallèle du noyau applicatif et de l’interface Evaluation GL : Validation (tests unitaires, d’intégration du système) Ergo : Évaluation ergonomique

Modèle en cascade (1970) Analyse des besoins Conception du système et du logiciel Codage et tests unitaires L'analyse des besoins donne lieu à un cahier des charges qui sert de document contractuel entre le client et le maître d'œuvre La conception du système donne lieu à un document de spécifications externes qui décrit le système tel qu'il sera perçu par le client La conception logiciel est orientée vers la mise en œuvre informatique et produit un dossier d'architecture générale Ce modèle a été crée pour des grands projets où des contrats étaient signés à partir de spécifications écrites très précises. Dans une telle approche le développement de l'interface était relégué à la fin. C'est le noyau fonctionnel qui impose l'interface homme/machine. L'interface est gelée avant même qu'un utilisateur ait pu la tester. Intégration et test du système

Modèle en cascade avec itérations Analyse des besoins Conception du système et du logiciel Codage et tests unitaires Dans ce schéma apparaissent à chaque étape des phases d'évaluation qui peuvent provoquer des retours arrière. C'est la reconnaissance de la nature itérative du processus de développement d'un logiciel Aucune analyse des utilisateurs ou des tâches n’est citée ou préconisée. Intégration et test du système

Conception logicielle Modèle en V (pour les systèmes où la finalité est bien cernée, 1981) Conception logicielle Conception Analyse des besoins Codage Tests d'acceptation Tests d'intégration Tests unitaires Tests du système Conception détaillée La flèche en forme de V traduit la séquence temporelle. « La spécification et la conception s’intègrent dans une démarche descendante, alors que les validations et les tests sont situés dans une démarche ascendante. Dans chaque phase, de la démarche descendante doivent être prévues le plan, les moyens et les méthodes permettant d’évaluer et de valider les résultats de la phase. » Kolski 2001, p 26 Les tests sont effectués en séquence une fois le codage réalisé mais ils doivent être spécifiés lors de la phase correspondante de l'étape de conception. Apparaît donc ici le souci de prévoir le plus en amont possible l’évaluation du système, ce qui est incontestablement le point fort de ce modèle. Ce modèle ne précise pas la portée des retours arrière suite aux tests. Il fait partie lui aussi de modèle de conception "dirigés par les documents" où les concepteurs sont amenés à produire des spécifications détaillées de services qu'ils ne maîtrisent pas encore. L’analyse et la modélisation des tâches humaines ne sont pas positionnées dans ce modèle.

User Centered System Design (UCSD, Norman 86) Conception Centrée Utilisateur Étape d'analyse - systèmes existants - contexte d'utilisation Synthèse de l'analyse : - Modèle de l'utilisateur - Modèle de la tâche Caractéristiques de l'utilisateur Critères d'Utilisabilité Modèle de conception centrée utilisateur (User Centred System Design, UCSD) Certaines méthodes de conception (Cf. Kolski chapitre 1, 3, 4) distinguent : Modèle de la tâche du système Modèle de la tâche de l’utilisateur Étape de conception : - Les concepts informatiques - Modèle de l'interaction Scénarios d'utilisation

Norme ISO 13407 Les 5 principes de la conception centrée utilisateur Une analyse des besoins des utilisateurs, de leurs tâches et de leur contexte de travail La participation active des utilisateurs à la conception Une répartition appropriée des fonctions entre les utilisateurs et la technologie Une démarche itérative de conception L’intervention d’une équipe de conception multidisciplinaire

Conception centrée utilisateur l'utilisateur et sa tâche sont prioritaires sur le fonctionnement du système remplacer la logique de fonctionnement par la logique d ’utilisation dans la conception de logiciel "Talking to users is not a luxury, it's a necessity"(Gould 88) "Early and continual focus on the user, fight for user " (Schneiderman) démarche qui intègre l'analyse de l'activité et des modèles d'utilisateurs les guides et principes ergonomiques Modèle en V : D'après J. Coutaz : espace IHM et espace logiciel Analyse des besoins (GL) <-> modèles de l'utilisateur, modèle de la tâche Conception <-> conception et l'évaluation ergonomique intervient à chaque étape de l'espace IHM Schéma classique : conception abstraite puis production En fait : le processus n'est pas linéaire, D ’où la démarche par prototypage

Contre-exemples Conception ego-centrique Conception techno-centrique ( cours Landay)

Préoccupations ergonomiques & modèle en V (Coutaz) Modèle de l'utilisateur Modèle de la tâche Évaluation ergonomique Analyse des besoins Modèle de l'interaction Tests d'acceptation tests du système Espace IHM Conception D'après Coutaz et son équipe Remarquer la séparation : interface application Espace Logiciel tests d'intégration Conception logicielle tests unitaires Codage

L'évaluation au cœur de la conception Cycle de vie en étoile Adapté par Joëlle Coutaz de Hix et Hartson : Developping User Interface : Ensuring Usability through Product and Process, 1993, New-York, John Wiley.

Un modèle proposé par des ergonomes Tiré de Kolski 2001, p. 34 C’est une démarche en spirale On ne peut pas s’y tromper : pour les ergonomes le point central de la démarche est l’analyse de l’activité… Remarquer aussi la mise en situation dans le contexte socio-technique assez tôt dans la démarche de conception (Kolski 2001)

Conception participative W. Mackay, C. Letondal (2004) l'utilisation de la technologie est co-adaptative la technologie modifie les habitudes de travail et les attentes des utilisateurs les utilisateurs adaptent la technologie à leurs besoins, l'interprètent et la modifient obtenir des informations sur les utilisateurs par différentes approches au sein d'équipes pluridisciplinaire (triangulation) par différentes techniques (dont prototypage) intégrer les utilisateurs au processus de conception indispensable sur les activités de collaboration ou sur les activités ouvertes et mal identifiées Mackay Réalité augmentée : contrôle aérien, institut pasteur Caroll Développement personnel des enseignants : Conception de logiciel éducatif avec des enseignants Alison Druin Conception participative avec de jeunes enfants Lingot et Pépite Conception participative avec des didacticiens, des formateurs d’enseignants et des enseignants

Conception itérative Proposer des solutions techniques à partir de scénarios qui permettent d’explorer leurs avantages et leurs inconvénients Techniques d’exploration des scénarios pour les faire évoluer Techniques de protoypage

Landay : design of sites

Plan Méthodes de conception Exemples de méthodes de conception centrée utilisateur Coutaz http://iihm.imag.fr/docs/coutaz.ecole2/ConceptionPagesWeb.html Landay http://www.designofsites.com/pb/register.html Lucid http://www.cognetics.com/lucid/index.html Gould Gould, J. D., Boies, S. J., & Ukelson, J. (1997). How to design usable systems. In Helander, M. G., Landauer, T. K., & Prabhu, P. V. (Eds.), Handbook of human-computer interaction, 2d ed., 231-254. Amsterdam, The Netherlands: North-Holland.

Conception de sites web (Coutaz) Principes de base Ne se limite pas à écrire du code html ou Java La valeur du contenu est centrale Nécessite une bonne connaissance du public cible, de leur activité et du contexte de l’activité Analyses de terrain indispensables Spécificités du web Multiplicité des types d’accès Variabilité des ressources physiques Diversité des utilisateurs Temps de développement très courts Mises à jour fréquentes

Processus de développement Organisation de l’équipe Chef de projet, Concepteur d’interaction, développeur, expert en utilisabilité, graphiste, auteur, rédacteur Définition du site Cahier des charges, scénarios, contenu du site Conception et prototypage Critères de succès, structure du site, navigation, contenu, présentation Règles ergonomiques, contraintes techniques Évaluation Tout au long de la conception Implique tous les membres de l’équipe + le client + des utilisateurs

Le cahier des charges Objectifs généraux et critères de succès Utilisateurs cibles Spécifications techniques de la plateforme d’accueil Contraintes particulières Analyse des tâches Ex d’objectifs : Améliorer de 10 % le taux de réussite des étudiants Augmenter les ventes de 20 % Utilisateurs : déjà parlé : étude de terrain Spécifications techniques Système d’exploitation, écrans, butineurs, performances, sécurité etc. Contraintes Sous site compatibilité de la charte graphique, attrayant, innovant etc.

LUCID Logical User-Centered Interactive Design Caractéristiques : Distinguer Conception centrée utilisateur Conception technique Logiciel : composant d’une activité humaine plus large Prendre en compte les communications humaines dans l’activité Garder trace des actions passées de l’utilisateur Concevoir dans les termes de l’utilisateur, de l’activité et non dans les termes techniques

Les 6 étapes de Lucid Développement du concept du produit Construire une vision claire et partagée Analyse des besoins Découvrir les utilisateurs et leur activités Conception d’un prototype Conception globale Conception itérative Conception détaillée Conception et développement informatiques Suivi de réalisation Sortie du produit Support à l’adoption du produit et préparation de la version suivante Exemple : SpiralClock http://www.emn.fr/x-info/spiraclock/

1. Développer le concept Décrire rapidement le produit Son nom, à qui s’adresse-t-il ? Que fait-il ? Quel problème résout il ? Définir les retombées attendues Quels sont les bénéfices attendus du projet ? Identifier le public ciblé et le segmenter Construire des catégories (rôles, tâches, compétences) Ne pas oublier les utilisateurs secondaires : vendeurs… Identifier les principales tâches qui pourront être accomplies avec le système Identifier les contraintes de haut niveau Plateforme, bruit, accès public Proposer une maquette pour illustrer le concept Produit : une description d’une page et une maquette Description du produit en moins de 50 mots : SpiraClock is a new visualization technique for nearby events. Events are displayed inside an analog clock that can be also used as a regular computer clock. SpiraClock supplements traditional time-table or calendar displays by giving the user a continuous feedback on upcoming events. Compared to alarms and pop-up reminders, SpiraClock is far less intrusive and more informative.

2 Analyse des besoins Indispensable de travailler avec des utilisateurs finaux dans cette étape Segmenter le public cible Identifier les principales tâches Créer des scénarios pour décrire le travail actuel Identifier les fonctionnalités à définir intégration dans l’activité besoins de communication Identifier les objets métier objets métiers : pas les objets informatiques Produit : un document de synthèse des besoins

3 Conception d’un prototype Développer le modèle conceptuel de l’interface Identifier les métaphores Déterminer les principaux écrans et la navigation d’un écran à l’autre Définir les grandes lignes d’une charte graphique Produit de cette étape : un diaporama présentant les principaux écrans la navigation

4 Conception itérative Affinement de la conception à partir du premier prototype Revue de conception Inspection par des experts Inspection par des utilisateurs Tests d’utilisabilité Produit : un dossier de spécifications et un prototype stabilisé

5 Conception et développement informatiques Méthode de Génie Logiciel Modélisation informatique (UML) Mise en œuvre informatique Suivi de réalisation Ajustements de budgets, de délais, suivi de modification de spécifications Définir Les procédures d’installation L’aide en ligne La documentation La formation

6 Livraison du produit Tests finaux auprès de quelques utilisateurs Évaluation du système Préparation de la prochaine version

La méthode de J. D. Gould Objectif : Développer des systèmes utilisables Utilisabilité ? 11 critères Le processus de conception 4 phases Démarrage, conception initiale, développement itératif, installation 4 principes Se centrer continuellement et depuis le tout début sur les utilisateurs Tester continuellement et depuis le début auprès des utilisateurs Adopter une méthode de conception itérative Maintenir une vision globale des problèmes d’utilisabilité Avantages : des pense-bêtes clairs de choses à faire Inconvénients : ne traite pas des difficultés de mise en œuvre des techniques proposées

11 critères d’utilisabilité Performance du système : fiabilité et réactivité Fonctionnalités : adéquation à l’activité Interface utilisateur : organisation, dispositifs matériels d’entrée sortie, conception pour les utilisateurs finaux mais aussi pour d’autres groupes Documents d’accompagnement : utilisateurs finaux et autres groupes Traduction : de l’interface et des documents Diffusion : formation, aide en ligne, support téléphonique Adaptabilité et extension Installation et désinstallation Maintenance et service Publicité : acheter et utiliser Groupes d’utilisateurs

Leçons de l’expérience Dans des systèmes complexes personne ne réussit du premier coup Le développement de logiciel comporte toujours des surprises Il faut naviguer dans un océan de changements Rédiger des contrats n’élimine pas les besoins de changer Les besoins évoluent avec le système Les concepteurs ont besoin d’outils logiciels pour les assister Définissez des objectifs de comportement du système et des objectifs de performance Aussi bon que soit votre système, les utilisateurs feront des erreurs en l’utilisant

Les étapes incontournables (1) Démarrage Définir le problème qui se pose aux utilisateurs Étude de l’existant, des normes, recommandations etc. Conception initiale Identifier les utilisateurs et les tâches qu’ils ont à effectuer Étudier les compétences des utilisateurs Étudier les contraintes matérielles et logicielles Définir des objectifs de comportement du système

Les étapes incontournables (2) Conception itérative Construire des scénarios d’utilisation Concevoir et construire des prototypes Tester les prototypes Modifier itérativement les prototypes jusqu’à ce que soient atteints : Les objectifs Les dates butoirs Installation Installer le système chez les utilisateurs Évaluer les réactions des utilisateurs et leur degré d’adoption du système

Principe 1 Se centrer continuellement et depuis le tout début sur les utilisateurs Comment ? Définir un ensemble d’utilisateurs potentiel. Penser aux utilisateurs secondaires : formateurs, vendeurs etc. Parler avec eux des points positifs et négatifs de leur travail Visiter les lieux de travail , Observer ces utilisateurs quand ils effectuent les tâches, Les filmer Étudier l’organisation du travail Leur demander de commenter à haute voix quand ils travaillent Essayer de faire leur boulot (si possible) Faites participer les utilisateurs Intégrer un expert du domaine dans l’équipe de conception Utiliser l’analyse de tâches Utiliser des questionnaires Définissez des objectifs de comportement du système

Analyse de tâches Qui utilisera le système ? Quelles sont les tâches qu’ils effectuent actuellement ? Quelles tâches sont souhaitables ? Comment sont apprises les tâches Où sont elles accomplies ? Comment les utilisateurs accèdent-ils aux données pour effectuer leur tâches ? De quels autres outils les utilisateurs disposent-ils ? Comment les utilisateurs communiquent-ils entre eux ? Quelle est la fréquence des tâches ? Quelles sont les contraintes temporelles et matérielles ? Qu’est-ce qui arrive quand ça ne va pas ?

Synthétiser l’analyse de tâches (1) Méthodes formelles Ex : GOMS (Goals, Operators, Methods, Selection rules) Lourdes et complexes à mettre en œuvre Modèles hiérarchiques de tâches Tâche = but + procédure (sous-tâches avec des relations) Tâches composites et tâches élémentaires Arbres de tâches « décorés » Objets métiers, pré ou post conditions, fréquence, complexité, durée, acteur Exemples de catégories : Observables, Compétences et stratégies, Idées nouvelles Principales secondaires Exemple de scénario Temps, tâche, thème, lieu, participants, outils

Synthétiser l’analyse de tâches(2) Listes de tâches Description Catégorisation Séquencement Dépendances Durée Scénarios de tâches Commentaires, questions, minutage etc.

Appliquer l’analyse de tâches Quelles sont les tâches que le système doit couvrir et celles qu’il vaut mieux faire manuellement ? Quelles sont les tâches qui posent le plus de problèmes aux utilisateurs ? Le système résout-il des problèmes essentiels ou marginaux ? Est-ce qu’on oblige l’utilisateur à des tâches redondantes Quelles sont les relations entre les tâches ?

Principe 2 : tester, tester, tester Faire tester des scénarios écrits ou filmer Rédiger les manuels utilisateurs avant le codage Faire des maquettes et simuler le futur système Construire très tôt des prototypes Faire très tôt des démonstrations Utiliser des vidéos Utiliser les forums, les réseaux, les conférences Tester les prototypes de façon rigoureuse Organiser des séances de cassez-moi-ça Mener des études de terrains Faire des études de suivi d’utilisation Inclure des programmes qui gardent des traces des actions des utilisateurs pour les analyser

Principe 3 Adopter une méthode itérative de conception 3 impératifs Identifier les changements et les évaluer Tests auprès des utilisateurs, inspection etc. Conséquences du changement Se donner les moyens d’effectuer des changements Organiser le travail de développement Disposer d’outils logiciels Vouloir effectuer des changements

Principe 4 Maintenir une vision globale des problèmes d’utilisabilité Comment ? Un groupe doit être chargé de l’utilisabilité sur l’ensemble du projet et sur l’ensemble des critères Rédiger les manuels utilisateurs avant le codage pour guider le codage Rédiger des manuels utilisateurs pour les utilisateurs secondaires (formateurs, vendeurs, maintenances, chercheurs etc.) Prévoir la diffusion et l’exploitation du produit

Références http://iihm.imag.fr/docs/coutaz.ecole2/ConceptionPagesWeb.html http://www.designofsites.com/pb/register.html http://www.cognetics.com/lucid/index.html Gould, J. D., Boies, S. J., & Ukelson, J. (1997). How to design usable systems. In Helander, M. G., Landauer, T. K., & Prabhu, P. V. (Eds.), Handbook of human-computer interaction, 2d ed., 231-254. Amsterdam, The Netherlands: North-Holland. John M. Carroll http://www.personal.psu.edu/faculty/j/m/jmc56/

Reférences (suite) Kolski C. (dir.), Analyse et conception de l'IHM, Interaction homme-machine pour les systèmes d'information, Vol 1, Hermès, 2001. Scapin D., Bastien C., Analyse des tâches et aide ergonomique : l’approche MAD*, in Kolski C. (dir.), Analyse et conception de l'IHM, Interaction homme-machine pour les systèmes d'information, Vol 1, Hermès, 2001. Brangier E., Barcenilla J., Concevoir un produit facile à utiliser : Adapter les technologies à l’homme, Editions d’organisation, 2003. Letondal C., Mackay W., Participatory Programming and the Scope of Mutual Responsability: Balancing Scientific, design and software commitment, Proceedings Participatory Desing Conference, Toronto, Canada, 2004. Mackay W., Fayard A.-L., "Radicalement nouveau et néanmoins familier : les strips papiers revus par la réalité augmentée" , Actes des Journées IHM 1997

Take home messages Talking to users is not a luxury (Gould) Time spent in the early phases pays most dividends (Landay) Deux problèmes de conception Conception centrée utilisateur (Ergo) Conception technique (GL) Conception centrée utilisateur en deux niveaux Niveau tâche/activité : interface conceptuelle, conception globale Niveau écran : conception détaillée