Anne Roudaut, Joëlle Coûtaz

Méta-IHMou comment contrôler l’espace

interactif ambiant

Université Joseph FourierU.F.R informatique &

Mathématiques Appliquées

Institut National Polytechnique de Grenoble

ENSIMAG

CLIPS-IMAGCommunication langagière et Interaction Personne-Système

IIHMIngénierie de l’Interaction

Homme-Machine

5 - 8 septembre 2006 CNAM - Paris

Ubimob'06 3e Journées Francophones Mobilité et Ubiquité

• Un vaste réseau de ressources informatiques interconnectées

Contexte du travail : IHM en informatique ambiante

2

• En surface, de nouvelles possibilités d’interaction pour l’utilisateur

Contexte du travail : IHM en informatique ambiante

2

• En surface, de nouvelles possibilités d’interaction pour l’utilisateur

Contexte du travail : IHM en informatique ambiante

Pick & Drop [Rekimoto 98]

2

• En surface, de nouvelles possibilités d’interaction pour l’utilisateur

Contexte du travail : IHM en informatique ambiante

Cube TV [Block 04]

2

• Nouveaux services, techniques, ressources

Contexte du travail : IHM en informatique ambiante

3

• Nouveaux services, techniques, ressources• Frontières souples

Contexte du travail : IHM en informatique ambiante

3

• Comment contrôler, configurer, évaluer l’état de l’espace ambiant?

Contexte du travail : IHM en informatique ambiante

4

Problème

• Des solutions isolées et ad hoc

Jigsaw [Rodden 04]

5

Problème

• Des solutions isolées et ad hoc

Paris New-York

tranStick [Rekimoto 05]

5

Jigsaw [Rodden 04]

Problème

• Des solutions isolées et ad hoc• Pas de réflexion générale sur le problème

5

Jigsaw [Rodden 04] tranStick [Rekimoto 05]

Paris New-York

Réponse : le concept de méta-IHM

Méta-IHMMéta-IHM6

Plan

Contexte

Problème

Contributions Conceptuelles

Techniques

Conclusion et perspectives

8

Plan

Contexte

Problème

Contributions Conceptuelles

Techniques

Conclusion et perspectives

Définition de méta-IHM

Analyse de l’état de l’art

8

Définition de méta-IHM

• Méta-IHM :

– Une méta-IHM recouvre l’ensemble des fonctions (et leur IHM) nécessaire et suffisant pour permettre à l’utilisateur de configurer, contrôler et évaluer l’état de l’espace ambiant.

– Méta : elle est au-dessus des services métiers de l’espace

– IHM : elle permet de configurer, de contrôler et d’évaluer l’état de cet espace

9

Définition de méta-IHM : Approche adoptée

• Puissance d’une taxonomie :

– Comprendre et cerner le sujet

– Comparer les solutions existantes

– Explorer de nouvelles pistes

10

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

11

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

11

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Ils perdent leur raison d’être

11

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Ils conservent leur raison d’être

11

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

tranStick [Rekimoto 05]

11

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Jigsaw [Rodden 04]

11

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Dynawall [Streitz 99]

11

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

12

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Speakeasy [Newman 02 ]

12

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Les tablettes d’Hinckley [Hinckley 00b]

12

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Pick & Drop [Rekimoto 98]

12

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Plastic Clock

12

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

E-gadget [Marcopoulos 04]

12

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

12

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Niveau d’intégration

Meta-IHM externe

Meta-IHM tissée Niveau de

contrôle

Observabilité Traçabilité

Qualités d’une méta-IHM

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Contrôlabilité

Observabilité : percevoir l’état du service

Traçabilité : observabilité au cours du temps

Contrôlabilité : intervenir sur l’exécution du service

13

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Niveau d’intégration

Meta-IHM externe

Meta-IHM tissée Niveau de

contrôle

Observabilité Traçabilité

Qualités d’une méta-IHM

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Contrôlabilité

Editeur Jigsaw [Rodden 04]

13

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Niveau d’intégration

Meta-IHM externe

Meta-IHM tissée Niveau de

contrôle

Observabilité Traçabilité

Qualités d’une méta-IHM

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Contrôlabilité

MigriXML [Molina 06]13

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Niveau d’intégration

Meta-IHM externe

Meta-IHM tissée Niveau de

contrôle

Observabilité Traçabilité

Qualités d’une méta-IHM

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Contrôlabilité

Projecteur mobile [Borkowski 06]

MigriXML [Molina 06]13

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Niveau d’intégration

Meta-IHM externe

Meta-IHM tissée Niveau de

contrôle

Observabilité Traçabilité

Qualités d’une méta-IHM

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Contrôlabilité

Speakeasy [Newman 02 ]

13

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Niveau d’intégration

Meta-IHM externe

Meta-IHM tissée Niveau de

contrôle

Observabilité Traçabilité

Qualités d’une méta-IHM

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Contrôlabilité

Editeur Jigsaw [Rodden 04]

13

Définition de méta-IHM : Espace taxonomique

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Niveau d’intégration

Meta-IHM externe

Meta-IHM tissée Niveau de

contrôle

Observabilité Traçabilité

Qualités d’une méta-IHM

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Contrôlabilité

13

Plan

Contexte

Problème

Contributions Conceptuelles

Techniques

Conclusion et perspectives

Définition de méta-IHM

Analyse de l’état de l’art

14

Analyse de l’état de l’art : Tendances

• Méta-IHM tangibles

15

tranStick [Rekimoto 05]

Analyse de l’état de l’art : Tendances

• Méta-IHM tangibles• Méta-IHM pour la redistribution

15

MigriXML [Molina 06]

Analyse de l’état de l’art : Tendances

• Méta-IHM tangibles• Méta-IHM pour la redistribution• Méta-IHM de programmation

15

Jigsaw [Rodden 04]

Analyse de l’état de l’art : Tendances

• Méta-IHM tangibles• Méta-IHM pour la redistribution• Méta-IHM de programmation

end-user programming

end-user development

16

Jigsaw [Rodden 04]

Analyse de l’état de l’art : Tendances

• Méta-IHM tangibles• Méta-IHM pour la redistribution• Méta-IHM de programmation

Programmation visuelle

end-user programming

end-user development

16

Jigsaw [Rodden 04]

Analyse de l’état de l’art : Tendances

• Méta-IHM tangibles• Méta-IHM pour la redistribution• Méta-IHM de programmation

Programmation visuelle

Programmation textuelle

end-user programming

end-user development

on mouseUp put "100,100" into pos repeat with x = 1 to the number of card buttons set the location of card button x to pos add 15 to item 1 of pos end repeatend mouseUp

HyperCard

16

Jigsaw [Rodden 04]

Analyse de l’état de l’art : Tendances

• Méta-IHM tangibles• Méta-IHM pour la redistribution• Méta-IHM de programmation

Programmation visuelle

Programmation textuelle

Programmation par l’exemple

end-user programming

end-user development

on mouseUp put "100,100" into pos repeat with x = 1 to the number of card buttons set the location of card button x to pos add 15 to item 1 of pos end repeatend mouseUp

Emacs

16

Jigsaw [Rodden 04] HyperCard

Analyse de l’état de l’art : Les failles

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Niveau d’intégration

Meta-IHM externe

Meta-IHM tissée Niveau de

contrôle

Observabilité Traçabilité

Qualités d’une méta-IHM

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Contrôlabilité

- Langage d’interaction : un réel défi

17

Analyse de l’état de l’art : Les failles

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Niveau d’intégration

Meta-IHM externe

Meta-IHM tissée Niveau de

contrôle

Observabilité Traçabilité

Qualités d’une méta-IHM

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Contrôlabilité

- Langage d’interaction : un réel défi

- Absence d’intégralité des services

17

Analyse de l’état de l’art : Les failles

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Niveau d’intégration

Meta-IHM externe

Meta-IHM tissée Niveau de

contrôle

Observabilité Traçabilité

Qualités d’une méta-IHM

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Contrôlabilité

- Langage d’interaction : un réel défi

- Absence d’intégralité des services

- Niveaux de contrôle peu respectés

17

Analyse de l’état de l’art : Les failles

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Niveau d’intégration

Meta-IHM externe

Meta-IHM tissée Niveau de

contrôle

Observabilité Traçabilité

Qualités d’une méta-IHM

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Contrôlabilité

- Langage d’interaction : un réel défi

- Absence d’intégralité des services

- Niveaux de contrôle peu respectés

- Absence de méta-IHM mixte

17

Plan

Contexte

Problème

Contributions Conceptuelles

Techniques

Conclusion et perspectives

18

Prototype CESAM

Conception de CESAM : Les bases

Objets manipulés par une méta-IHM

Nature des objets Numérique-

dépendant Numérique-indépendant

Numérique

Directe

Représentation numérique

Type de manipulation des objets

Représentation physique

Services offerts

Assembler

Découvrir Vocabulaire

Extensibilité du langage d’interaction

Niveau d’intégration

Meta-IHM externe

Meta-IHM tissée Niveau de

contrôle

Observabilité Traçabilité

Qualités d’une méta-IHM

Puissance d’une méta-IHM

Redistribuer

Paraméter

Syntaxe

Remodeler Sémantique

Contrôlabilité

19

- Langage d’interaction : un réel défi

- Absence d’intégralité des services

- Niveaux de contrôle peu respectés

- Absence de méta-IHM mixte

Conception de CESAM

Partie externe

Objets systèmes(Ressources d’interaction, calcul et communication)

DécouvrirAssemblerParamétrer

20

Conception de CESAM

Partie externe

Objets systèmes(Ressources d’interaction, calcul et communication)

DécouvrirAssemblerParamétrer

Partie tissée

Objets des services métiers

Remodeler

Fusion des 2 parties

Redistribution

20

Conception de CESAM

Partie externe

Objets systèmes(Ressources d’interaction, calcul et communication)

DécouvrirAssemblerParamétrer

Partie tissée

Objets des services métiers

Remodeler

Fusion des 2 parties

Redistribution

20

Conception de CESAM : la partie externe

• Construire des îlots d’interaction

Découverte des objets sous forme de jetons

Zone d’assemblage des jetons

Zone de paramétrage

21

Conception de CESAM : la partie externe

• Construire des îlots d’interaction

Déplacement des jetons par glisser-déposer

Les jetons compatibles s’allument

21

Conception de CESAM : la partie externe

• Construire des îlots d’interaction

Formation d’un îlot d’objets jeton non

compatible avec l’îlot formé

21

Conception de CESAM

Partie externe

Objets systèmes(Ressources d’interaction, calcul et communication)

DécouvrirAssemblerParamétrer

Partie tissée

Objets des services métiers

Remodeler

Fusion des 2 parties

Redistribution

22

Conception de CESAM : la partie tissée

• Remodelage de l’application métier FunnyPic

23

Conception de CESAM : la partie tissée

• Remodelage de l’application métier FunnyPic

23

Conception de CESAM : la partie tissée

• Eclater

Second clic

Premier clic

24

Conception de CESAM : la partie tissée

• Eclater• Fusionner

Second clic

Premier clic

24

Conception de CESAM : la partie tissée

• Eclater• Fusionner• Dupliquer

clic

24

Conception de CESAM : la partie tissée

• Eclater• Fusionner• Dupliquer• Rétablir

Second clic

clic

24

Conception de CESAM

Partie externe

Objets systèmes(Ressources d’interaction, calcul et communication)

DécouvrirAssemblerParamétrer

Partie tissée

Objets des services métiers

Remodeler

Fusion des 2 parties

Redistribution

25

Conception de CESAM : une méta-IHM mixte

• Redistribution par manipulation directe des objets numériques

Le jeton avale l’objet numérique pour le redistribuer

26

Plan

Contexte

Problème

Contributions Conceptuelles

Techniques

Conclusion et perspectives

27

Conclusion et perspectives

• Contributions– Espace taxonomique pour la définition d’une méta-IHM– Conception du prototype CESAM

28

Conclusion et perspectives

• Contributions– Espace taxonomique pour la définition d’une méta-IHM– Conception du prototype CESAM

28

• Perspectives à court terme :– Etendre le langage d’interaction de CESAM avec de la

programmation par exemple, textuelle et visuelle– Compléter CESAM par tous les niveaux de contrôle– Valider les choix de CESAM par une évaluation

expérimentale

Conclusion et perspectives

• Contributions– Espace taxonomique pour la définition d’une méta-IHM– Conception du prototype CESAM

28

• Perspectives à court terme :– Etendre le langage d’interaction de CESAM avec de la

programmation par exemple, textuelle et visuelle– Compléter CESAM par tous les niveaux de contrôle– Valider les choix de CESAM par une évaluation expérimentale

• Perspectives à long terme :

Merci de votre attentionQuestions ?

Implications architecturales : CAMELEON-RT

28

Implications architecturales : CAMELEON-RT

• Un exemple de fonctionnement :

29

Implications architecturales : CAMELEON-RT

• Un exemple de fonctionnement :

1. Découverte du contexte d’interaction

Utilisateur

Plate-forme

Environnement

30

Implications architecturales : CAMELEON-RT

• Un exemple de fonctionnement :

2. Synthèse des données recueillies

Situation

30

Implications architecturales : CAMELEON-RT

• Un exemple de fonctionnement :

3. Création d’un plan de configuration

Plan de configuration :

Remplacer

par

30

Implications architecturales : CAMELEON-RT

• Un exemple de fonctionnement :

4. Mise en œuvre du plan

Rechercher :

30

Implications architecturales : CAMELEON-RT

• Un exemple de fonctionnement :

5. Recherche de composants

Vide !

30

Implications architecturales : CAMELEON-RT

• Un exemple de fonctionnement :

6. Mise en œuvre du plan

Générer :

30

Implications architecturales : CAMELEON-RT

• Un exemple de fonctionnement :

7. Génération du composant

Dessiner sur la zone de

dessin

*

Choisir une couleur

Choisir un outils

Dessiner

// //

* * *

30

Implications architecturales : CAMELEON-RT

• Un exemple de fonctionnement :

8. Exécution du plan

30

Implications architecturales : retour sur la méta-IHM

• Cas du système autonome

31

Implications architecturales : retour sur la méta-IHM

• Contrôle grâce à la méta-IHM

31