6.4 Prototypes interactifs : outils de prototypage
6.4.1 Outils à programmation non-visuelle
Nous présentons d’abord deux outils de prototypage multimodal à
programma-tion non-visuelle largement utilisés par la communauté de créateurs numériques,
Processing et OpenFrameworks.
Processing
Processing [Reas et Fry, 2003] est à la base un environnement de développement
d’interfaces graphiques pour le web. Par la suite, Processing a intégré des librairies
pour réaliser différents types d’interaction : l’installation par défaut de Processing
est accompagnée de librairies pour utiliser les entrées standard (souris, clavier),
pour faire de l’analyse vidéo (détection de mouvement, suivi de couleur,
distinc-tion de blobs) et audio en temps réel. L’utilisadistinc-tion de capteurs physiques (Phidgets
et Arduino) est également possible en installant des librairies additionnelles.
Pro-cessing est conçu pour des personnes ayant peu d’expérience en programmation.
Processing propose un environnement basé sur Java, avec des commandes
propres et une méthodologie simple de programmation basée sur l’utilisation de
deux méthodes principales :setup et draw. La méthode setup permet d’initialiser
la taille de la fenêtre graphique principale (commandesizeà la Figure 6.9), la
cou-leur du bord de la fenêtre (commandestroke à la Figure 6.9), sa couleur de fond
6.4. PROTOTYPES INTERACTIFS : OUTILS DE PROTOTYPAGE 137
(commandebackgroundà la Figure 6.9) ainsi que tous les autres éléments à
initia-liser selon le cas. La méthode de dessindrawest exécutée en boucle indéfiniment
et l’utilisateur peut spécifier à l’intérieur de cette méthode le code qui lui permet
de réaliser l’interaction en entrée (souris, clavier, caméra, microphone ou capteurs
physiques) et/ou en sortie (représentation graphique ou sortie sonore).
L’environ-nement de programmation (IDE) est composé d’une fenêtre d’édition du code
(fe-nêtre du milieu à la Figure 6.9) et d’une fe(fe-nêtre pour visualiser le résultat graphique
(fenêtre à droite à la Figure 6.9).
La Figure 6.9 montre un exemple de programme interactif simple dans
Proces-sing. La commandedrawest composée d’une seule ligne de code, qui dessine une
droite entre un point fixe (x,y) et un point défini par la position de la souris
(com-mandeline). Cette commandelineillustre bien le type de commandes offertes aux
utilisateurs : des abstractions simples de haut niveau.
void setup() { size(400, 400); stroke(255); background(192, 64, 0); } void draw() { line(150, 25, mouseX, mouseY); }
F
IGURE6.9 – Exemple de programme interactif simple dans Processing.
Processing a donné lieu à un autre outil, Arduino, qui permet de programmer
des formes de capteurs physiques. Arduino permet de contrôler la
plate-forme physique du même nom, en écrivant (output) ou en lisant (input) sur les
ports physiques de la plate-forme. La plate-forme contient 12 ports et chaque
écri-ture/lecture d’un port correspond à un signal électronique de 5 V, correspondant à
l’intensité de fonctionnement des différents capteurs utilisables avec la plate-forme.
La Figure 6.10 montre un exemple d’interface bi-manuelle utilisant Arduino :
l’uti-lisateur joue de l’instrument musical avec des boutons de la main droite et un
cap-teur de pression de la main gauche.
Processing permet donc aux novices ou aux non-programmeurs de réaliser des
interactions innovantes facilement (plafond haut). Par contre les possibilités de
conception (les librairies) sont faiblement visibles, ce qui freine la conception
ex-ploratoire. Aussi le seuil est haut dès que l’on vise des prototypes un peu plus
complexes. De plus, lorsque le prototype est complexe, la visibilité du code est
très faible étant donné que le IDE est prévu pour des applications simples (faible
visibilité). Le Tableau 6.5 reprend les principales caractéristiques de Processing et
Arduino.
OpenFrameworks
OpenFrameworks (OF) [Lieberman et Watson, 2009] est une bibliothèque c++ de
programmation open source. OF est un projet issu de Processing et de la librairie
138CHAPITRE 6. ÉTAT DE L’ART DES OUTILS POUR LE PROTOTYPAGE D’INTERFACESMULTIMODALES
F
IGURE6.10 – Interface bi-manuelle développée avec Arduino.
ID Création d’interfaces graphiques interactives
Multimodalité Plusieurs modalités en entrée et en sortie : caméra,
capteurs physiques, etc.
Notation Faible visibilité
Outil Seuil haut, plafond haut
T
ABLE6.5 – Fiche-résumé de Processing, Arduino et MobileProcessing.
c++ ACU Toolkit, créée au MIT par Ben Fry (créateur également de Processing). OF
offre des méthodes simples qui permettent de créer rapidement et simplement des
applications interactives. OF a pour but de permettre à des artistes ou concepteurs
d’explorer et expérimenter des nouvelles formes d’interaction.
La méthode de programmation de OF est basée sur le même principe que
Pro-cessing : une méthodedrawqui s’exécute en boucle infinie. La principale différence
avec Processing réside dans sa performance et dans les librairies existantes,
beau-coup plus nombreuses que celles de Processing. En effet, l’utilisateur de OF peut
accéder à n’importe quelle librairie c++, comme des librairies pour réaliser de
l’ana-lyse vidéo temps réel. L’exemple illustré à la Figure 6.11 utilise une caméra qui
détecte des jetons et des gestes des mains afin de permettre d’interagir de façon
bimanuelle avec un système de visualisation de photos. OF permet également de
développer facilement des applications interactives sur iPhone.
Néanmoins, l’augmentation du pouvoir de génération grâce aux librairies c++
(plafond haut) a son contre-coût dans la difficulté supplémentaire d’apprentissage :
même si l’ensemble reste destiné à des programmeurs débutants, la
programma-tion est plus difficile que sur Processing (seuil haut). La notaprogramma-tion, basée sur C++,
offre moins de visibilité qu’une notation graphique. Le Tableau 6.6 reprend les
prin-cipales caractéristiques de OpenFrameworks.
Contrairement à Processing et OpenFrameworks, nous présentons deux autres
outils destinés à des programmeurs. Ces deux outils sont implémentés de
fa-çon conjointe et basés sur des approches différentes : une extension d’une boîte
à outils graphique, Java Swing MM, et une approche à agents, Hephais TK
[Dumaset al., 2008a].
6.4. PROTOTYPES INTERACTIFS : OUTILS DE PROTOTYPAGE 139
F
IGURE6.11 – iDisplay, un système interactif implémenté avec OpenFrameworks basé sur
la manipulation de jetons et des gestes bimanuelles.
ID Applications graphiques interactives
Multimodalité Plusieurs modalités en entrée et en sortie : caméra,
capteurs physiques, etc.
Notation faible visibilité
Outil Seuil haut, plafond haut
T
ABLE6.6 – Fiche-résumé de OpenFrameworks.
Java Swing MM
Java Swing MM [Dumaset al., 2008a] est une extension de Java Swing pour la
créa-tion d’interfaces multimodales. L’objectif principal de cette approche est de
pro-poser un outil pour le développement d’interfaces multimodales en utilisant une
plateforme d’interfaces graphiques standard. L’objectif est d’augmenter les widgets
de boîtes à outils graphiques, de façon à les rendre multimodales. Ainsi, cet outil
de développement peut être utilisé pour du prototypage.
Pour cela, l’architecture repose sur trois composants :
• Le GUI-Integrator crée les objets graphiques, sans avoir connaissance des
types d’entrées ;
• LeMedia-Integratorimplémente les entrées du système ;
• Le MMUI-Integrator étend le composant graphique afin d’intégrer les
en-trées.
Cette approche est illustrée par un bouton graphique, étendu afin de le rendre
multimodal (Figure 6.12) : l’utilisateur peut activer le bouton en utilisant les
Phid-gets, des manettes ou la voix.
Cette approche est donc peu inter-opérable en dehors de JavaSwing.
L’utilisa-tion de l’outil reste difficile pour des programmateurs débutants (seuil haut) et ses
possibilités sont améliorées par javaSwing (plafond haut). Le Tableau 6.7 reprend
les principales caractéristiques de Java Swing MM.
140CHAPITRE 6. ÉTAT DE L’ART DES OUTILS POUR LE PROTOTYPAGE D’INTERFACESMULTIMODALES
F
IGURE6.12 – Bouton multimodal implémenté sous Java Swing MM. Illustration extraite
de [Dumaset al., 2008a] .
ID Boîte à outils Java
Multimodalité Phidgets, manettes et reconnaissance vocale
Notation Inter-opérabilité avec JavaSwing
Outil Seuil haut, Plafond haut
T
ABLE6.7 – Fiche-résumé de Java Swing MM.
Hephais TK
Hephais TK [Dumaset al., 2008b] est un outil pour le développement d’interfaces
multimodales basé sur une approche à agents et implémenté en utilisant le langage
W3C EMMA [EMMA, 2010]. Le système est composé d’un "facteur" qui
centra-lise les informations venant des agents de "reconnaissance en entrée" (Figure 6.13).
Chaque agent de reconnaissance est assigné à un dispositif en entrée. Le facteur va
ensuite envoyer les messages reçus en entrée au module de fusion, qui va intégrer
les différents messages en entrée. La fusion des entrées dans Hephais TK est
défi-nie sous SMUIL (Synchronized Multimodal User Interfaces Modelling Language)
[Dumaset al., 2008c]
Les auteurs soulignent que leur solution est trop complexe pour la réalisation
d’interactions simples (seuil haut)
7. Aussi même pour développer un prototype
simple, l’exercice sera difficile. L’absence d’un outil graphique pour ajouter des
en-trées et concevoir l’interaction résulte aussi dans une augmentation de la viscosité.
Le Tableau 6.8 reprend les principales caractéristiques de Hephais TK.
6.4. PROTOTYPES INTERACTIFS : OUTILS DE PROTOTYPAGE 141
F
IGURE6.13 – Architecture de l’outil Hephais TK. Illustration extraite de
[Dumaset al., 2008a].
ID Outil pour le prototypage multimodal
Multimodalité Différentes modalités en entrée : parole, table
multi-utilisateurs et périphériques matériels.
Approche à agents
Notation Forte viscosité
Outil Seuil haut
T
ABLE6.8 – Fiche-résumé de Hephais TK.
Dans le document
Interaction multimodale en entrée : Conception et Prototypage
(Page 157-162)