Cours Ergo 1 Période 3 8 & 10 Décembre 2014 Ergonomie et design centré utilisateur 3. Architecture de l’information Mireille Bétrancourt, Vincent Widmer.

Présentation au sujet: "Cours Ergo 1 Période 3 8 & 10 Décembre 2014 Ergonomie et design centré utilisateur 3. Architecture de l’information Mireille Bétrancourt, Vincent Widmer."— Transcription de la présentation:

1 Cours Ergo 1 Période 3 8 & 10 Décembre 2014 Ergonomie et design centré utilisateur 3. Architecture de l’information Mireille Bétrancourt, Vincent Widmer - TECFA TECFA Technologies pour la Formation et l’Apprentissage

2 Plan des séances 1. Introduction Debriefing période 2 Rappel de la notion d’activité et de la démarche globale 2. Les documents non linéaires et la recherche d’information Définition d’un document non linéraire Navigation et recherche d’info au niveau cognitif ? 3. L’oculométrie en ergonomie des sites Web Démo et vidéo 4. Architecture de l’information Impact de l’organisation au niveau visuel et cognitif Quels outils pour faciliter la tâche de l’utilisateur ? Elaborer l’architecture : méthode du tri de cartes 4. Préparation de la période à distance Travail attendu pour P3 Prise en main du logiciel Axure

3 Introduction Petit rappel sur l’analyse de l’activité Plan de travail du projet de groupe

4 Rappel analyse de l’activité Source image : http://www.slfp.com/StyleSTL37.htm Source image : http://domotag.com Frigo et « maison sure »

5 Analyse de l’activité vs. analyse des « besoins » Activité réelle Faible connaissance de ses propres processus Usages imaginés souvent idéalisés Difficile d’imaginer « à vide » Entretien avec les utilisateurs finaux Analyse des traces Objectifs Contraintes Contexte

6 Plan de travail Cahier des charges Version initiale analyse de l’activité Contenu - Fonctionnalités Cahier des charges Version complète Projet initial analyse de la demande Tri de carte analyse concurrentielle Architecture Maquette statique Prototype 1 Évaluation avec utilisateurs Prototype 2 Rapport Maquettes statiques v2 implémentation Confrontation Entre vous P 2 P 3

7 Stratégie Objectif stratégique Focus Contenu Structure Architecture Squelette Navigation Surface Design visuel Modèle de Garrett (2000) simplifié Vision orientée tâche Vision orientée information Garrett, J.J. (2000). The elements of user experience. Besoin utilisateur Fonction- nalités Design de l’interaction Design de l’interface Esthétique

8 Les sites Web considérés comme des documents non linéaires Petit historique des documents non linéaires (hyperdocuments) Le concept global au niveau technique

9 *1945 : Vannevar Bush projet de la machine "Memex". *1965 : Théodore Nelson crée le mot "hypertexte". *1968 : Douglas Engelbart crée le système "Augment". *1969 : Documentation en ligne du projet Appolo. *1987 : Sortie d’Hypercard (Apple). *1987 : Premières grandes conférences scientifiques. *1991 : Tim Berners-Lee met au point le WWW. *1994 : Ouverture du diplôme STAF (ex MALTT) * 1997 : Lancement du moteur de recherche Google *2001 : Première page wikipedia en ligne *2006 : Lancement de l’Edutechwiki @tecfa Quelques dates clés

10 La notion d’hypertexte Et alors jhkje iuoléj iuhziue wluizliuh luhgl jlierug uegh hjegkjh kej kjkjhgkj kkjhgkjhg iéupéiuoi lien Nœud (ou unité d’information) ancre @Pierre Dillenbourg web

11 Dans un hypertexte, l’information est : découpée en unités d ’information organisée selon un double structure La structure des documents non linéaires A--- ----- A--- ----- A--- ----- A--- ----- A--- ----- A--- ----- A--- ----- A--- ----- A--- ----- A--- ----- Structure hiérarchique Structure sémantique

12 Avant de continuer, un petit exercice pour ne pas céder à l’assoupissement post- pause INDIVIDUELLEMENT, allez sur le site qui vous est indiqué sur la feuille de consignes 15 minutes Par deux, répondez aux questions de la fiche et postez dans openclass/MALTT2015

13 2. La recherche d’information dans des documents non linéaires 1) La recherche d’information au niveau cognitif (indépendamment de la technologie) 2) La navigation dans les hypertextes

14 Quels processus recouvre la recherche d’information ? Implicite : le lien question/ réponse n’est pas formulé explicitement

15 Quels processus recouvre la recherche d’information ? (2)

16 Le cycle évaluation - sélection - traitement CONTRAINTES SITUATIONNELLES CONNAISSANCES DISPONIBLES EVALUATION Représentation de but Plan de recherche SELECTION Identification Estimation pertinence Choix de la cible TRAITEMENT Intégration Filtrage Compréhension Etat de la solution satisfaisante FIN Tricot & Rouet, 1998

17 Enseigner la recherche d’information Wopereis, I., Brand-Gruwel, S., & Vermetten, Y. (2008). The effect of embedded instruction on solving information problems. Computers in Human Behavior, 24(3), 738-75.

18 Les difficultés de la recherche d’information dans un document non linéaire Calisir & Gurel 2003 Source image :http://www.interactivearchitecture. org/nevel-moving-labyrinth.html Sentiment de désorientation observé : - où trouver une information et comment y aller, - comment retrouver une page déjà lue - savoir ce que l’on a déjà exploré…

19 Les difficultés de la recherche d’information dans un document non linéaire Situation de « double tâche » Tâche de Recherche d’info Lecture Compréhension Mémorisation Tâche de navigation Représentation de la structure Mémorisation de son chemin Compréhension des outils Outils d’aide à la navigation Outils d’aide à la compréhension de la structure

20 Pause intégrative Prenez 5 minutes pour noter ce que vous en retenez sur la recherche d’information et la navigation, et les questions que vous vous posez.

21 3. L’oculométrie en ergonomie des sites Web 1) Pourquoi des documents non-linéaires pour l’apprentissage ? 2) Quels éléments de design pour faciliter l’apprentissage dans des documents non linéaires ?