interfaces et scénarisation (com2571) 10 décembre 2013 grégory petit
TRANSCRIPT
Interfaces spécialisées
Interfaces et Scénarisation (COM2571)10 décembre 2013
Grégory Petithttp://lrcm.com.umontreal.ca/greg/COM2571/
On rend les TP2!!!
La semaine dernière
Évaluation de vos maquettes
Et donc on fait quoi aujourd’hui?
Interfaces haptiques
Réalité augmentée
Accessibilité
Retour sur l’examen
Interfaces haptiques
Haptique = Sens du toucherLe sens du toucher est le seul qui est
bidirectionnel.On ne peux pas toucher sans ressentir un retour
tactile et inversement
Interaction haptique = interaction tactile entre le système et l’usager, basé sur un retour tactile du système.
≠ Interaction tactile (interaction tactile entre le système et l’usage, sans retour tactile du système)
Types de retour haptiqueLe plus basique Vibration
Contrôleurs de jeux
Retour d’effort sur 2 dimensionsAide à l’écriture, la géométrie
Retour d’effort sur 3 dimensionsExploration d’objets virtuels en 3D
Géomatic Touch
Saitek X52 Flight Control System
Sony DualShock
Novint XOI
Appareils haptiques
CyberGrasp
ApplicationSimulation
Domaine médical Télé-opérationPilotage (sports, armée)
RéadaptationAprès paralysie
Réalisme augmentéeJeux
Démo - CyberGrasp
http://www.youtube.com/watch?v=k2nuXX2thBA
Réalité augmentée
Réalité augmentéeRéalité augmentée = superposition d’une
couche virtuelle au monde réel.
L’accès à la réalité se fait via une interface « transparente » écran avec une caméra à l’arrière. La caméra doit être fixe par rapport à
l’interface.
La couche virtuelle s’adapte en direct au monde réel en suivant le mouvement de la caméra.
ApplicationsArtshttp
://www.psfk.com/2013/04/augmented-reality-street-art.html
Formation http://mashable.com/2013/10/05/volkswagen-augmented-reality/
Commercehttp://www.gizmag.com/ikea-augmented-reality-catalog-app/28703/
DivertissementcolAR: http://www.youtube.com/watch?v=EGMjsYHD7Ak
ApplicationsÉducation
http://www.youtube.com/watch?v=j4qgT2QJUFA
JeuxEyeToy, Wii, KinectLego (http://www.youtube.com/watch?v=
PGu0N3eL2D0)Billard (
http://www.youtube.com/watch?v=8Y8Cr5Ja-RM)
Interfaces tangiblesInteraction avec un système via des éléments
de notre environnement physique
Exemples:http://www.youtube.com/watch?v=
nWhbKHNildM http://www.youtube.com/watch?v=yWLvQ9u-
u_0
Accessibilité
Différents types déficiences Déficience visuelle
Déficience motrice
Déficience auditive
Déficience cognitive
Déficience visuelleCauses principales:
Diabète GlaucomeDégénérescence Maculaire Liée à l’Âge (DMLA)
Deux de ces trois causes interviennent avec l’âge Majorité de personnes non-voyantes tardives
Déficience visuelleOutil de réadaptation Lecteurs d’écran
Linéarisation de la page Web
Sortie de l’information via :Synthèse vocalePlage Braille
JAWS : le plus utilisé dans le monde
Démo!
Limitations des lecteurs d’écran
Frustration lors de leur utilisation due à : Mauvaise mise en page troublant la lecture Conflit entre l’application et le lecteur d’écran Formulaires mal conçus et mal libellés Absence de texte alternatif pour les images Liens et boutons ambigus PDFs inaccessibles Plantage du lecteur d’écran
Absence de représentation de la structure de la page due à la linéarisation de l’information
Un seul chemin de navigation possible
Graphismes tactiles numériques
Cat
Tablette avec picots
Virtual Tactile Display
Le Tactograph
Illustrations de manuels scolaires
Illustrations de manuels scolaires
Illustrations de manuels scolaires
TactoWebAccès au Web pour les personnes non-voyantes
Supprimer la frustration provoquée par les lecteurs d’écranfrustration liée à la linéarisation de la informationlinéarisation de l’information due à une seule
modalité de sortie
Donc utiliser une navigation spatiale plutôt qu’une navigation séquentielle Comme pour les graphismes tactiles alors?
TactoWebExploration multimodale du Web via le Tactograph
Création d’un fureteur tactile et sonorePrendre en compte les différents éléments Web:
en-têtes liens paragraphes menus listes numérotées et à puce Formulaires
Associer les bons retours tactiles et sonores aux éléments Web
TactoWeb
Déficience motrice – causes Maladies ou autre cause organique
Encéphalopathie et paralysie cérébrale (DMC) Pathologie du système locomoteur Sclérose en plaque et autres maladies évolutives
Accident Traumatisme cranio-cérébral Lésion musculo-squelettique Blessure médullaire (colonne vertébrale) Amputation
Source: Jean-Marie d’Amour (IDV6019 – Accessibilité du Web et du Multimédia)
Technologie de réadaptationClaviers adaptés
Technologie de réadaptationContrôle de la souris adapté
Contrôle oculaire – Dasher
Déficience auditiveSurdité à la naissance
Langue des signes comme langue maternelleOraliste (langue des signes comme
complément)
Incapacité auditive acquiseIncapacité légère ou modérée (personne
malentendante)Incapacité moyenne ou sévère (personne
sourde)
Source: Jean-Marie d’Amour (IDV6019 – Accessibilité du Web et du Multimédia)
Principaux obstacles sur le WebDifficulté de compréhension du langage parlé
à l’écritContraction des motsAccent parlés mis à l’écritLangage SMS
Clips audio ou vidéo sans équivalent textuelSous-titreRésumé textuel
Solutions à ces problèmesLangage plus simple
Information clé donnée au début
Illustration visuelle
Transcription en langue des signes
Contraste de la parole avec le fond sonore
Transcription textuelle
Sous-titrageSource: Jean-Marie d’Amour (IDV6019 – Accessibilité du Web et du Multimédia)
Déficience cognitiveLimitations liées à :
à la compréhension à la concentration à la mémorisation au raisonnement
Exemples de trouble : Dyslexie (lecture) Dyscalculie (calcul et chiffres) Dysgraphie (écriture) Troubles d’interprétation des stimuli visuels et auditifs Troubles d’interprétation des indices non verbauxSource: Jean-Marie d’Amour (IDV6019 – Accessibilité du Web et du Multimédia)
Principaux obstacles sur le Web
Difficulté de compréhension du langage écritPhrases trop longuesParagraphes trop longs
Colonnes de texte trop largeTailles de polices trop petitesTexte en italiqueInterligne simpleTexte sans illustrationsImages en mouvement distrayantesNavigation offrant trop de choix sur la même
pageSource: Jean-Marie d’Amour (IDV6019 – Accessibilité du Web et du Multimédia)
Solutions à ces problèmesUtiliser un langage simpleDécouper le contenu
Phrases courtes Courts paragraphe Listes plutôt que paragraphes plein texte Colonnes moins larges Taille du texte suffisante Éviter l’italique plus difficile à lire et les polices sérif Interligne agrandi (1,5) Illustrer le texte avec des images ou des vidéo Éviter le mouvement Navigation scénarisée réduisant la charge cognitiveSource: Jean-Marie d’Amour (IDV6019 – Accessibilité du Web et du Multimédia)
Examen
Examen17 décembre de 13h à 16h
Salle D440
Documents du cours autorisés
Ordinateurs non-autorisés
Des questions sur l’examen?
Des questions???
Merci de votre attention!
Bon examen!
[email protected]://lrcm.com.umontreal.ca/greg/COM2571/