Staf 12 – Période 4: Architecture d’information

1. Staf 12 – Période 4:Architecture d’information Charline Poirier, PhD Ethnography/User research

2. Phases de développement • Architecture • Extraction des contenus • Classification des contenus • Analyse des tâches et activités • Production de scénarios • Définition de la stratégie Déploiement • Construction • Création de prototypes • Usabilité • Modifications du prototype • Conception • Entretiens • Observations • Besoins de l’organisation • Stratégie de l’organisation • Divergences culturelles • Analyse concurrentielle

3. http://www.continental.com/ http://www.dancearea.ch/ Styles de sites web Charline Poirier, PhD Ethnography/User research

4. http://www.continental.com/ Fonctionnel: Site organisé autour des activités des utilisateurs (verbes dans les menus) Souvent offre un service plutôt qu’un produit Sites interactifs et conviviaux. http://www.dancearea.ch/ Thématique: Site organisé autour de descriptions (noms dans les menus) Centré sur le sujet traité et non sur les actions des utilisateurs Styles de sites web Charline Poirier, PhD Ethnography/User research

5. - Niveau d’engagement de l’utilisatuer +

6. Critères pour la classification • Le but du site (Pourquoi?) • L’architecture d’information (Comment l’information est-elle structurée et interreliée? ) • La présentation des contenus (Où est l’emphase du site; comment on aborde l’utilisateur) • Les activités possibles sur le site • …..

7. Classifiez ces sites • http://www.tenbyten.org/10x10.html • http://www.kartoo.com/ • http://www.deviantart.com/ • http://www.k10k.net/ • http://www.mirrorproject.com/ • http://turnerclassicmovies.com/ • http://zed.cbc.ca/go.ZeD?page=home • http://www.bigfuntoys.com/ • http://www.netflix.com/Default • http://www.marthastewart.com/ • http://www.colette.fr/index.php • http://www.thephaeton.co.uk/universe/index.php • http://www.spellboundmovie.com/ • http://kidshealth.org/index.html • http://www.village247.com • http://www.jobsearch2.jobinthebox.com • http://www.samsys.com/ • http://www.britannica.com/ • http://www.cookps.act.edu.au/ • http://www.benjaminmoore.com/index.asp • http://www.amazon.fr/exec/obidos/tg/static/-/books/search/ref=cs_nav_sn_11/402-5116584-8389727 Charline Poirier, PhD Ethnography/User research

8. Types de sites - organisation • Mosaique et image • Métaphorique • Newsletter • Traditionnel • Recherche Charline Poirier, PhD Ethnography/User research

9. Tout en un et séquentiel Hiérarchique Etroit et profond Large et sans profondeur Expertise et cible Narrative Réseau Recherche Typologie d’architecture d’information Charline Poirier, PhD Ethnography/User research

10. Typologies de l’information Outils Interactions Catalogue Vitrine Service Thématique Utilisateur reçoit Functionnel Utilisateur fait Le site vitrine met l’emphase sur la présentation de l’organisation Le site catalogue met l’emphase sur les produits Le site service met l’emphase sur les besoins d’information des utilisateurs Le site outils/interactions met l’enphase sur les actions des utilisateurs sur le site. www. dancearea.ch www.mossonline.com www2.ac-lyon.fr/etab/ lycees/lyc-69/cchaplin/ svt/svtsite.html www. continental.com Charline Poirier, PhD Ethnography/User research

11. Comment choisir la bonne structure?

12. Types de modèles pour illustrer l’activité Modèles vont décrire 3 perspectives de l’activité: • Objets: • Physiques • Environmentaux • Actions: • Workflow • Opérations: • Processus et séquences d’actions Charline Poirier, PhD Ethnography/User research

13. Le modèle d’un objet • Motivation: • Organiser sa vie • Usage: • Elastique qui sépare • le passé et le présent • Calendier sert d’alertes • (L’agenda qui devient • trop lourd signal • des choses à faire) • Structure: • Séances • Calendier • Rappel • To do list Holtzblatt, K. (1995) Representing Work for the Purpose of Design.

14. Le modèle d’un objet • Information (contenu et forme) • Décortiquer l’objet en parties • Structure des parties • La manipulation des objets • Usage informel • Caractéristiques physiques • Distinction entre certaines parties Charline Poirier, PhD Ethnography/User research

15. Réponses aux questions suivantes • Comment les gens organisent-ils l’information? • Quels sont les alertes et signaux qu’ils se donnent? • Quelle est la relation entre les objets qui sont utilisés? Charline Poirier, PhD Ethnography/User research

16. Modèle physique • Motivation: • Minimiser les • Interruptions • Accès facile aux • outils de travail • Division du travail: • Communication et • coordination – espace • publique/espace privé • Espace travail • Travail immédiat Holtzblatt, K. (1995) Representing Work for the Purpose of Design.

17. Le modèle physique • Comment l’espace influence, facilite ou crée des difficultés à la réalisation de l’activité • Espace de l’activité • Structure de l’édifice • Espace primaire et secondaire • Espace publique et privé • Outils • Accès Charline Poirier, PhD Ethnography/User research

18. Modèle de flow Eléments importants qui constituent le flow sont: • Personnes impliquées ou leurs rôles • Actions • Interactions • Outils Charline Poirier, PhD Ethnography/User research

19. Modèle de flow Qui communique quoi à qui? • Quels sont les rôles des utilisateurs? • Comment les tâches sont-elles distribuées? • Qui donne de l’aide? • Avec qui les utilisateurs accomplissent-ils leurs tâches? • A qui communiquent-ils les résultats de leurs activités? • Quels sont les échanges qui sont formels et ceux qui sont informels?

20. Modèle de flow Flèches: Mouvement d’information ou d’objets Cercles: acteurs Textes: actions Carrés: objets Flèches rouges: Cassures Ligne continue: formel Ligne brisée: Informel Holtzblatt, K. (1995) Representing Work for the Purpose of Design.

21. Modèle de flow Coordination: Comment les utilisateurs se complémentent-ils? Comment les rôles et les responsabilités sont définis en pratique et comment les gens communiquent pour accomplir leur tâches et maintenir leurs sphères d’influence. • Quels sont les rôles des utilisateurs? • D’où viennent et où vont les objets? • Quelles sont les activités formelles et informelles? • Quel genre d’aide est-ce que les utilisateurs recherchent? Charline Poirier, PhD Ethnography/User research

22. Modèle de flow • Autour des rôles • Cercles: rôles • Carrés: actions • Flèches: relations Holtzblatt, K. (1995) Representing Work for the Purpose of Design.

23. Modèle de flow • Autour des rôles • Cercles: rôles • Carrés: actions • Flèches: relations Holtzblatt, K. (1995) Representing Work for the Purpose of Design.

24. Modèle séquentiel Représenter la séquence des actions et opérations qui sont nécessaires pour compléter une activité • Intention • Cause • Ordre des opérations • Indicateurs des relations entre les opérations et les individus Charline Poirier, PhD Ethnography/User research

25. Modèle séquentiel • Groupement • hiérarchique • des opérations • en actions Holtzblatt, K. (1995) Representing Work for the Purpose of Design.

26. Modèle séquentiel • Notification des • causes principales • des actions • Notification des • motivations pour • les opérations • Illustration de • l’enchainement des • opérations et des • choix possibles. Holtzblatt, K. (1995) Representing Work for the Purpose of Design.

27. Modèles servent à • Illustrer les actions: • Modèle workflow • Illustrer les opérations: • Modèle séquentiel • Les outils: • Modèle des objets • Modèle de l’espace physique Charline Poirier, PhD Ethnography/User research

28. Production de scénarios Le scénario est utilisé pour: • Décrire comment de vrais utilisateurs utiliseront le système. • Identifier des manques dans nos connaissances des utilisateurs • Etablir des priorités • Etablir des relations entre fonctionnalités • Communiquer avec ceux qui vont construire l’application Charline Poirier, PhD Ethnography/User research

29. Échéances pour les travaux 15 mars: Mapping des activités des utilisateurs 5 avril: Prototype - Mettre le prototype sur la page travaux. Pour la période 5 (11 et 12 avril), apportez une photocopie de toutes les pages de votre site ainsi que des photocopies de vos personas. Charline Poirier, PhD Ethnography/User research

30. Annexe Définition des types de sites web Etude sur les modes de consultation de site web Check-list pour l’élaboration des sites Charline Poirier, PhD Ethnography/User research

31. Site mosaique • Contient plusieurs éléments visuels non libéllés – but est ludique (cherchez la clef d’organisation du site!) • Le site donne l’impression d’être complex et sophistiqué • Bien pour des sites axés sur l’expérience et l’exploration Charline Poirier, PhD Ethnography/User research

32. Site images • Le centre du site contient des graphiques animés ou des images intéressantes • Sites construits pour l’exploration Charline Poirier, PhD Ethnography/User research

33. Site métaphorique • Sites Métaphoriques ou associatifs • Basé sur des métaphores • Points forts: • Encourage le browsing Charline Poirier, PhD Ethnography/User research

34. Site Newsletter • Page d’accueil avec le plus d’information et de liens possibles (portails). • Site sur 3 colonnes Navigation primaire Liens contextuels Navigation locale Contenu « éditorial » Charline Poirier, PhD Ethnography/User research

35. Site traditionnel Sites les plus fréquents qui en sont venus à contenir les standars: • Logo et bar de navigation sur la gauche • Partie de contenu sur la droite • Souvent « les dernières news » • Excellent site pour b2b Charline Poirier, PhD Ethnography/User research

36. Site recherche • Sites de recherche • Minimum de navigation hiérarchique • Basé sur la recherche • Ce genre de site est bon pour: • Visiteurs qui savent exactement ce qu’ils cherchent Charline Poirier, PhD Ethnography/User research

37. Dans quel mode de consultation les gens visitent-ils le site? • Visiteur • Shopper • Dans le besoin • Moniteur • Travailleur Charline Poirier, PhD Ethnography/User research

38. Visiteur : Principe -découverte Charline Poirier, PhD Ethnography/User research

39. Caractéristiques du mode visiteur • Navigation facile • Navigation organisée autour d’une métaphore spatiale • Orientation facilitée par des images et non des mots • La façon dont l’information est présentée porte elle-même une signification • Objets peuvent être manipulés • Accès multiples à l’information - Information peut être consultée rapidement – image ou animation –ou peu-être lue plus en détails • L’information est révélée progressivement • Information est hiérarchisée du général au particulier • Information est inhérent au contexte de l’activité: l’emphase est sur l’activité et non sur l’information. • Les processus sont concrets et contextualisés • Information est souvent particulière, factoïds Charline Poirier, PhD Ethnography/User research

40. Tout se voit d’un coup d’oeil

41. Information se groupe par activités www.HEB.com

42. Les produits sont présentés de façon familière www.mossonline.com

43. L’information est hiérarchisée www.mossonline.com

44. Multiples accès à l’information www.howstuffworks.com

45. Information est visuelle www.ebay.com

46. La présentation de l’information est elle-même la signification www.kartoo.com

47. Processus est concret www.NYSE.com

48. L’information est particulière www.NYSE.com

49. Recommandations • Présenter l’information simplement – éviter les termes techniques • Rendre l’accès à l’information rapide et facile • Respecter les standards web • Créer plusieurs façons d’accéder à l’information – éviter d’être trop concis • Utiliser des couleurs vives pour la navigation • Utiliser des polices visiblesLa page d’accueil doit révéler la richesse du site • Utiliser des icônes pour accéder à l’information Charline Poirier, PhD Ethnography/User research

50. Shopper: Principe - sélection Charline Poirier, PhD Ethnography/User research