La présentation est en train de télécharger. S'il vous plaît, attendez

La présentation est en train de télécharger. S'il vous plaît, attendez

30-771-01 Conception de sites Web Préparé par: Yan Bodain, M.A. Jean-Yves Fiset, ing., Ph. D. Sandrine Prom Tep, M.Sc. Martin Dozois, M.Sc.

Présentations similaires


Présentation au sujet: "30-771-01 Conception de sites Web Préparé par: Yan Bodain, M.A. Jean-Yves Fiset, ing., Ph. D. Sandrine Prom Tep, M.Sc. Martin Dozois, M.Sc."— Transcription de la présentation:

1 Conception de sites Web Préparé par: Yan Bodain, M.A. Jean-Yves Fiset, ing., Ph. D. Sandrine Prom Tep, M.Sc. Martin Dozois, M.Sc.

2 Révision Méthode de conception centrée sur l'utilisateur (ISO ) Analyse hiérarchique de la tâche (AHT ) HTML Ergonomie Note: Ces acétates présentent les notions clés incontournables vues lors du cours et servent à vous guider dans votre révision. Servez-vous en comme point de départ pour réviser plus en profondeur chacune des notions à laide des acétates de chaque séance.

3 Séance 1- Problématique des sites Web Problèmes généraux de conception * –Modèle daffaires – considérer le Web comme un moyen de publicité traditionnel (p. ex., brochure). –Besoins de lentreprise vs besoins des utilisateurs du site. –Architecture de linformation: Structure de lentreprise Mission du site –Conception des pages composant le site : Surface vs contenu commentaires informels vs évaluation * Nielsen, J., Conception de sites Web – lart de la simplicité. CampusPress. 2000

4 Séance 1 - Problématique des sites Web Problèmes généraux de conception : –Effet de délais –Lisibilité –Résolution –Navigation –Structure (principes, règles et critères de conception) –Emphase négative sur la technologie : Flash et animations Pages dintroduction Gadgets vs besoins

5 Séance 1 - Aperçu de la méthode - ISO Pourquoi utiliser une méthode? –Facilité de compréhension et dutilisation –Satisfaction de lutilisateur –Productivité et efficience opérationnelle –Qualité, esthétique et impact du produit, et avantages concurrentiels. Principes sous-jacents à cette norme : –Participation active des utilisateurs et compréhension claire des exigences liées à lutilisateur et à la tâche, –Répartition appropriée des fonctions entre les utilisateurs et la technologie.

6 Séance 1 - Utilisabilité Utilisabilité *: degré selon lequel un produit peut être utilisé, par des utilisateurs identifiés, pour atteindre des buts définis avec efficacité, efficience et satisfaction, dans un contexte d'utilisation spécifié. –Efficacité: précision et degré d'achèvement selon lesquels l'utilisateur atteint des objectifs spécifiés. –Efficience: rapport entre les ressources dépensées et la précision et le degré d'achèvement selon lesquels l'utilisateur atteint des objectifs spécifiés. –Satisfaction: absence d'inconfort et attitudes positives dans l'utilisation du produit. Conséquence –Utilisabilité facilité dutilisation * ISO Exigences ergonomiques pour travail de bureau avec terminaux à écrans de visualisation

7 Séance 2 - Survol de la méthode ISO Identifier la nécessité dune conception centrée sur lopérateur humain Comprendre et spécifier le contexte dutilisation Le système répond aux exigences de lutilisateur et de lorganisation Spécifier les exigences liées à lutilisateur et à lorganisation Évaluer les conceptions par rapport aux exigences Proposer des solutions de conception Ce processus est amorcé dès la formulation des spécifications initiales du produit ou du système.

8 Séance 2 - Survol de la méthode On peut représenter schématiquement le processus et ses activités comme suit: Analyse de la demande Identification de la mission Objectifs de conception dIHM Caractérisation des utilisateurs Analyse de la tâche Revue dinterfaces et de produits existants Identification des connaissances pertinentes Contraintes et possibilités techniques Conception globale –Guides: style et ergonomiques –Architecture Conception détaillée –Principes, règles et critères –Dispositifs dinteraction –Canevas Évaluation Spécification Identifier la nécessité dune conception centrée sur lopérateur humain Comprendre et spécifier le contexte dutilisation Le système répond aux exigences de lutilisateur et de lorganisation Spécifier les exigences liées à lutilisateur et à lorganisation Évaluer les conceptions par rapport aux exigences Proposer des solutions de conception

9 Séance 2 - Caractérisation des utilisateurs

10 Séance 3 - Analyse de la tâche Rôle de lanalyse de la tâche Technique danalyse hiérarchique de la tâche (AHT) Exercice

11 Séance 3 - Analyse hiérarchique de la tâche (AHT) Macro vs Micro : exemple de format graphique arborescent Retirer X $ du cpte chèque 1- Sidentifier 2- Choisir le compte 3- Spécifier le montrant 4- Exécuter le retrait 1.1 Insérer sa carte1.2 Entrer son NIP Faire 1,2,3,4 Faire 1.1, 1.2 Activité décomposée : –en étapes dactions nécessitant des opérations pour la réalisation concrète Difficulté conceptuelle : déterminer les étapes séquentielles vs parallèlles pour linteractivité

12 Séance 3 - Analyse de sites concurrents Pour compléter lidentification des fonctionnalités requises Permet didentifier des façons de faire qui peuvent être relativement usitées dans le domaine, p. ex. –commande –paiement –catalogues Pour identifier des bonnes idées à adapter et des erreurs à éviter.

13 Séance 3 - Possibilités et contraintes techniques Pour identifier la « palette » disponible pour la conception, p. ex. –temps, –échéancier, –normes ou réglementations pertinentes p. ex., accessibilité, normes internes de lentreprise –affichage moniteurs (type, taille et résolution) couleurs –dispositifs dinteraction clavier souris, téléphone sans fil, pda, voix –infrastructure réseau et modem (28.8, cable, ADSL) logiciel –« portalware » –outils spécifiques (p. ex., e-learning) –autres

14 Séance 4 - HTML - Éléments de base HTML=langage = lingu franca du Web = format de fichier (format de fichier le plus répandu voir la source dune page) Hypertext Mark-up Language = langage de marquage pour structurer les textes (titres, paragraphes, listes, tableaux,…) Incorporer des graphiques et autres contenus multimédia par références intégrées dans le texte Interfaçage avec des langages ou scripts complémentaires ex: CSS, jsp, XML, CGI, … Hyperlien: référence dans le texte vers des parties précises (ancres) ou vers dautres textes Définition hypertexte: liaison contextuelle infinie www = world wide web = toile daraignée géante de connexions Navigateur: interprète le code HTML (lecture des balises ou commandes de marquage) et représente le texte brut sous forme visuelle pour être vue à lécran Structure hiérarchique: logique demboîtement (poupées russes, tupperwares) –Propriétés globales (titre de page, fond, …) –Propriétés locales ( titres de paragraphes, tableaux,…) –Propriétés micro (graphiques, mise en forme du texte comme le caractère gras ou italique)

15 Séance 4 - HTML - Éléments de base Ossature HTML type Ouverture du contenu HTML Ouverture de la partie «en-tête» Ouverture du titre Bla blaTitre du document Fermeture du titre Fermeture de la partie «en-tête» Ouverture de la partie «corps du texte» Bla blaContenu du document Fermeture de la partie «corps du texte» Fermeture du contenu HTML

16 Séance 4 - HTML - Éléments de base Éléments de mise en forme Titre de section de niveau 1 Titre de section de niveau 2 … itre de section de niveau 6 italique gras barré

17 Séance 4 - HTML - Éléments de base Paragraphes et sauts de lignes Ceci est un paragraphe. Un espace est automatiquement créé avant et après le paragraphe. Ceci est un saut de ligne. Il permet de changer de ligne sans débuter un nouveau paragraphe. Notez que le marqueur na pas de fermeture.

18 Séance 4 - HTML - Éléments de base Attributs de certaines balises Paragraphe aligné à droite Texte de taille 2 Augmentation de la taille de 2 unités Diminution de la taille de 2 unités Taille 2 et police Verdana

19 Séance 5 - Notions de HTML: Lien vers un autre document Pour pointer vers un autre document via un hyperlien –attribut HREF ajouté à la balise. –Sites HTTP: Un pointeur menant à un document situé sur un autre serveur WWW (dont le URL commence donc par http) se bâtit de la manière suivante: Nom du lien NB: Il est aussi possible de créer des hyperliens qui pointent vers des sites ftp, telnet ou des adresses courriel… Site FTP de lUQAM Nous écrire –Si le document se situe dans le même dossier ou sur le même serveur que le document HTML en construction, on peut se contenter d'indiquer le URL relatif, c'est-à-dire d'indiquer le chemin de sous- dossiers à parcourir pour parvenir au document appelé

20 Séance 5 - Notions de HTML: Lien vers une image –La balise servant à intégrer des images dans un document HTML est ; il n'existe pas d'annotation de fermeture. –Attribut SRC obligatoire: indique le URL (Uniform Resource Locator ou adresse WWW) menant au document. (URL relatif tel que SRC="images/dejeuner.gif" ou URL complet tel que SRC="http://www.uqam.ca/images/dejeuner.gif") –Autres attributs de limage: ALT et ALIGN ALT: Pour assurer la compréhension des documents par les utilisateurs de fureteurs qui ne peuvent afficher les images, il est conseillé de proposer un texte alternatif avec l'attribut ALT. ALIGN: Pour aligner l'image Les paramètres "top", "bottom ", "middle", "Left", "Right", –Une image peut servir d'hyperlien. Ouvrir la balise avant le et la refermer ( ).

21 Séance 5 - Notions de HTML Lien relatif vers une image de niveau inférieur. index.html page1.html page2.html rep fille1.html img hec.gif img logo.gif

22 Séance 6 - Notions HTML: Metatags et référencement Pour optimiser le référencement: Utilisez des headings ( ) plutôt que des images pour vos titres de sections et de paragraphes Soigner le contenu du premier paragraphe de votre page afin quil contienne des mots clés judicieux Utilisez le caractère gras pour mettre en valeur certains mots clés Choisissez bien les mots de vos hyperliens Utilisez lattribut ALT sur les images pertinentes Nommez les fichiers et répertoires avec des mots clés complets, séparés de tirets (e.g. pantalons-hommes-1.html au lieu de ph1.html) Choisissez un nom de domaine, si possible, qui contient des mots clés (séparés de tirets).

23 Séance 6 - Notions de HTML: Listes Lait Fruits Oranges Pommes Pain Lait Fruits o Oranges o Pommes Pain

24 Séance 6 - Traitement des images Deux formats dimages pour le Web:.gif et.jpg.gif: Image possédant une palette constituée de 2 à 256 couleurs. Format utilisé pour les images représentant du texte (e.g. titres) ou des éléments de design dun nombre limité de couleurs..jpg: Image possédant une palette de millions de couleurs. Format utilisé pour des images photographiques ou des images ayant beaucoup de dégradés de couleurs. Le format.jpg peut être compressé (ce qui diminue la taille du fichier, mais aussi la qualité de limage). Un format dimage émergeant pour remplacer le.gif:.png (Portable Network Graphics). Format non-propriétaire recommandé par le W3C possédant plusieurs qualités (meilleure compression, qualité de limage). Nest par contre pas encore supporté par tout les navigateurs.

25 Séance 7 - Utilisation des tableaux Avantages –Mise en page, –Possibilité de créer zones spéciales (« sidebars »), –Outil pour atteindre certaine indépendance par rapport à la résolution. attribut « width » en pixels ou en % Application type : –Aide à la localisation déléments sur une page. Inconvénients : –Balises plus sophistiquées, parfois complexes.

26 Séance 7 - Balises et attributs des tableaux Exemple de code Sandrine Prom Tep, Mai 2003

27 Séance 7 - Balises et attributs des tableaux Exercice à faire:

28 Séance 7 - Utilisation des volets ou cadres (frames) Avantages –Solution intéressante pour les éléments communs de conception –Affichage de plus dune fenêtre à la fois –Peut aider à réduire une partie des tâches dentretien de sites Inconvénients –Bris de la métaphore « un affichage – une page » –Impose une navigation fixe (sans aucune rétroaction) –Difficulté de pose de signets –Difficulté dimpression –Difficile dindexer le contenu –Note: des solutions existent toutefois pour pallier ces difficultés. –Exemple de page bien faite avec frames: –Exemples de pages mal faites avec frames: :

29 Séances Survol de la méthode Identifier la nécessité dune conception centrée sur lopérateur humain Comprendre et spécifier le contexte dutilisation Le système répond aux exigences de lutilisateur et de lorganisation Spécifier les exigences liées à lutilisateur et à lorganisation Évaluer les conceptions par rapport aux exigences Proposer des solutions de conception Analyse de la demande Identification de la mission Objectifs de conception dIHM Caractérisation des utilisateurs Analyse de la tâche Revue dinterfaces et de produits existants Identification des connaissances pertinentes Contraintes et possibilités techniques Conception détaillée - Principes cognitifs, règles et critères - Dispositifs dinteraction Conception globale –Guides: style et ergonomiques –Architecture Évaluation Spécification

30 Séances Conception détaillée: Guides ergonomiques et perception visuelle Facteurs influençant lexploration visuelle: –objets larges, colorés, en mouvement –effets de la lecture ( exploration en Z ) –centre du champs visuel au détriment des bords –objets adjacents Il y a des différences dans les patrons de fixation / exploration entre novices et experts seriel vs global. Traitement de linformation toujours en contexte: macro/micro Principe de perception Figure/Fond Loeil cherche lordre pour lextraction de structures: –lalignement –le regroupement (association) –Le contraste ou lanomalie (mouton noir) –Lanarchie (nimporte quoi nimporte comment) ne fait pas de sens pour lindividu sinon en poésie…

31 Séances Perception visuelle En général, la lecture (texte et autre ) à lécran est différente de la lecture sur papier : –typos avec empattement pour le papier est préférable (serif: Times New Roman E ) vs sans empattement à lécran (sans serif: Arial E ) –20 à 30 % plus lente que sur papier (facteurs comme luminosité, réflection de la lumière, distance, etc). On lit sur un écran à une distance supérieure (approx cm) à la lecture sur papier (approx. 35 cm.) En général, une meilleure résolution à lécran diminue les différences avec la lecture sur papier mais attention la lisibilité est une chose différente de lusage de la lecture donc même avec le même niveau de confort pour la lecture, lusage nest pas nécessairement le même, différence de portabilité...(livre, pamphlet ou magazine vs ordi, palm, cell, etc.)

32 Séances Perception visuelle Facteurs influençant la lecture de texte sur écran: –Polarité (foncé sur pâle ou pâle sur foncé) foncé sur pâle peut réduire problèmes de reflets Idéal= texte noir sur fond blanc. –Couleurs saturées éviter rouge et bleu, bleu et vert sur fond foncé, ou rouge et vert pour éviter leffet 3-D. voici un exemple à ne pas suivre ni ça et ça non plus

33 Séances 8-9 Structures de sites Web Processus de conception de sites: Architecture * * Adapté de: Yales Web Style Guide, disponible à: Séquentielle: Utilisée quand: Groupes dinformation sont ordonnés (p. ex., logique, chronologie, du général au spécifique, alphabétique) Plutôt pour petits sites ou pour sous-sites à lintérieur dun grand site Ex: tour guidé, présentation historique, tutoriel, long formulaire denregistrement (ex: recruitsoft) Grille: Utilisée quand: Présente manuels de procédure, listes de cours, corrélations de type « temps – catégorie » Notes: exige une grande uniformité dans la structure de linformation (on peut accéder en tout point de façon équivalente) pour information sans organisation hiérarchique Ex: WW: différents angles de vue de 3 modèles de voitures : Coccinnelle, Golf et Jetta ou 3 livres et différentes éditions dans le temps…

34 Séances 8-9 Structures de sites Web Hiérarchie : Utilisée quand: Veut refléter la structure dune organisation Note: une des plus utilisées car rappel: cognition et ordre Voir aussi une AI proche : AI en rayon lorsque tout se rapporte à une même chose (objet, personne, etc.) Toile: Utilisée quand: Veut poser peu de restrictions sur lutilisation de linformation et la navigation, favorise lexploration, la découverte, interfaces ludiques can be « very engaging » Veut favoriser une densité très élevée de liens Note: peut propager la confusion et rendre plus difficile lélaboration dun modèle pour lutilisateur – Plutôt pour petits sites et experts Ex: Savedbythebelles.com (17 tableaux selon lhumeur)

35 Séances 8-9 Structures de sites Web Problèmes fréquents : Structure trop large, page daccueil surchargée de liens souvent peu reliés entre eux. Structure trop profonde, nécessite beaucoup de clics pour la parcourir et trouver linformation requise. Morale: pas de règle fixe, nécessité déquilibre tests dutilisabilité et bon jugement. Ergonomie: Science (règles, principes et méthodes) et un Art (bon sens et expérience) Illustration conjointe de ces 2 problèmes: Intégration de différents sites ex: cinéma

36 Séances Sites Web Lecture de pages : –une étude * montre que 79 % des utilisateurs « balaient » la page et que seulement 16 % la lisent « mot à mot » –Exemple damélioration de lutilisabilité en appliquant ces règles: Nielsen, J. « Alertbox for October 1, 1997: How Users Read on the Web », Nebraska is filled with internationally recognized attractions that draw large crowds of people every year, without fail. In 1996, some of the most popular places were Fort Robinson State Park (355,000 visitors), Scotts Bluff National Monument (132,166), Arbor Lodge State Historical Park & Museum (100,000), Carhenge (86,598), Stuhr Museum of the Prairie Pioneer (60,002), and Buffalo Bill Ranch State Historical Park (28,446).Carhenge 0 % In 1996, six of the best-attended attractions in Nebraska were Fort Robinson State Park, Scotts Bluff National Monument, Arbor Lodge State Historical Park & Museum, Carhenge, Stuhr Museum of the Prairie Pioneer, and Buffalo Bill Ranch State Historical Park.Carhenge 58 % In 1996, six of the most-visited places in Nebraska were: Fort Robinson State Park Scotts Bluff National Monument Arbor Lodge State Historical Park & Museum Carhenge Stuhr Museum of the Prairie Pioneer Buffalo Bill Ranch State Historical Park 124 %

37 Séances Sites Web Organisation de linformation –La connaissance de nos publics cibles détermine le type d'organisation de notre information –Selon Kilian, le contenu et le style de notre information textuelle doivent refléter ce que nous savons de nos visiteurs. Nous devons donc chercher à cerner le mieux possible nos publics cibles et nos objectifs. –Citant son collègue Jeffrey Zeldman, Kilian admet trois grandes catégories de publics cibles sur le Web : –Les « téléspectateurs », à la recherche de divertissement visuel narratif, –Les « utilisateurs », à la recherche d'information pour leur projet hiérarchique –Les « lecteurs », qui font défiler de longues pages thématique. L'organisation thématique est la plus répandue sur le Web.

38 Séances Sites Web Erreurs fréquentes pour les sites WWW : –Cadres ("frames") =>impression et renvoi dun url plus difficiles, –Gadgets et animation gratuite, –Boîte de défilement de texte, animation => utilisateurs confondent avec la publicité et lignorent, –Éléments de navigation excèdent la taille de la page visible, –Couleurs inhabituelles pour les liens et texte souligné, –Information obsolète, –Temps de téléchargement excessif. Adapté de:

39 Séances Recommandations – accessibilité WWW Web Content Accessibility Guidelines 1.0 (W3C Recommendation) 1. Provide equivalent alternatives to auditory and visual content. 2. Don't rely on color alone. 3. Use markup and style sheets and do so properly. 4. Clarify natural language usage 5. Create tables that transform gracefully. 6. Ensure that pages featuring new technologies transform gracefully. 7. Ensure user control of time-sensitive content changes. 8. Ensure direct accessibility of embedded user interfaces. 9. Design for device-independence. 10. Use interim solutions. 11. Use W3C technologies and guidelines. 12. Provide context and orientation information. 13. Provide clear navigation mechanisms. 14. Ensure that documents are clear and simple.

40 Séances Problèmes fréquents avec les IHM Faible guidage Incohérences vis à vis du guide de style (ex. canoë infos) Exige souvent, implicitement, trop de qualification des utilisateurs Pas de définition claire du but de chaque affichage Cas spécial: –Le transfert sur logiciel de formulaires est généralement un défi de taille. Une conversion du type "un formulaire => une fenêtre" ne fonctionne généralement pas très bien.

41 Séances Méthodes d'évaluation Plusieurs méthodes d'évaluation: –Inspections heuristiques –Tests dutilisabilité –Cognitive Walkthrough (low fidelity papier) –Semi-automatique (Web) Chaque méthode d'évaluation: –permet d'identifier différentes améliorations à apporter –est appropriée à un moment différent dans le cycle de vie d'un produit (ex. Cognitive walkthrough plutôt au début et semi-automatique à la fin dun développement) Choix d'une méthode dépend: –du moment dans le processus de développement –du type de tâches à valider (terminologie ou séquences) –des caractéristiques des utilisateurs visés (experts ou grand public) –de la nature du système à développer –des ressources disponibles (ex.: temps, budget, échéancier)

42 Une inspection heuristique consiste à faire examiner une interface par un nombre restreint dévaluateurs qui posent un jugement sur sa conformité à un ensemble de principes dutilisabilité ("heuristiques"). –Avantages: rapide, peu coûteux. permet d'identifier des problèmes importants. ne requiert pas la participation des utilisateurs. –Désavantages: en dépit de sa simplicité apparente, demande une grande expertise des évaluateurs par rapport à l'ergonomie des IHM. ne trouve que 30 à 50 % (en général) des problèmes que vivront les utilisateurs. Séances Inspection heuristique

43 Liste dheuristiques recommandés: (adapté de Nielsen & Mack, 1994) –Visibilité de létat du système (quest-ce qui se passe) –Pairage entre système et langage/concepts de lutilisateur –Contrôle et liberté de lutilisateur (undo, redo, sortie..) –Cohérence et conventions par rapport au guide de style utilisé –Prévention des erreurs –Reconnaissance plutôt que rappel –Flexibilité et efficacité dutilisation (utilisateurs novices et experts) –Minimalisme (less is more) –Aide les utilisateurs à reconnaître, diagnostiquer, et corriger les erreurs –Aide et documentation (simple, dirigée, etc.) –Autre grille Bastien et Scapin:Bastien et Scapin Séances Inspection heuristique

44 Quand l'utiliser: –Quand la conception détaillée est assez stable –Idéalement, avant le développement ou le déploiement dune d'IHM –Comme technique complémentaire lorsque des difficultés semblent se présenter lors de lutilisation du logiciel. Conseil: –Ce type dévaluation peut être perçue comme négative (alors que cest en fait sa nature même). Il faut donc prévoir la façon dont les résultats seront communiqués et préparer le terrain avant même le début de lévaluation. Ceci est TRÈS important! Séances Inspection heuristique

45 Un test dutilisabilité consiste à faire utiliser une maquette, un prototype, ou un système par des utilisateurs représentatifs de ceux visés et à leur faire exécuter des simulations de tâches représentatives de celles prévues. Évaluation basée sur la performance de l'utilisateur. Existe en plusieurs saveurs... Norme: –ISO Ergonomic requirements for office work with visual display terminals (VDTs) Part 11: Guidance on usability Séances Tests dutilisabilité

46 Avantages: –Permet d'identifier a priori des problèmes d'utilisation sérieux ou récurrents d'un système. –Permet de mettre l'emphase sur les problèmes importants au lieu de s'attarder sur les moins importants. Désavantages: –Nécessite une grande expertise des évaluateurs –Grande variabilité dans la façon d'effectuer des tests d'utilisabilité –Relativement coûteux en termes de ressources (incluant les utilisateurs), temps et $; toutefois, bien moins chers que des ventes perdues, clients mécontents, correction au logiciel, etc. Séances Tests dutilisabilité

47 Quand lutiliser: –Pour raffiner la conception détaillée de l'IHM –Avant ou durant le développement ou le déploiement dune IHM –Avant le déploiement d'une IHM –Avant de choisir un nouveau logiciel –Lorsque des difficultés semblent se présenter lors de lutilisation du logiciel (temps d'apprentissage excessif, erreurs, mauvaise performance, insatisfaction) Durée d'un test d'utilisabilité < 2 heures max Nombre de sujets: –des données limitées suggèrent que 80 % des problèmes dutilisabilité d'une version de la maquette ou du produit pourront être trouvés avec 4-5 sujets. –Note: Si les tests dutilisabilité servent lors des premières itérations de la conception détaillée, il est probablement meilleur dutiliser la stabilité de la conception plutôt que le nombre de sujets indiqué ici pour juger de la qualité de la conception. Par exemple, si chaque test permet didentifier de nouvelles lacunes, il vaut mieux continuer les tests plutôt que darrêter à 4 ou 5…Idem sil sagit dune situation où le risque est élevé Séances Tests dutilisabilité

48 Le "Cognitive Walkthrough" consiste à utiliser une maquette de l'IHM à partir de tâches spécifiques et d'identifier les écarts entre les actions et le feedback observés par rapport aux buts et aux connaissances des utilisateurs. –Méthode basée sur la théorie de l'apprentissage par exploration et permet d'identifier des problèmes rencontrés par l'utilisateur lors de l'apprentissage des tâches. –Peut être utilisée en conjonction avec l'évaluation heuristique Avantages: –Aide à bien définir les buts et les hypothèses de conception –Peut être effectuée par les développeurs du système Désavantages: –Très difficile (pénible) à réaliser, demande beaucoup d'expertise –N'identifie pas toutes les incohérences ou les problèmes généraux et récurrents Séances Cognitive Walkthrough

49 Bonne révision et bon succès!


Télécharger ppt "30-771-01 Conception de sites Web Préparé par: Yan Bodain, M.A. Jean-Yves Fiset, ing., Ph. D. Sandrine Prom Tep, M.Sc. Martin Dozois, M.Sc."

Présentations similaires


Annonces Google