MGL 835 Interaction humain-machine 2014 automne Prof. Michael McGuffin

1. MGL 835Interaction humain-machine2014 automneProf. Michael McGuffin

2. Quelles sont les tendenceschez les interfaces utilisateurs ?

3. Dans un taxi à Montréal en 2013: iPhone, appareil GPS, et tablette Android.

4. Stylets pour le iPad • Adonit Jot Script • Adobe Project Mighty stylus + Napoleon ruler • Pinceaux “Sensu”et “Nomad” Voir aussi le “nota” http://hex3.co/products/nota , et le iPen http://www.cregle.com/ http://www.theverge.com/2013/5/6/4305712/adobe-announces-first-hardware-the-project-mighty-smart-stylus

5. Stylets pour le iPad (2)

6. Samsung Galaxy Note Galaxy Note 3 Galaxy Note 10.1 2014 Edition(écran 10.1 pouces, 2560×1600 pixels)

7. MicrosoftSurface Pro 2

8. Microsoft Surface Pro 3(écran 12 pouces, 2160×1440)

9. Tablette “Cintiq Companion” de WacomÉcran 13 pouces; Windows 8 ou Android

10. Wacom Cintiq 24HD touchmultitactile (10 doigts) + stylet (pression, angles, distance de survol)≈3700$ en 2013

11. Leap Motion http://i.i.cbsi.com/cnwk.1d/i/tim2/2013/07/18/LeapMotionController_35823002_09_620x433.jpg Iris Classon http://i2.cdn.turner.com/cnn/dam/assets/130722023535-leap-motion-controller-setup-story-top.jpg

12. zSpaceAffichage stéréoscopique, suivi de la tête, et localisation d’un stylet avec 6 DoF; ≈4500$ en 2013

13. Oculus Rift http://www.oculusvr.com/

14. PadFone de ASUS

15. PadFone 2

16. Neptune PineEntreprise à Montréal

17. Ubuntu Edge12 M$ “crowdsourcés” en 1 mois http://www.indiegogo.com/projects/ubuntu-edge

18. Ubuntu Edge12 M$ “crowdsourcés” en 1 mois http://www.indiegogo.com/projects/ubuntu-edge

19. Ubuntu Edge Leann Ogasawara Ubuntu Kernel Engineering Manager chez Canonical http://www.youtube.com/watch?v=EtNhlVn3ETQ

20. Écrans courbés Samsung Galaxy Round LG Flex http://arstechnica.com/gadgets/2013/10/bending-it-the-right-way-how-lg-and-samsung-curved-their-phones-differently/

21. PaperTab : écrans flexibles http://www.youtube.com/watch?v=81iiGWdsJgg

22. Google Glass

23. Meta SpaceGlassesLunettes à réalité augmentée; ≈700$ en 2014

24. Lunettes MetaPro: réalitéaugmentée http://www.youtube.com/watch?v=LuMv29nKo2k https://www.spaceglasses.com/

25. SpaceTop (Jinha Lee)

26. Exemples de résolutions (2014)

27. Tendences • Entrée enrichie (multitactile, stylet, main, corps…), de plus en plus de capteurs (GPS, accéléromètres, caméras de profondeur, …) • Multitactile + stylet: Microsoft Surface Pro, Wacom Cintiq touch et Cintiq Companion, Samsung Galaxy Note, Samsung Series 7, Panasonic Toughpad, Fujitsu Lifebook, ASUS Taichi 21 • Caméras de profondeur: Kinect, Leap Motion • Sortie 3D enrichie (stéréoscopie, suivi de la tête, réalité virtuelle / augmentée): zSpace, Oculus Rift • Mobilité et données synchronisées via le “cloud” • Écrans courbés, flexibles • Résolution d’écrans qui augmente sans cesse

28. Tendences (2) • Reconnaissance (et compréhension) de parole (Siri de Apple, Google Android) • Reconnaissance de l’écriture manuscrite (Microsoft Windows, Samsung Galaxy Note, …) • Impression 3D, robotique, automobiles autonomes, … • http://www.google.ca/?q=gartner+hype+cycle

29. Desktop, 2014 Microsoft Windows: 91% Mac OS X: 5% Linux: ~1.5% http://www.netmarketshare.com/operating-system-market-share.aspx?qprid=10&qpct=6&qpcustomb=&qpcustomd=0&qptimeframe=Y

30. Mobile + Tablettes, 2014 iOS: 52% Android: 33% http://www.netmarketshare.com/operating-system-market-share.aspx?qprid=10&qptimeframe=Y&qpct=6&qpcustomb=&qpcustomd=1

31. Smartphoneshttp://sourcedigit.com/1913-smartphone-os-global-market-share-data-2014/Smartphoneshttp://sourcedigit.com/1913-smartphone-os-global-market-share-data-2014/

32. http://www.businessinsider.com/iphone-v-android-market-share-2014-5http://www.businessinsider.com/iphone-v-android-market-share-2014-5

33. Microsoft Surface http://www.benzinga.com/news/13/09/3937902/microsoft-surface-may-achieve-1-market-share-in-2014-msft (September 24, 2013) http://www.dailyfinance.com/on/microsoft-surface-sales-double-irrelevant-tablet-market/ (January 31, 2014)

34. L’IHM • Interaction humain-machine • Synonymes (ou presque):interaction homme-machine,interfaces usagers-machine,{interaction, interfaces} {humain,homme}-{machine,ordinateur}, … • En anglais: «Human-Computer Interaction» (HCI), «Computer-Human Interaction» (CHI), «Man-Machine Interaction» (MMI), …

35. L’IHM L’étude de la conception, la réalisation, et l’évaluation des systèmes interactifs (et surtout informatisés) destinés à l’usage humain, et l’étude des phénomènes associés. NB: le mot interface signifie la surface de contact, ou la frontière, entre deux corps ou deux régions d’espace.L’interaction a lieu à l’interface,ou à travers l’interface.

36. L’IHM • Le côté pratique : • Comment concevoir une interface utilisateur ? Étant donné une tâche et une classe d’utilisateurs, concevoir la meilleure interface, en respectant les contraintes, qui optimise un aspect de l’utilisabilité (l’efficience, la facilité d’apprentissage, etc.) • Comment programmer les interfaces utilisateurs. Algorithmes, outils de programmation, boîtes à outils, libraries, … • Le côté recherche : • Développer des nouvelles et meilleures façons d’interagir. Développer des interfaces et des techniques d’interaction novatrices. • Comment expliquer et mieux comprendre l’interaction ? Développer des modèles et des théories descriptifs et prédictifs. Développer des nouvelles méthodologies de conception.

37. D’autres domaines reliés à l’IHM • Facteurs humains, ergonomie • Ne se limitent pas juste aux interactions avec les ordinateurs ou les machines. Mettent parfois plus d’accent sur le côte humain, et/ou sur le travail (et des tâches répétitives, en particulier), que dans l’IHM. • S’intéressent à comprendre les capacités humaines, et à appliquer ce savoir à la conception d’objets, d’outils, de systèmes, de machines, de tâches, de services, et d’environnements destinés à l’usage humain • Des sous-branches: ergonomie physique, ergonomie cognitive (« engineering psychology ») • Quelques concepts clés: stress, perception, attention, contrôle moteur, mémoire, charge mental, faire des décisions, les erreurs, … • Ont été beaucoup développés, par exemple, pendant la deuxième guerre mondiale pour améliorer les contrôles d’avions et d’autres machines, et aussi pour améliorer la performance des ouvriers dans les usines qui effectuent des tâches répétitives

38. D’autres domaines reliés à l’IHM (2) • L’informatique • La psychologie • Le génie • L’infographie • Le graphisme (« Graphic Design ») • L’intelligence artificielle • La linguistique • La sociologie • etc. • L’IHM est un domaine multidisciplinaire!

39. Pourquoi apprendre àconcevoir les interfaces? Ne sont-t-ils pas déjà amplementconviviales et intuitives?

40. Je n’ai pas de choix!

41. Qu’est-ce que ça veut dire d’annulerune opération déjà annulée?

42. Plusieurs autres exemples se retrouvent au“Interface Hall of Shame” http://hallofshame.gp.co.at/

43. Vu en 2012 Vu en 2013

44. Vu en 2014

47. D’autres exemples • Fonctionnalitées cachées • iPod touch / iPhone: comment faire undo dans l’application de bloc notes ? • Il faut secouer le dispositif ! • D’autres exemples ?

48. Il est facile de mal-concevoir une interface • Même lorsqu’une interface est bien conçue, les interfaces graphiques modernes laissent encore beaucoup à désirer • La souris et le clavier sont des instruments d’expression très limités • L’organisation hiérarchique des fichiers n’est pas nécessairement idéale • Etc… (autres problèmes / défis ?)

49. Le développement del’ordinateur personnel Source: Michel Beaudouin-Lafon, Designing Interaction, not Interfaces, Proceedings of AVI 2004, http://doi.acm.org/10.1145/989863.989865

50. Pourquoi est-il difficile de bien concevoir des interfaces? L’IHM est une « science douce » L’humain est difficile à modéliser L’inertie des utilisateurs/du marché: les gens sont déjà « satisfaits » et habitués avec leurs interfaces actuelles Problèmes de compatibilité entre différents plateformes Brevets Il y a une grande variété d’utilisateurs, de tâches, d’applications, et de périphériques