L’interaction Les périphériques d’entrée, styles d’interaction, techniques d’interaction, et les modes.

Slides:



Advertisements
Présentations similaires
Primary French Presentation 2 Saying How You Are.
Advertisements

Le Clavier.
contrat Creative Commons Paternité-Pas d'Utilisation Commerciale- Partage des Conditions Initiales à l'Identique.
Interaction Directe contrat Creative Commons Paternité-Pas d'Utilisation Commerciale- Partage des Conditions Initiales à l'Identique.
contrat Creative Commons Paternité-Pas d'Utilisation Commerciale- Partage des Conditions Initiales à l'Identique.
Retour au menu principal. Généralités Lenvironnement Laffichage de la fenêtre Déplacement / sélection dans une feuille Classeurs La gestion des classeurs.
un crayon un ordinateur un stylo un taille-crayon.
6 novembre 2013 Les modes dinteraction M. Bétrancourt & K. Benetos - Cours Ergonomie des IPM TECFA Technologies pour la Formation et lApprentissage.
Que puis-je faire avec WordQ ?
Les nouveaux modes dinteraction Cours Interaction Personne-Machine 7 juin 2004 Présentation réalisée par Mireille Bétrancourt (
Les nouveaux modes dinteraction 07 décembre 2011 Mireille Bétrancourt - TECFA, FPSE - Cours Ergonomie des IPM TECFA Technologies pour la Formation et lApprentissage.
Les nouveaux modes dinteraction 23 novembre 2010 Mireille Bétrancourt - TECFA, FPSE - Cours Ergonomie des IPM TECFA Technologies pour la Formation et lApprentissage.
Les modes, et quelques exemples de techniques dinteraction (utilisant lentrée gestuelle et autre)
L’interaction Les périphériques d’entrée, styles d’interaction, techniques d’interaction, et les modes.
L’interaction Les périphériques d’entrée, styles d’interaction, techniques d’interaction, et les modes.
I. Intro, contexte, historique des mmorts II. SVN, historique des langages utilisés III. Serveur PHP, client 2D: JavaScript IV. Client 3D: Java, JoGL.
En group de deux vous allez sassoir dos a dos. Un partenaire regards lecran lautre le mur. Sur lecran il y a un photo quils doivent expliquer au partenaire,
Tuesday, September 30,  Il y a trois types de données qui sont entrées dans les feuilles de calcules. There are three types of data entered in.
L’interaction Les périphériques d’entrée, styles d’interaction, techniques d’interaction, et les modes.
 Sil vous plait suivis le “tutorial” dans les pages suivantes. Vous avez toutes la classe pour le finir.  Ouvrir un nouveau feuille de calculs dans.
CM 2 – Traitement de Texte
Gestion des fichiers et dossiers
Y and en Two little words with a lot of meaning. y.
Prise en main de l’application Lync du Windows Store
1 Techniques de Menus : Description, Développement, Evaluation Gilles Bailly 1,2 Directeurs de thèse : Laurence Nigay 1 et Eric Lecolinet 2 LIG Grenoble.
Mon uniforme scolaire WALT: Revise words for clothes and be able to give opinions about my school uniform. WILF: Using more complex descriptions and opinions.
Passé composé with être (a “D”, “R”, and “P” are missing. They stand for devenir, revenir and passer.
Chapitre 5 lesson 9 Essential Questions: How does aller and other verbs of motion look like in the past tense?
Les verbes qui se terminent en -ER (-ER verbs). French has both regular and irregular verbs. (English does too, for that matter.)
Livre page 48. There are 4 different ways to form questions. Félicitations!! You already know 2 of the ways ☻ We have not “officially” studied this concept.
2 Des autres emploies du subjonctif Les normes: –Communications 1.2: Understanding the written and spoken language.
3 Les Verbes -ER Talking about people’s activities Les normes: –Communication 1.2: Understanding the written and spoken language –Comparisons 4.1: Understanding.
Le passé composé The perfect tense Eg: J’ai mangé une pizza I have eaten/ate a pizza.
WALT: To talk about the internet in French.

Le Comparatif et le Superlatif
Qui est présent? Écoutons Les préférences Vocabulaire: les activités Panorama Culturel.
Philippe Cuisinaud, ESSI3, VIMM Christophe Galant, Master ISI, VIMM Henrik Larsson, Master ISI, STREAM Julien Soula, Master ISI, VIMM Première réunion.
Cliquez sur une rubrique
2 Le Pronom « EN » Referring to people, places and things already mentioned La norme: –Communication 1.2 –Comparisons 4.1 * Les questions essentielles:
Français 1441 Chapître 3 Révision d’Examen.  Someone tells you where things on campus are located. You listen and fill in the blank with the missing.
J’aime: I like Je n’aime pas: I don’t like
Le passe composé.
Les Questions d’Information (Information questions)
Questions to consider: How are French nouns different from nouns in English? What is the difference between saying, “I have a pen.” and saying, “I have.
Year 10. Bon appetit unit. Introducing ‘en’. ‘en’ – ‘some of it’ or ‘some of them’ ‘En’ is a small but important word in French that is commonly used.
La mémoire(1): Comment bien travailler
Français 2, 8 decembre 2014 Ouvrez vos livres à la page 55. Faites #10. What game can be dangerous to your mental health? Rire – to laugh. Rira bien qui.
2 L’impératif  Telling people to do things  Les normes:  Communication 1.2 Understanding the written and spoken language  Comparisons 4.1 Understanding.
Warm Up le 5 mars Écrivez tout ce que tu sais pour la grammaire française Par exemple: DR MRS VANDERTRAMP utilise être L’Academie Française.
Instructions for using this template. Remember this is Jeopardy, so where I have written “Answer” this is the prompt the students will see, and where.
8 Les pronoms interrogatifs et relatifs Les normes: Communication 1.2 Comparisons 4.1 Les questions essentielles: - What are the 2 ways to ask the question.
What do these pictures have in common?
8 Les pronoms interrogatifs et relatifs Les normes: Communication 1.2 Comparisons 4.1 Les questions essentielles: - What are the 2 ways to ask the question.
Formation- (Ex. parler)  Go to the « nous » form of the verb.  Nous parlons.  Take off the –ons and the « nous »  Nous parlons  Add –ant.  parlant.
Nous parlons des matières Buts: To be able to give extended opinions on school subjects To express agreement or disagreement.
LEÇON 14.  Écrivez vos devoirs: #14, 15, et 16 (please remember to read instructions, follow them closely, and ask clarifying questions BEFORE the work.
Draw an anti-hero portrait Decide on who you are going to present Make an Internet search to find out more about her story / life, qualities, strong points.
L’entrée gestuelle et la reconnaissance de gestes.
Passé Composé avec Être Passé composé with être 1. You already know how to form the Passé Composé tense. Here is a reminder: Past participle Part of.
Histoire des interfaces Homme-Machine
Types d’interaction Homme-Machine
LEÇON 10.  Écrivez vos devoirs: 1.Devoirs packet #7 2.Practice les chiffres # Complete présentations, if necessary.  Sortez vos devoirs: #8-10.
The 4th Power Places and Forms of power How reliable are our sources of information today ? The media.
MELISSA GOLGEM 2016 Les fonctions de l’ordinateur.
LA TRANSMISSION DU MOUVEMENT
LA TRANSMISSION DU MOUVEMENT
 Components have ratings  Ratings can be Voltage, Current or Power (Volts, Amps or Watts  If a Current of Power rating is exceeded the component overheats.
Transcription de la présentation:

L’interaction Les périphériques d’entrée, styles d’interaction, techniques d’interaction, et les modes

Les périphériques d’entrée ou dispositifs d’entrée (« input devices »)

How can humans input information ? Hands –motions, gestures, pointing (e.g. with a mouse) –pressing buttons, turning dials, typing Voice Facial expressions What are some other ways … ?

Quelles informations sont entrées par les humains ? Quelles sont les types d’informations entrées? “interaction tasks classify the fundamental types of information entered” (Foley et al., “Computer Graphics: Principles and Practice”) Foley et al. donnent une liste des 6 types d’informations: –spécifier une position –enter du texte –sélectionner un objet –quantifier (c.-à-d. entrer un numéro) –spécifier une orientation –spécifier un chemin (par exemple, pour animer un objet) Autres ?

Les périphériques d’entrée: les claviers

Clavier de Scholes versus clavier de Dvorak Conçu en 1873 ! Reste encore la norme. N’est toujours pas la norme … :-( Remarquez que toutes les voyelles se trouvent sous une main dans la rangée du milieu

Demi clavier (“Half Keyboard”) de Matias Corp.

Clavier pliable pour Palm Pilot

Clavier projeté

Boutons surchargés (“overloaded”) de fonctions Comment entrer des lettres de l’alphabet avec un clavier numérique? Stratégies: - “Multitap”: appuyer la touche “2” une fois pour “a”, deux fois pour “b”, trois fois pour “c” - Permet d’entrer du texte sans regarder (“eyes-free operation”) - Comment entrer des lettres répétées? Avec une pause (“timeout”) - “T9”: cherche des mots probables dans un dictionnaire - Appuyer une touche “Next” pour corriger si la chaîne suggérée n’est pas la bonne - Difficile d’entrer des mots qui ne sont pas dans le dictionnaire - “LetterWise” (MacKenzie et al. 2001): cherche une chaîne de caractères probable dans un tableau de chaînes de N caractères - Nécessite moins de mémoire que le dictionnaire de T9 - Plus rapide que Multitap

Buttons on Tape Recorders Status quo: uniformly shaped buttons Buttons with different shapes: enable eyes-free operation

Les périphériques d’entrée: les périphériques de pointage (“pointing devices”)

La première souris 1968 Douglas Engelbart Stanford Research Institute Deux galets pour x et y

30+ ans plus tard Touchpad Rotation sensing Rockin’ Mouse Retour haptique (retoure de force, “force feedback”)

D’autres sortes de dispositifs de pointage 2D Tablette numérisante ou tablette graphique (“digitizing tablet”, “graphics tablet”) avec stylet (“stylus”) et/ou souris (“puck”) Écran tactile (“touchscreen”) Crayon optique (“light pen”) Pavé tactile (“touchpad”) Manette, manche à balai (“joystick”) –isométrique (rigide, capte la pression, exemple: Trackpoint) –élastique (comme isotonique, mais retourne au centre lorsqu’elle est lâchée) –isotonique (peut-être déplacée librement) Boule de commande (“trackball”) Command oculaire, oculométrie (“eye tracking”)

TrackPoint (manette isométrique) Pavé tactile (« touchpad »)

Boules de commande de Logitech

Tablettes numérisantes Wacom Bamboo 5.8x3.7 pouces; 80$ Wacom Cintiq 21UX 21.3 pouces (17x12.75); 2500$ Wacom Intuos3 12x19 pouces; 750$ (prix de 2008)

Périphériques pour tablettes Les stylets peuvent avoir un capteur de pression au bout un bouton sur le bout du stylet pour permettre un clic un bouton sur le côté (« barrel button ») une molette (« scroll wheel ») qu’on peut tourner

Propriétés des dispositifs de pointage Capture absolue vs rélative – Exemple: la souris capte des mouvements relatifs – Exemple: les tablettes numérisantes capte une position absolue, mais peuvent être utilisées en mode absolu ou en mode relatif pour déplacer un curseur – Laquelle est plus générale? Autrement dit, laquelle permet de simuler l’autre si on veut? Réponse: capture absolue

Propriétés des dispositifs de pointage (2) Pointage direct vs indirect – Pointage direct: les espaces d’entrée et de sortie coïncident – Exemple: une souris, ou une tablette numérisante sans écran intégré, permettent un pointage indirect – Exemple: un écran tactile, ou une tablette numérisante avec écran intégré, permettent un pointage direct – Lequel est plus “intuitif” ? direct – Lequel est plus prévisible ? direct – Lequel est moins fatiguant ? indirect – Lequel évite de cacher le retour visuel ? indirect – Lequel est préféré par les artistes/graphistes ? ça dépend

Propriétés des dispositifs de pointage (3) Capture discrète vs continue – Exemple: une souris capte une position (essentiellement) continue, mais on pourrait l’arrondir vers une de N positions discrètes si on voulais – Exemple: touches de flêches (ou touches de direction), ou un interrupteur à N positions, permettent de capter des données discrètes – Laquelle est plus générale ? continue Contrôle de position vs contrôle de vitesse (ou contrôle de taux) – Contrôle de vitesse (ou de taux): la position du périphérique détermine la vitesse à laquelle un autre variable (ex: position de curseur) change – Exemple: souris capte une position, et permet une contrôle de position ou bien une contrôle de vitesse – Exemple: manette isométrique ne permet qu’une contrôle de vitesse – Laquelle est plus générale ? position – Laquelle nécessite typiquement moins d’espace sur un bureau ? vitesse (exemple extrême de cela: le TrackPoint, qui prend < 1 cm carré)

Exemple de contrôle de vitesse Avec une souris, dans Microsoft Word 2007: La vitesse de défilement est déterminée par le déplacement de la souris

Périphériques de pointage à contrôle de vitesse, pour le 3D Spaceball Spacemouse Spaceball 5000 Magellan SpaceNavigator (60$) 3dconnexion.com (en 2008) D’autres produits de 3dconnexion.com (en 2008)

Taxonomie des périphériques d’entrée (Buxton) M: intermédiaire Méchanique T: Toucher

Quelques propriétés avantageuses de la souris Le poids de la souris stabilise et atténue les tremblements dans la main. La direction de mouvement des boutons est perpendiculaire au plan de mouvement de la souris. Donc, on peut appuyer un bouton sans affecter la position de la souris (contrairement aux boutons sur le côté des stylets). On peut lâcher et ressaisir la souris sans changer sa position. Quels autres périphériques ont ces propriétés ? (Pour une analyse plus détaillée des propriétés avantageuses de la souris, voir, par exemple, Balakrishnan et al. 1997, )

Modèle à trois états de Buxton (1990) État 0: pas de coordonnées (x,y) États 1 et 2: la position (x,y) est captée Exemples: Tablette numérisante: états 0, 1, 2 Souris: états 1, 2 Écran tactile: états 0, 1

TouchMouse (Hinckley et Sinclair 1999) États 0, 1, 2

TouchMouse (Hinckley et Sinclair 1999)

PreSence (Rekimoto et al. 2003)

Pointing Devices used for Text Entry ? Dasher (David MacKay) – –

Typing Devices used for Pointing ? QPointer, by Commodio – –video

Autres périphériques d’entrée?

Les styles d’interaction

Quelques styles d’interaction (“interaction styles”,“interaction paradigms”) Langage de commande (pour entrer) Langue naturelle –entrée: reconnaissance de la parole –sortie: synthèse de la parole Entrée/sortie audio –Sortie audio sans parole –Entrée de parole numérisé (sans reconnaissance) et entrée vocale sans parole Menus Formulaires WIMPs / GUIs Manipulation directe Interaction gestuelle

Command Languages User-initiated Harder for beginner, can be more efficient for expert Demands good retention by casual, infrequent users User must remember syntax Example: UNIX –ls -l *.doc –grep "^From:" inbox | grep –i robert Some command languages (e.g. shell languages in UNIX) are extremely flexible (e.g. pipelining, macros, scripts …)

Command Names Hard to choose “best, most natural” command name –(Bad) Example: grep Designers have difficulty choosing “best” name –Probability( 2 individuals generating same name) = (Furnas et al. 1987) –Delete, remove, expunge, wipe out, take away,... A possible solution: rich aliases in command names Use of abbreviations –Can increase typing efficiency, but is dangerous too ! –Compromise: have full words and abbreviations (e.g. gdb) –Alternative solution: use auto-completion Spelling a problem –But spelling checkers and correctors feasible

Langue naturelle (« Natural Language ») DEC Voice (vidéo) (Cowley et Jones, 1993) – Reconnaissance de paroles – Synthèse de paroles

Langue naturelle: quelques observations … Mains et yeux libérés pour d’autres tâches Fiabilité de la reconnaissance? Dépend de … – Emplacement du micro – Bruits de fond – Taille du vocabulaire à reconnaître Utilisation pour entrer beaucoup de données? – La fatigue et l’ennui peuvent changer la qualité de la voix de l’utilisateur – Une entrée multimodale (voix pour commandes, clavier pour données) serait peut-être mieux

Langue naturelle: quelques observations … (2) Utilisation pour pointer? – La souris est mieux pour spécifier des points précis Messages d’erreur – Ne pas donner toujours le même message d’erreur – Donner plûtot progressivement plus de conseils ou des instructions différentes si une erreur est répétée Recherche de mots clés dans une phrase entrée – Reconnaissance plus fiable car le vocabulaire est restreint – Peut donner une fausse impression que la machine comprend vraiment

Langue naturelle Avatar REA (vidéo) (Cassell et al. 1999) – Reconnaissance de paroles – Synthèse de paroles

Quelques observations On voit une indication visuelle de l’état du système, nous disant s’il nous écoute ou non – REA tourne son dos vers nous lorsqu’elle n’est pas à l’écoute On est capable d’interrompre REA pour parler

Langue naturelle « Put that there » (vidéo) (Bolt 1980) – Reconnaissance de paroles – Pointage – Multimodal

Langue naturelle « Spoken Language Shell » et « Office Manager » (vidéo) (Lunati et Rudnicky 1991) – Reconnaissance de paroles – Pointage – Multimodal

Quelques observations Notion de focus de voix – Chaque application à moins de mots à reconnaître, donc la fiabilité est meilleure Contrôle sur le « endpointing » (segmentation des phrases entrées) – Une contrôle manuelle va augmenter la fiabilité aussi Correction (par voix ou par clavier) des parties de l’entrée qui ont été mal-reconnues – Remarque: nécessite un retour visuel

Sortie audio « A sad story » (vidéo) – Une histoire racontée avec des sons, sans mots

Sortie audio Usine « Arkola » (vidéo) (Gaver et al. 1991) – Simulation d’usine avec effets sonores

Sortie audio Le « Earpod » (vidéo) (Zhao et al. 2007)

Entrée audio sans paroles Igarashi et Hughes 2001

Voice + Gestural Input Gestures as annotations Voice annotations VIDEO — Wang Freestyle (Hsiao & Levine 1989)

Menu Dialogues Computer-initiated display of alternatives –Text –Voice, e.g., “Would you like to speak to Linda Susie Pierre... or 4. The operator” Items can have arguments –Either typed in, or in submenus Menu display and organization –Menu items displayed as words or pictographs (icons)? –Menu pages simple, pull-down, pop-up, scrolled, …

Menu Dialogues Depth (d) versus breadth (b) tradeoff: n = b d –Very deep: b=2d=6 –Intermediate: b=4d=3 –Shallower: b=8d=2 –One-level:b=64d=1 –Generally, breadth is better than depth Menu organization –Logical, alphabetic, frequency of use, recency of use –Adaptive versus adaptable menus

WIMPs (Windows, Icons, Mouse Program or Windows, Icons, Menus, Pointer) or “GUIs” (Graphical User Interfaces) Components: –Windows (one of them active) –Menus –Icons –Controls and control panels –Query and message boxes –Mouse/keyboard interface –Direct manipulation

Windows Rectangular areas –Multiple, concurrent, interleaved tasks –Individual contexts Tiled (left, below) & overlapping (right, below) windows

Direct Manipulation Shneiderman’s definition –Continuous representation of the object of interest –Manipulation through physical actions –Rapid, incremental, reversible operations Examples –Dragging a file to a trash can instead of typing “del foo.txt” –WYSIWYG text editors (like Xerox Star, Microsoft Word) –Spreadsheets –Musical score editors –Programming languages ? Why Direct Manipulation ? –One goal of interaction design: Minimize the effort required to translate the user’s real world goals into system goals.

Direct Manipulation Text fields for entering positions vs 3D widgets that can be dragged.

Gestural Input Gestures can be executed rapidly, and can be used as symbols to activate commands or select objects Sketches –can be used to quickly enter text or diagrams, without requiring the user to switch from the pointing device to something else –Have an informal, loose, implicit structure –Can carry much more (implicit) information than typed text

Gestural Input Gestures as data, e.g., objects and movements VIDEO — GENESYS Animation (Baecker, MIT, 1971) Gestures as characters to recognize, e.g., Palm Pilot

Entrée gestuelle Kurtenbach et Buxton (vidéo) –Exemple de geste: encercler, déplacer, et une lettre "C" pour copier des formes

Entrée gestuelle « Teddy » (Igarashi et al. 1999)