1 / 42

Conception des logiciels interactifs

Conception des logiciels interactifs. Cours 3.1. Techniques de conception itétative. M2-IFL/DU-TICE, UPMC Elisabeth.Delozanne@upmc.fr. Cours 2 : Les utilisateurs ?. Plan Les concepts de base Ergonomie Utilisateur élastique Utilisabilité Travail prescrit, travail réel

galia
Download Presentation

Conception des logiciels interactifs

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. Conception des logiciels interactifs Cours 3.1 Techniques de conception itétative M2-IFL/DU-TICE, UPMC Elisabeth.Delozanne@upmc.fr

  2. Cours 2 : Les utilisateurs ? Plan • Les concepts de base • Ergonomie • Utilisateur élastique • Utilisabilité • Travail prescrit, travail réel • Tâche et activité • D’autres modèles • Recueil de données • Entretiens, Observations, Magicien d’Oz, Enquête • Outils de Conception Centrée Utilisateur (CCU ) • Personas, Scénarios, Maquette et prototype

  3. C3 : Conception • C3.1 : Technique de conception itérative • Personas • Scénarios • Maquettes et prototypes • Points sur le projet • Techniques (poly de Mackay et Beaudoin-Lafon) • Espace de conception • Remue-méninges, tables fonctionnelles, alternatives • Scénario de conception, storyboard • C3.2 : Méthodes de conception • Méthodes de conception • Approche génie logiciel/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, Boucher • Lucid • Gould

  4. Analyse de besoins • Définir le concept de départ • Problème à résoudre, état de l’art, participants au projet et les bénéficiaires ou le public cible, hypothèses sur l’impact du projet, questions auxquelles le projet est confronté et les contraintes • Les études de terrain • Analyse des artefacts existants, observation sur le terrain et enregistrement d’activités dans un contexte de travail, interviews • Synthèse des résultats • Analyse de tâche et catégories d’activité • Scénarios d’utilisation et personas • Pensez le plus tard possible en terme de fonctionnalités offertes par le logiciel

  5. Distinguer • Analyse de besoins • Quel est le problème à résoudre ? • Conception • Quelle est la solution du problème ?

  6. Analyse des tâches • Méthodes formelles • Cf. livre de Brangier • Méthodes informelles • 11 questions (cous de berkley) • Catégories d’activités (Mackay)

  7. Analyse de tâches (Brekeley 2011) • Qui va utiliser le système ? • Quelles tâches exécutent-ils ? • Quelles tâches souhaitent-ils ? • Comment apprennent-ils à exécuter les tâches ? • Où sont exécutées les tâches ? • Quelles sont les relations entre les informations et les utilisateurs ? • Quels sont les autres outils à disposition ? • Comment les utilisateurs communiquent-ils entre eux ? • Quelle est la fréquence d’utilisation des tâches ? • Quelles sont les contraintes de temps ? • Que se passent-il quand les choses vont mal ?

  8. Catégories d’activité (Mackay) • Objectifs : • Préparer la création de personas et de scénarios • Faire une synthèse des comportements observés mais en conservant les détails utiles pour la conception • Procédure : • Travail collectif itératif • Relire et organiser les exemples observés dans les entretiens • Créer des histoires courtes pour illustrer chaque catégorie d’activité observée (au moins deux histoires par catégories) • Résumer

  9. Les classes d’utilisateurs (stakeholders) • Les utilisateurs du logiciel • Leurs collègues et supérieurs (directeurs) • Les développeurs • Les responsables maintenance et support • Les vendeurs du logiciel • Le service informatique de l’organisation • Les clients de l’organisation • Les syndicats • Les entreprises mères • Les associations d’employés • Les actionnaires (shareholders) • Les gouvernements (Ramage, 1997)

  10. Exemples • Chercheurs de l’Institut Pasteur [Letondal&Mackay 04] • Enquête : • Utilisateurs occasionnels de logiciels scientifiques (36 %) • Utilisateurs de micro-ordinateurs (15%) • Jeunes scientifiques (15 %) intéressés par la bioinformatique • Les apprentis (15%) qui s’initient à l’informatique • Les Gourous (6%) qui sont passionnés d’informatique et de programmation • Pépite • Élèves, professeurs (débutants, expérimentés, formateurs, collège, lycée), chercheurs (en didactique, en informatique)

  11. Personnas • Créer des personnages • Leurs compétences • Visuelles, tactiles, manipulatrices • Métiers • Connaissances du domaine • Leur contexte • Leur activité • Pourquoi • Évite les problèmes d’utilisateur élastique, de taille unique ou de logiciel bon à tout faire • Maintenir des usagers et leur contexte dans l’équipe de conception tout au long du projet • Faire référence à des utilisations de façon précise dans l’équipe de conception • Fait gagner du temps (on parle de la même chose), facilite la collaboration et la communication

  12. Persona • Représentation fictive d’utilisateur probable • Créé à partir de données réelles. • Guide les décisions concernant la conception • Précise les besoins et les caractéristiques des différents groupes d'utilisateurs lors de la conception

  13. Création d’un personnage • Quoi ? • Buts, attentes, motivations • Contexte • Quand ? Où ? Quel ordinateur ? Taille de l’écran ? Quel navigateur ? Quelle connexion ? • Qui ? • Age, sexe, éducation, expérience en informatique et sur internet • Valeurs • Psychologie • timide/agressif, impatient/patient, impulsif/systématique • Lui donner vie : en faire des affiches

  14. Exemple Jean-Claude Grosjean

  15. En savoir plus • www.chairerbc.com/axisdocument.aspx?id=194&langue=en...true • http://www.matthieu-tranvan.fr/webmarketing/taux-de-conversion-webmarketing/outil-definir-personas-e-commerce.html • http://www.qualitystreet.fr/tag/persona/ • http://works.bepress.com/djilali_idoughi/3/ • http://thinkvitamin.com/design/how-to-understand-your-users-with-personas/ • http://usability.gov/methods/analyze_current/personas.html • http://fr.wikipedia.org/wiki/Persona_%28ergonomie%29 • http://blocnotes.iergo.fr/breve/motsetphrases/les-personas/

  16. Scénarios ? • Une description d’une suite d’événements possibles • Format • histoire, « story board », video, tableau, description formelle • Catégories en IHM • scénarios d’utilisation • décrivent l’existant (avant ou après la conception) • scénarios de conception (ou de travail) • imaginent l’utilisation de systèmes futurs • Pourquoi ? • stimuler l’imagination et la créativité, susciter des questionnements un design pertinent pour de vrais utilisateurs dans un vrai contexte, pallier aux insuffisances et à la rigidité des analyses hiérarchiques • Qui utilise ? • Théâtre et cinéma, économistes, politiques, stratèges, management, marketing, conception orientée objet (use-case de UML), IHM

  17. Scénarios et cycle de vie • Quand utiliser des scénarios en IHM ? • Tout au long du cycle de développement du produit • Analyse de besoins • Scénario problème, scénario d’utilisation • Scénario observé ou des mixages de scénarios observés • Conception et prototypage • Scénario de conception, scénario de travail • Brainstroming (« remue-méninges ») • Évaluation • Scénario d’utilisation • Revue d’utilisabilité

  18. Scénario (Caroll 97) « Une autre perspective sur la conception de systèmes » Perspective « scénario »  • Descriptions concrètes • Accent mis sur des exemples précis • Dirigé par le travail • Ouvert, fragmentaire • Informel, brut, familier • Résultats envisagés Persp. « classique »  • Descriptions abstraites • Accent mis sur des types génériques • Dirigé par la technologie • Complet, exhaustif • Formel,rigoureux • Résultats spécifiés

  19. Personnages et scénarios Résumé • Définir les principales utilisations du logiciel • Polycopié : catégories de tâches • Définir les catégories d’utilisateurs • Polycopié : catégories d’utilisateurs et exemples de personnages • Associer un personnage à chaque utilisation et écrire un scénario • Raconter une histoire dans un intervalle de temps donné • Inclure des événements courants ou moins et des incidents • Polycopié : scénario d’utilisation

  20. Exemple de personnage et de scénarios • Marie-France • Expérimentée • Professeur principale (orientation) • Aime se renouveler, tester des méthodes nouvelles • Très attachée à ses élèves et à leur réussite personnelle • Pas passionnée par la technique en soi • Appel au secours enfants, maris, amis pour la dépanner ou lui montrer comment marche un logiciel • Contexte • Collège • Salle avec des vieux ordinateurs en techno et à la doc • Scénario 1 : Orientation des élèves de 3° fin d’année, confirmer • Scénario 2 : Début d’une nouvelle leçon, homogénéiser la classe

  21. Conception itérative et prototypage • Problème : complexité des spécifications • problèmes ouverts et difficiles à spécifier • communication au sein de l'équipe, avec les utilisateurs, les clients • Solution : le prototypage • construction de maquettes et/ou de prototypes • développement de solutions partielles ou intermédiaires • apparition de nouveaux objectifs • tests d'alternatives de conception évaluations des solutions retenues • succession de phases • affinements progressifs des spécifications du produit • réalisations et intégrations des aménagements jusqu'à obtention d'un produit satisfaisant

  22. Maquettes et prototypes • contraintes de temps et d'argent perturbent ce cycle idéal • démarche qualité • ergonomie : recommandations et modèles pour éviter des erreurs grossières mais conception sur papier : prises de décisions dans le risque • passage d'une itération à une autre peut provoquer des remises en cause des choix précédents • intérêt des démarches de prototypage/maquettage (de + en + couramment utilisées) • étudier des alternatives de conception • s'assurer de l'utilisabilité dans différentes conditions • aider les utilisateurs (ou les clients) à imaginer l'interface • se concentrer sur les parties problématiques de l'interface • se concentrer sur des détails qui font qu'un système bon en théorie est inutilisable • Référence : Beaudoin-Lafon, Mackay (03)

  23. Maquette • objet • présentation, organisation, simulation des écrans • ni accès au données, ni calculs • matériel • post-it, tableaux de papier, logiciels de présentation, générateurs d'interface • intérêt • phases initiales de la conception (analyse des besoins, spécification ) • réalisables rapidement et par des non-informaticiens (ergonomes, futurs utilisateurs) facilement modifiables et paramétrables • supports de communication au sein de l'équipe de conception • faire surgir de nouvelles idées, fonctionnalités, difficultés (réactions spontanées) • vérifier l'adéquation des choix aux besoins des utilisateurs, des clients • éviter les malentendus

  24. Prototype papier

  25. Prototype • objet • développement en profondeur d'une fonctionnalité complète • petite partie du système • matériel • générateurs d'interface • plate-forme de développement • intérêt • vérifier la faisabilité technique ou l'interopérabilité • valider une solution • mesurer un temps de réponse • conseils • concerne plus les décideurs que l'utilisateur final (dans cette conception)

  26. Développer un prototype • Papier • Video • Diaporama • Html • Outil gratuit : Pencil • http://pencil.evolus.vn/en-US/Home.aspx

  27. Résumé sur les prototypes Prototypes (ou maquette) • Pour qui ? • Pour aider les concepteurs, les utilisateurs, les clients, les prescripteurs, les décideurs • Pourquoi ? • "Un système peut être bon en théorie mais mauvais en pratique à cause de détails, même petits" (Wendy Mackay) • Les bons prototypes permettent • aux concepteurs de travailler sur les détails et sur plusieurs détails en même temps • aux utilisateurs et aux clients de voir ce que sera le système final • à l’équipe de se constituer un référentiel commun • Inconvénients • qui décide d'arrêter les itérations et quand ?

  28. C3 : Conception • C3.1 : Technique de conception itérative • Personas • Scénarios • Maquettes et prototypes • Points sur le projet • Techniques (poly de Mackay et Beaudoin-Lafon) • Espace de conception • Remue-méninges, tables fonctionnelles, alternatives • Scénario de conception, storyboard • C3.2 : Méthodes de conception • Méthodes de conception • Approche génie logiciel/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, Boucher • Lucid • Gould

  29. Projet : phase 1 Comprendre les utilisateurs • Vous avez déjà • Découvert les caractéristiques de vos utilisateurs • Interviews + observation + introspection • Noté les bonnes et les mauvaises idées d’application voisines • Aujourd’hui, nous allons en TD • Analyser les données • Catégories d’utilisateurs, d’activité • Prochaine séance • Créer des ressources pour la conception • Profils d’utilisateurs, personnages, catégories d’utilisation, scénarios d’utilisation

  30. Projet : phase 2 Inventer des idées • Découverte • Remue-méninges (brainstorming) • Analyse • Sélection des idées • Alternatives technologiques • Ressources pour la conception • Problème à résoudre • Espace de conception • Idées clés • Axes technologiques • Contraintes

  31. Projet : phase 3 Mettre en œuvre une idée • Collecte d’informations • Cahier des charges • Analyse • Table fonctionnelle • Alternatives • Ressources pour le design • Scénario de conception • Storyboard • Maquette

  32. Projet : phase 4 Évaluer une idée : est-ce que ça marche ? • Découverte • Méthode d’inspection • Heuristiques (cours 1 et 2) • Revue de conception (cours 4 et 5) • Test utilisateurs (cours 5 et ateliers) • Analyse • Qualitative/quantitative • Ressources pour le design • Liste de points forts • Listes de problèmes (pondérés)

  33. À Faire (1) • Pour le 21/10 • Liste des catégories d’utilisateurs • Liste des tâches • Personas et scénarios

  34. à faire (suite) • Pour le 25/11 • Mettre en œuvre une idée • Avant le cours • Remue-méninges (Brainstorming), scénarios de conception, table fonctionnelle, alternatives • En cours • Story-board • La séance suivante :25/11(dernière avant Janvier) • Évaluer une idée • Avant le cours • Maquette (low-tech) • En TD : Revue de conception

  35. Remue-méninges- Brainstorming (1) • But • Générer le plus grand nombre possible d'idées créatives rapidement • Procédure • Réunir un petit groupe avec différents rôles et expertises • Limiter le temps (1h) • Décrire un problème de conception spécifique • Générer autant d'idées que possible et les lister au tableau ou au rétroprojecteur • Sélectionner les meilleures idées • Types • Idées de conception (conception générale) • Dessin des écrans (conception détaillée)

  36. Remue-méninges (2) • Règles pour que le brainstorming soit efficace • Phase 1 : Générer une grande quantités d'idées • Faire participer tout le monde • Enregistrer toutes les idées • Ne pas évaluer les idées • Phase 2 : Classer les idées en fonction de leur qualité • Chacun annonce les idées qu'il préfère • Les idées sont classées par nombre de votes • Commencer la conception à partir des idées les mieux classées • Ne pas oublier les idées insolites

  37. Remue-méninges

  38. Scénarios (cours 2) • But : • Capturer les problèmes et les choses qui marchent • Garder le contexte en mémoire • Se centrer sur l’interaction, pas sur les fonctionnalités • Procédure : • Choisir un personna • Raconter une histoire plausible • Construire une série d’évènements qui décrivent l’interaction • Utiliser les faits réels obtenus lors des interviews et des observations • Type : • Scénario d’utilisation (sans le produit) • Scénario de conception (avec le produit) • Résultat : • Une histoire (2 ou 3 pages)

  39. Story-board • But : • Illustrer le scénario • Focaliser sur les détails de l’interaction • Procédure : • Dessin plus texte • Centrer sur la dynamique de l’interaction • Type : • Scénario d’utilisation (sans le produit) • Scénario de conception (avec le produit)

  40. Table fonctionnelle • But : • Donner une vision d’ensemble des fonctions et des objets de l’interface • Procédure : • Lister les objets conceptuels (ceux qui ont sens pour l’utilisateur) • Lister l’ensemble des fonctions et les objets auxquels elles s’appliquent • Vérifier la cohérence des deux tables • Résultat : • Liste des objets de l’interface • Objet, propriétés, représentations, fonctions • Liste des fonctions • Fonctions, objets, interaction, effet

  41. Alternatives • But : • Trouver au moins 3 alternatives pour implémenter une fonctionnalité • Procédure : • Choisir une fonctionnalité • Chercher différents types d’interaction/ de technologies pour la réaliser • Résultat : • Une description des alternatives

  42. Take home messages • Idée force • Talking to usersis not a luxury (Gould) • Time spent in the early phases pays mostdividends (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

More Related