Modes, Styles et Métaphores dInteraction [email protected] contrat Creative Commons Paternité-Pas d'Utilisation Commerciale- Partage des Conditions Initiales

Modes,Styleset Métaphoresd’Interaction

[email protected] Creative Commons Paternité-Pas d'Utilisation Commerciale-

Partage des Conditions Initiales à l'Identique 2.0 France License

Les métaphores

3

La Métaphore

un mot se trouve recevoir dans une phrase un sens différent de celui qu’il possède dans l’usage courant

Transférer sur un nouveau concept une perception existante chez l’utilisateur validité utilisation limites du transfert

4

La Métaphore

tortue bureau de travail fenêtres, boutons, palettes tableau de bord navigation feuille de calcul

Les modes d’interaction

6

Mode d’interaction

un mode est un état de l'interface dans lequel les actions de l'utilisateur sont interprétées par le système de manière homogène et différente des autres modes.

7


Interaction par mode temporel les mêmes actions ont des effets

différents en général activés par l'utilisateur souvent désactivés par le système

8


Mode spatial en fonction de la position du périphérique

de pointage implicites car mise en évidence graphique

Micro-modes modes temporels liés à une action

physique continue de l'utilisateur

9


Exemple : boite de dialogue modale mode spatial + temporel mode spatial

plus difficile à mettre en œuvre

choix du mode mais feedback !

10

feedback

Pointage

Sélection

Déplacement

11

feedback

Forme du pointeur indication des modes

Sonore Animés

limiter l’effort cognitif ne pas perdre mais ne pas désorienté

Les styles d’interaction

13

Styles d’interaction

Conversationnel langage de commandes dialogue imposé par le système

Menus, formulaires guidage du système dialogue contrôlé par le système

Question / réponse Langage naturel et langage écrit

14


Navigation nœuds, ancre, liens difficulté de repérage

Manipulation directe actions physiques sur des représentations

d’objets inspire toutes les interfaces actuelles

15


WIMP windows, icons, menus and pointers widgets :

bouttons, barre d’outils (actions), palettes (modes), boites de dialogues + compositions

Point-and-click hypertext généralisation / WIMP (<> souris)

Interaction tactile

16

Styles d’interaction WYSIWIG : édition de document

What You See Is What You Get dialogue contrôlé par l’utilisateur

… x.ln(x)/sqr(sqr(x)+1) ...

17


Interaction gestuelle / reconnaissance de traces

interfaces à stylo

18


Interaction sonore quand l’utilisateur ne contrôle pas

Interaction temporelle menus rythmiques

Interaction See through utilisation des transparences fenêtres, menus, barres d’icones

19


Interaction iconique interface générique approche métaphorique drag’n drop

20


Interaction bimodale, vocale Interaction multimodale Interaction bimanuelle

21

Autres Styles d’interaction

Interaction sonore quand l’utilisateur ne contrôle pas

Interaction temporelle menus rythmiques

Interaction See through utilisation des transparences fenêtres, menus, barres d’icones

22


Réalité virtuelle immersion sensori-motrice de l’utilisateur

dans le système Interface 3D

habitudes tacites du monde réel utilisation forte en 2D (icones, etc) rendu 2D incohérent

Interaction 3D

23


Réalité augmentée intégration de capacité de traitement de

l’information dans des objets physiques

24


Interaction Collaborative collecticiels

Informatique Ubiquitaire Interface Tangible

Interaction Multimodale

25

Visualisation Scientifique

Interpoler, approximer, arranger les données et accélérer la visualisation

La visualisation et manipulation de structures moléculaires

Le mouvement de particules matérielles ou immatérielles en interaction entre-elles

La simulation de phénomènes naturels (montagnes, surface lunaire, nuages, érosion, coquillages, plantes, ...) à l'aide de la géométrie fractale.

Le mouvement chaotique de pendules métalliques soumis a l'attraction de plusieurs aimants

Visualisation de champs de vecteurs pour visualiser le déplacement des masses d'air en météorologie

26

Visualisation d’information

Visualisation d ’informationsTransformer des données qui n'ont pas de propriétés spatiales en une organisation visuelle permettant d'observer et de comprendre cette information.

Objectifs différents vision globale singularité répétitions motifs

27

28

Réalité Augmentée Réalité Augmentée [Feiner, Azuma, Mackay]

Système qui permet de superposer l'image d'un modèle virtuel 3D ou 2D sur une image de la réalité et ceci en temps réel.

1. Combine the virtual and the real2. are interactive in real time3. registered in 3D

Accroître l'utilité d'une image réelle

30

Digital Desk

Un des premiers système dit de "Réalité Augmentée" Basé sur un bureau physique ordinaire + quelques fonctionnalités Principe

Zone de travail filmée par une caméra Flux vidéo transmis à l'ordinateur Reconnaissance automatique de

• Direction pointée par l'utilisateur (avec un crayon-LED)• Documents posés sur le bureau

Vidéo-projecteur placé au-dessus de la zone de travail Données numériques projetées sur le bureau / document physique Interaction avec la fusion des mondes physiques et numériques !

[invented and built by Pierre Wellner, Xerox EuroPARC, 1991]

31

Digital desk - vidéo

32

Digital Desk

Enrichissement du monde physique avec Des données numériques Des services numériques

Copier / Coller Agrandir Retourner

Plusieurs versions par la suite Multi-utilisateurs Basé sur des tokens / infra-red / etc.

33

Digital Desk : La Réalité Augmentée La réalité augmentée est motivée par les constatations

suivantes [Wellner 93] :

Les documents avec lesquels nous interagissons peuvent avoir une réalisation physique ou une réalisation informatique

L'interaction avec les documents ne se fait pas du tout de la même manière suivant le monde (réel ou virtuel) auquel ils appartiennent.

Il existe généralement peu de liens entre les deux mondes. Certaines opérations sont plus adaptées dans un monde

que dans l'autre. Le défi de la réalité augmentée est donc d'obtenir "le

meilleur des deux mondes" en les réunissant

35

Build-It

[M. Bichsel, M. Fjeld, M. Rauterberg 1997] Objectif

Aide à la conception de systèmes complexes (système de production industriel par exemple)

Besoins Planifier / Concevoir / Positionner les

différents espaces(stockage, transfert, production, etc.)

Collaboration entre les membres de l'équipe

36

Build-It

37

Build It

Collaboration renforcée Simple : manipulation directe d'objets physiques Effective : renforce le groupe Rapide : réactivité du système

Apports Visualisation 3D Navigation virtuelle possible Manipulation des éléments "at the finger tips" "All they need is ideas"

Pas de contraintes technologiques (PC) Pas de connaissances en CAD

38

Virtualité augmentée

Virtualité augmentée [Rose, Milgram]

Incruster des images réelles dans des images virtuelles

Améliorer la qualité d'une image de synthèse par l'incrustation d'éléments de la réalité

39

Informatique ubiquitaire / Ubiquitous Computing Informatique ubiquitaire Mark Weiser's paper "The computer of

the XXIst century" in Sci. Am. 1991 Mark Weiser, 1988 à 1996, Xerox Parc :

à l’opposé de la RV sortir de la métaphore du bureau comme point d ’entrée à

l ’informatique informatique diffuse, intelligence ambiante, ordinateurs

évanescents, ...embodied reality, Pervasive computing

renforcement et enrichissement du couplage entre le monde informationnel et le monde physique

l’ordinateur disparaît, le logiciel est partout... objets physiques en réseau, technologies matérielles

embarquées associées, réseaux sans-fils, Infrastructures logicielles réparties, Sensibilité au contexte, adaptation basée sur la localisation physique, etc…

impacts forts sur le nomadisme

40

Tangible User Interface

Tangible User Interface / Ambient interface [Ishii] La définition : Using physical objects to represent and interact

with digital information : couple physical representations (e.g., spatially manipulable physical objects) with digital representations (e.g., graphics and audio).

la question : the specific modalities of tangible interfaces—how to map tangible forms with digital one

différents périphériques : physical artifacts as representations and controls for digital information comment : plus de distinction entre périphérique d ’entrée et de sortie...

Graspable User Interfaces (G. Fitzmaurice, H. Ishii, and W. Buxton, 1995) puis tangible interface (Ishii et Ullmer, IBM, 1997)

URP, A Luminous-Tangible Workbench for Urban Planning and Design, 1999 (Underkoffler et Ishii)

MERL, 3D Model Architecture

41

Informatique embarquée

Puissance, sans-fils, communicants 1/10ème pixels, accélération Har du «wearable computer» au PDA = indicateurs

42

Environnements augmentés

Environnements augmentés [Xerox Euro Parc] to bring computational power to everyday

objects with which users are already familiar, so that the user interface to this computational power becomes almost invisible

augmenting the user's perception, and emphasizes our focus on the interaction between the user and their environment.

43

Mixed Reality

Réalité mixte [Milgram]

44

L'IHM aujourd'hui L'ordinateur …partout, tous le temps,

dans toutes les situations

• Informatique mobile

• Informatique ubiquitaire

• Réalitévirtuelle

• Réalité augmentée

?

WIMP ?

46

Rappel

Interaction

Virtualité Augmentée

EntitésPhysiques

EntitésNumériques

UtilisateurIn

tera

ctio

n

Réalité Augmentée

EntitésPhysiques

EntitésNumériques

Utilisateur

Augmentation

Interaction

Virtualité Augmentée

EntitésPhysiques

EntitésNumériques

UtilisateurIn

tera

ctio

n

Réalité Augmentée

EntitésPhysiques

EntitésNumériques

Utilisateur

Augmentation

47

Conséquences Distinction claire entre RA et VA

Différentes métaphores à mettre en œuvre En RA : métaphores du monde physique En VA : métaphores du monde numérique