Transcript ppt - L`UTES

UE 2 : CCU-Web
Cours 0 : Présentation de l’UE
1-Conception Centrée Utilisateur
2-Présentation de l’UE
M2-IMFL/DU-TICE, UPMC
[email protected]
1
Qui suis-je ?
Projet CCU
Maître de Conférences Informatique Paris 6 (sept. 2007->…)
Enseignante
 IHM, Algorithmique, Programmation, TICE, Math
 U. Paris-Descartes, IUFM de Créteil, IUP U.. du Mans, Secondaire
Chercheure
 Équipe Mocah du LIP6
 Thèse en 1992 (Université du Maine)
 Centres d’intérêts
 EIAH (Projets Élise, Repères, Pépite, Lingot)
 IHM, Conception participative et le prototypage
 Congé pour recherches : U. Sydney, Télé-U. du Québec
2
Johan Michel
Cours web
Chef de projet Pédagogique Speexx (Avr. 2007)
 Création, mise en place et gestion de dispositifs
d’apprentissage des langues
 Maître d’apprentissage, Paris 3
Enseignant
 Programmation web, Algorithmique, POO, TICE, introduction
aux métiers de la FOAD Langue
 UPMC, U. du Maine
Chercheur
 Thèse 2006 (U. du Maine)
 Centres d’intérêts
 EIAH langues, FOAD langues
3
Bertrand Marne
Projet Web
Attaché temporaire d’enseignement et de
recherche au LIP6
Enseignant
• SVT (jusqu’en 2014)
Chercheur
• Équipe Mocah du LIP6
• Thèse en juillet 2014
• Outils auteurs et jeux sérieux
4
Julien Chenat
Cours CCU-UX
8 d’expérience : User Experience Designer
• Architecte de l’information (Viadeo)
• Consultant en ergonomie (Altima, Enjoy Affinity,
Tagora)
• Chef de projet Web, Concepteur et développeur
Web
5
Conception Centrée Utilisateurs ?
D. Norman en 1986 , Norme ISO 13407 (1999)
5 principes
1. analyse des besoins des utilisateurs, de leurs tâches et de
leur contexte de travail
2. participation active de ces utilisateurs à la conception
3. répartition appropriée des fonctions entre les utilisateurs et la
technologie
4. démarche itérative de conception
5. intervention d'une équipe de conception multi-disciplinaire
6
Cycles de conception itérative
(cours de James Landay)
7
Ce module
Techniques pour
 Aborder l’interaction H/M du point de vue de l’utilisateur
 Maintenir ce point de vue tout au long de la conception
8
Interaction « Homme »/Machine
[8]
(Guide to usability, Open University, 1993)
9
Interaction Humains Machines
Interaction : Boucle
 Les gens expriment leur intention
 Le logiciel interprète, exécute et
communique des résultats
 Les gens interprètent les modifications
Humains
 Les utilisateurs finaux, leurs collègues
 Leur activité, le contexte, leurs besoins,
leurs difficultés, leurs échanges via les
réseaux
Machines
 Des (matériels et) logiciels
 Avec des contraintes techniques et
matérielles
10
Interface Homme-Machine
Partie d’une application qui permet
 Aux gens
 d’interagir avec la machine
 À la machine
 de communiquer des résultats
Logiciel/matériel
(I/O Brush)
11
Point de vue des usagers
Pour l’utilisateur
produit = interface
12
Pourquoi étudier la CCU ?
1.
Économiques
 50 à 90 % des coûts de développement
2. Sociales
 des interactions mal conçues coûtent cher
 Argent :+ 5 % de satisfaction => + 85 % de hausse (Landay)
 Vie : accident du Mont Saint-Odile
3. Scientifiques et techniques
 Défis
 Personnes : imprévisibles
 Activités : complexes
 Techniques, méthodes et démarches rigoureuses
4. Professionnelles
 Vous aurez à travailler
 pour des entreprises/services qui font des applications pour des
utilisateurs, pas seulement pour des machines
13
Qui sont les concepteurs ?
Une équipe
Idéalement
 Spécialistes de l’interaction/l’expérience utilisateur (UX)
 Ergonomes
 Marketing
 Rédacteurs techniques
 Ingénieurs spécialisés dans les tests
 Développeurs Informatiques
 Graphistes
 Utilisateurs
14
Reproches
Les concepteurs
 ne sont pas formés
 à l’analyse de besoins, à travailler avec des utilisateurs
 se centrent uniquement sur les fonctionnalités et sur le
fonctionnement du système
 traitent l’interaction en dernier
 pensent que tous les utilisateurs
 leur ressemblent
 sont idiots
 ne comprennent pas que les besoins évoluent au cours
de conception
15
Deux écueils en images
Conception ego-centrique
(cours Landay)
Conception techno-centrique
16
16
Objectifs de l‘UE
1. Sensibiliser
 aux démarches ergonomiques et centrée-utilisateur
2.
Faire connaître et pratiquer
 techniques simples mais efficaces
 d’évaluation et de conception centrée utilisateur de
logiciels interactifs
3. Techniques de réalisation d’une interface
Web (cours de M. Michel et B. Marne)
 Html, php, javascript
17
Compétences (1/2)
Savoir
1. organiser
une démarche rigoureuse de conception centrée utilisateur
2. mettre en œuvre
 des techniques simples de recueil d’informations, d’analyse
et de conception :
 entretiens, remue-méninges, scénarios et personas,
maquette à main levée, prototypage, inspection
heuristique, revue de conception
 un plan d'évaluation dans un projet
 une base de données en PHP/MySQL
 un site Web en utilisant Javascript et un framework
HTML/CSS
18
Compétences (2/2)
3.
rédiger
 une analyse de problème , un dossier de conception, un
rapport d'évaluation d'un logiciel interactif
 une fiche de lecture
 une bibliographie en utilisant un logiciel de gestion de
références
4. trouver
 les recommandations, guides de style, standards, design
patterns, les expertises
5. organiser
 un travail en équipe
6. communiquer
 vos idées, les argumenter, les développer et les faire
évoluer
19
Organisation de l’UE
4 enseignants :
 J. Chenat, É. Delozanne : Conception centrée utilisateur
 Johan Michel, Bertrand Marne : Technologies Web
Apprentissage par confrontation
 de pratiques :
 un projet
• mise en œuvre des techniques visées
 vos expériences d’utilisation de logiciel
 retours sur votre travail
• du groupe
• des enseignants
 d’ interrogations théoriques :
 cours
 lectures personnelles :
• Avant le cours, Synthèse, Pour approfondir, Pour mettre en œuvre
20
Plan du cours
Web
• 5 cours Web (Html, Base de données, php)
• 9 TP (Zotero, Javascript, Frameworks HTML/CSS,
encadrement du projet)
CCU
• 5 cours CCU
• 8 TP encadrement du projet (analyse
concurrentielle, entretiens, personas, scénarios,
revue de conception, évaluation)
Bibliothèque universitaire
• 1 séance de présentation de la BUPMC
21
Projet
Conception d’une application Web (mobile)
1. Utilisateurs potentiels réels et accessibles (entretiens)
 Qui ne vous ressemblent pas trop
2. Une base de données
Par groupe de 2 ou 3
Livrables réguliers
 Déposer des documents sur un site web à dates fixes
 Obtenir des retours rapides sur votre travail
 Pour progresser (pas sanctionner, seconde chance)
Mettre en œuvre les différentes techniques étudiées en cours
Produire un prototype évalué par vos pairs fin janvier
22
Sujet
Pas trop ambitieux
Des utilisateurs
 Accessibles (entretiens)
 Différents de vous
Exemples de sujets
http://lutes.upmc.fr/delozanne/2014-2015/IHMweb/projetIHM.htm
23
Déroulement
4 phases
• 0 : dépôt de sujet (10/9), constitution des
équipes (17/9)
• 1 : définition du problème (12/11)
• 2 : conception (17/12)
• 3 : développement (27/1)
• 4 : évaluation (28/1)
24
Projet encadré
Présentation des Techniques
• Cours, exercices
• Fiches de synthèse
• Bibliographie
Mise en œuvre séances de projet
 Rendre un document (en ligne)
 Présenter l’avancement du projet (phase 0-2)
 Développer (phase 3)
 Évaluer (phase 4)
25
Fiche de lecture
Choisir un texte et préparer une fiche
Thèmes: CCU, conception, évaluation
Fiche
 Identification
 de l’auteur de la fiche, du texte, des auteurs, de l’ouvrage dont
est issu le texte
 Résumé (ce que disent les auteurs)
 Analyse et commentaires (ce que vous en pensez)
 Les erreurs de vos prédécesseurs
A rendre le 1 ier octobre sur Moodle
Consignes et conseils :
http://lutes.upmc.fr/delozanne/2014-2015/IHMweb/LectureCCU.htm
26
Lectures
Une excellente introduction à l’ergonomie du logiciel
 E. Brangier, J. Barcenilla, Concevoir un produit facile à utiliser : Adapter les
technologies à l’homme, Editions d’organisation, 2003
Des méthodes, des conseils et des exemples

A. Boucher, Ergonomie Web, Eyrolles 2009

S. Daumal,. Design d'expérience utilisateur: Principes et méthodes UX. Éditions
Eyrolles, 2012

S. Krug, Don't make me think, Pearson France, 2012

L. Wroblewski, Mobile first, Éditions Eyrolles 2011

A. Walter, Design Emotionnel, Éditions Eyrolles 2011
Des fiches de synthèse à chaque étape du projet
Autres références
http://lutes.upmc.fr/delozanne/2014-2015/IHMweb/LectureCCU.htm
27
Contrôle de connaissances
Première session : Contrôle continu (CC)
 P : Note de projet (sur 20)
 L: Fiche de lecture IHM (sur 20)
 TP : Travaux pratiques en php, mysql, html (sur 20)
CC = (2P+ L +TP)/4
Deuxième session (NF)
 Examen : E2
 NF = sup (E2, (E2 + CC)/2)
28
Devoir pour le 10/9
Projet :
 Réfléchir à un idée de projet
 Déposer une fiche descriptive sur Moodle
 Faire campagne pour trouver des équipiers
Lecture
 Choisir un texte
 Commencer la lecture
 Rédiger une fiche de lecture (1/10)
29
En tant que concepteur…
Retenez
Ce n’est pas à l’utilisateur de s’adapter à vos idées, certes géniales
Mais
1. C’est à vous d’adapter l’application à l’activité de l’utilisateur
2. Les utilisateurs savent rarement spécifier leurs besoins
3. Les besoins évoluent avec le temps
Pour cela
Des sciences (humaines) : ergonomie (des logiciels), psychologie,
sociologie
Des méthodes : conception centrée utilisateur
Des techniques : entretiens, incidents critiques etc.
30
Dicton du jour
Pour l’utilisateur
produit = interface
31