Sous-sections

8.3 MAGGLITE

Dans cette section, nous présentons les composants proposés dans la boîte à outils, ainsi que quelques exemples de leur utilisation. Nous commencerons par les composants graphiques, nœuds de graphe de scène, avant de décrire les interactions disponibles, regroupant différentes réalisation des points d'accès à l'interaction décrits dans le modèle des graphes combinés.

8.3.1 Composants graphiques

Les composants graphiques sont les nœuds qui vont permettre de composer des graphes de scène. Nous en distinguons deux classes, les objets atomiques et les objets composites, comme nous l'avons défini dans le modèle des graphes combinés. Nous décrirons à part des composants particuliers, les calques.

8.3.1.1 Les objets atomiques

Magglite et Magglite Container
Magglite et Magglite Container sont les deux classes abstraites de base de la librairie, permettant la définition des composants graphiques de plus haut niveau (avec une forme, une proximité, des attributs graphiques plus évolués, etc.).
Elles définissent les mécanismes et les opérations de l'architecture de graphes de scène, et tout spécialement les traverses. Les traverses (ou «traversal», en anglais), sont les opérations de parcours des nœuds d'un graphe de scène, pour effectuer les opérations d'affichage par exemple. Ces deux classes définissent aussi les contextes et attributs graphiques des objets, données qui vont être manipulées et propagées par les opérations de traverse^8.2, ainsi que les opérations abstraites qui seront appelées par ces traverses. L'opération d'affichage, par exemple, exécute une séquence précise d'opérations concrètes (affichage des ombres, affichages des fils et propagation du contexte) et d'opérations abstraites qui devront être implémentées par les classes de plus haut niveau (affichage avant les fils, affichage après les fils, etc.).
L'objet MaggLite Container, descendant de l'objet Magglite, permet en plus l'agrégation d'autres objets: il représente donc les nœuds du graphe de scène, les objets Magglite pouvant être vus comme des feuilles.

Bureau
Le Bureau est le conteneur de base de toute application MAGGLITE, le nœud racine de tout graphe de scène d'application. Il étend le MaggLite Container et fournit tous les mécanismes qui initient les parcours du graphe de scène, en particulier pour l'affichage. C'est un composant que l'on peut qualifier d'hybride, car il intègre des fonctionnalités de la librairie Swing, utilisée pour obtenir les ressources nécessaires à l'affichage (fenêtre du système d'exploitation).
Outre les parcours pour affichage, ce composant initie aussi les parcours lors de l'initialisation de l'application pour l'accès aux dispositifs particuliers de chaque nœud (manipulateurs et outils internes), mais aussi pendant l'exécution, pour la sélection de nœuds (pick).

Composant
L'objet Composant concrétise la notion d'objet graphique en définissant une forme pouvant donc être affichée. Notons toutefois que la géométrie de ces objets reste abstraite dans son implémentation, celle-ci étant fournie lors de l'instanciation. Cette abstraction de la forme permet la création de composants graphiques de géométrie quelconque, ce qui est indispensable dans le contexte de développement des interfaces avancées (qui ne repose pas uniquement sur des objets rectangulaires ou elliptiques).
Définissant une forme, ces objets définissent aussi une proximité. La proximité d'un objet graphique est une zone de forme identique et de taille paramétrable autour de lui. Invisible par défaut, cette zone peut être rendue visible sous forme d'un halo, comme dans la figure 8.3. Nous reviendrons sur ce principe des proximités dans la section 8.3.2, celles-ci étant utilisées dans MAGGLITE pour les interactions de proximité.

**Figure 8.3:** Proximité. La proximité forme un halo autour des objets graphiques (il peut être rendu invisible).
$\includegraphics[width=.6\textwidth]{proximity}$

Enfin, cette classe est étendue par trois autres, offrant des capacités supplémentaires (voir figure 8.4):

un Composant Transparent, qui a la propriété de pouvoir varier d'opacité.
un Composant Image, qui étend le Composant Transparent et permet d'afficher une image.
un Composant Pliable, qui étend le Composant Transparent et offre en plus la capacité d'être plié par l'intermédiaire de son manipulateur ou par une interaction générique (voir la section 8.3.2).

**Figure 8.4:** Composant. Trois composants, un standard (en étoile), un composant image et un composant transparent et pliable.
$\includegraphics[width=.6\textwidth]{composant}$

Label
Enfin, MAGGLITE contient aussi un objet atomique permettant l'affichage simple de texte sur une seule ligne.

8.3.1.2 Les calques

Les Calques étendent la classe des objets pliables et ont la propriété de prendre la forme et la taille du container auquel ils sont ajoutés. Un objet calque par défaut n'a pas de contenu graphique, il n'affiche donc rien sur son composant parent. Ils proposent toutefois les fonctionnalités par défaut des objets dont ils héritent, comme la possibilité d'être rendus transparents, semi-transparents ou complètement opaques, ainsi que la capacité à être pliés. Ce sont de plus des conteneurs et peuvent de fait contenir d'autres objets graphiques.

Les calques représentent donc une abstraction pouvant être simplement étendue pour spécifier des propriétés et capacités particulières qui vont être ajoutées sous forme de couches graphiques à un autre objet. Les différents calques que nous proposons, déclinant le calque de base, permettent aussi l'ajout de couches d'interaction lorsqu'ils sont associés à des outils internes adaptés. C'est une réalisation efficace et modulaire (bien que moins complète) du modèle multi-couches proposé dans [Fekete et Beaudouin-Lafon1996,Fekete1996].

Calque de dessin
Les Calques de dessin permettent de dessiner sur un composant graphique (voir figure 8.5). Il faut pour cela que le calque ait bien évidemment été ajouté à un composant et qu'un outil de dessin approprié lui soit affecté (outil interne de dessin).

**Figure 8.5:** Calque de dessin. Un calque de dessin et son outil interne de dessin ont été ajoutés dans le composant graphique Image. Il est ainsi possible de dessiner sur le composant graphique (a). Les calques sont aussi des composants pouvant être pliés (b).
$\begin{figure}\setcounter{subfigure}{0} \begin{center} \subfigure[]{ \includeg... ...ure[]{ \includegraphics[width=.47\textwidth]{ced2}} \end{center} \end{figure}$

Calque 3D
Les Calques 3D permettent l'affichage d'une scène 3D, en utilisant les capacité d'accélération matérielle des cartes graphique OpenGL. Nous avons pour cela utilisé la librairie graphique Jogl [Petersen et Russel2004] pour la partie rendu 3D et la librairie Xith3D [Xith3D Project Group2003] afin de permettre la construction des scène 3D avec des graphes de scène. Ainsi, le calque 3D est un conteneur de notre graphe de scène qui affiche lui-même un graphe de scène 3D^8.3. Il est ainsi possible de développer des applications de visualisation ou des environnements 3D très avancés et somme toute assez performants. Nous avons pour cela utilisé les méthodes fournies par la librairie Xith3D, mais aussi ajouté certaines méthodes de rendu 3D plus évoluées (notamment le rendu non photoréaliste de la figure 8.6, pour lequel nous avons implémenté la méthode proposée dans [Gooch et al.1998]).

**Figure 8.6:** Rendus 3D. Le calque 3D permet des rendus avancés: le rendu «classique» de polygones (a1), les rendus texturés (b1), mais aussi un rendu non photoréaliste (a2 et b2).
$\includegraphics[width=\textwidth]{renders}$

**Figure 8.7:** Calque 3D. Le calque 3D de la figure (a) permet d'afficher une scène 3D dans un composant graphique. Il peut être plié, comme tout autre calque (b). Son manipulateur (c) externalise les contrôles du point de vue.
$\begin{figure}\setcounter{subfigure}{0} \begin{center} \subfigure[]{ \includeg... ...[]{ \includegraphics[width=.35\textwidth]{3dmanip}} \end{center} \end{figure}$

Ces calques sont une approche flexible d'inclusion de scènes 3D dans une boîte à outils 2D avancée. Ils permetent la conception d'interfaces très innovantes, mêlant 2D et « vraie» 3D^8.4 dans un modèle d'architecture logicielle unifié. Il reste toutefois à clarifier les possibilités d'interaction avec cette scène 3D. Actuellement, seule une interaction directe sur le point de vue de la scène 3D est possible, par l'intermédiaire du manipulateur du calque 3D (voir figure 8.7(c)). Cela permet tout de même la connexion directe de périphériques d'entrée standards ou avancés à cette manipulation de la vue, mais aussi de techniques d'interaction originales (manipulation de la vue 3D par reconnaissance de gestes ou par commandes vocales). Aller plus loin dans les interactions avec la scène 3D (sélection et déplacement d'objets, par exemple) implique à notre avis l'unification des graphes de scènes 2D et 3D dans l'architecture des graphes combinés. Bien qu'il soit aussi possible d'externaliser ces points d'entrée à l'interaction 3D par l'intermédiaire du manipulateur associé au calque 3D, cela serait beaucoup moins flexible qu'un modèle de graphe combinés étendu à la 3D (un seul graphe de scène 2D/3D associé à un graphe d'interaction).

Gestionnaire de calques
Un troisième composant est lié aux calques: un Gestionnaire de calques, permettant de contenir et manipuler une pile de calques. Les composants graphiques de la boîte à outils que nous avons vus jusqu'alors peuvent contenir un nombre indéterminé de calques, mais ne fournissent aucun moyen de les manipuler, les réordonner, établir une stratégie de sélection des calques. Ce composant de gestion de calques le permet en proposant les méthodes nécessaires à l'ajout dynamique de calques de différents types (dessin, 3D ou tout autre type de calque qui sera ajouté à la boîte à outils), mais aussi les mécanismes permettant de sélectionner un calque actif du point de vue de l'interaction, de les réordonner dans la pile, d'en supprimer, etc. De plus, il propose une vue miniature de la pile de calques qu'il contient, ainsi que les notions de calque d'arrière plan et calque de premier plan, deux calques qui ne peuvent être réordonnés (permettant ainsi l'ajout d'objets graphiques en fond ou premier plan). Son manipulateur donne accès à ces fonctions de gestion de la pile de calques.

Ce composant, associé à sa vue miniature, a principalement été conçu pour la réalisation de SVALABARD. Nous l'avons toutefois aussi utilisé pour une application exemple de la boîte à outils, application plus basique de dessin bitmap multi-calques.

8.3.1.3 Les objets composites

La boîte à outils fournit aussi un ensemble d'objets composites, comme nous les avons définis dans le chapitre précédent. Ces objets sont des nœuds du graphe de scène encapsulant un sous-graphe de scène prédéfini statiquement: une association de composants éventuellement liée à un modèle interne (comportements et interactions). Construits à partir des objets atomiques (ou extensions de ceux-ci), les quelques objets que nous présentons sont principalement des widgets reprenant les principes des boîtes à outils standard (voir figure 8.8). Par contre, même si leur modèle interne est figé, ils ne sont ni liés à un dispositif d'entrée, ni à des évènements spécifiques, leur comportement global dans l'interface pouvant être défini dynamiquement.

**Figure 8.8:** Ces objets graphiques composites implémentent des modèles de widgets standards.
$\includegraphics[width=.9\textwidth]{widgets}$

Fenêtre
Le composant Fenêtre reprend le principe des fenêtres des boîtes à outils standards, avec en plus les possibilités de graphismes et d'interactions avancées de MAGGLITE. Son graphe de scène est composé d'un nœud racine sans aspect graphique, auquel sont ajoutés deux fils: un bord et un panneau de contenu. Le bord sert à redimensionner la fenêtre, le panneau interne est le conteneur dans lequel peuvent être ajoutés d'autres objets graphiques. Le composant racine est le modèle de l'objet fenêtre, il implémente les comportements et interactions entre lui et ses fils (gestion du redimensionnement global lors de la manipulation du bord, ajout d'autres fils dans le panneau de contenu, etc.).

Bouton
L'objet composite Bouton, comme son nom l'indique, reprend le principe du widget bien connu des interfaces standards, présentant tout de même la particularité de ne pas être limité à une forme géométrique rectangulaire ou elliptique.

Slider
Le Slider est un objet composite qui implémente le widget standard représentant une glissière. Son graphe de scène associe deux objets, une glissière et une poignée, le comportement de l'un étant lié à celui de l'autre (les mouvements de la poignée sont contraints sur la glissière). Son modèle permet de maintenir une valeur entière dépendant de la position de la poignée.

Zone de texte
La Zone de texte agrège un composant graphique rectangulaire et plusieurs labels. Il définit un comportement permettant de créer plusieurs labels et d'adapter leur nombre afin d'afficher le texte voulu dans les limites graphiques du composant.

Mise à part les possibilités graphiques offertes par notre architecture pour la réalisation de ces objets, le principal avantage est qu'ils ne sont pas «câblés» de manière rigide et exclusive comme dans les boîtes à outils usuelles, que ce soit en entrée ou en sortie. Il peuvent alors être manipulés avec des paradigmes d'interaction différents et leurs comportements communs peuvent être définis dynamiquement par leurs manipulateurs qui externalisent l'accès à leur modèle. Par exemple, les comportements des trois widgets de la figure 8.9 sont configurés graphiquement comme suit avec leurs manipulateurs: le slot de sortie value (valeur) de la glissière au centre est connecté au slot d'entrée de la zone de texte à droite par l'intermédiaire d'un adaptateur (conversion de type entier → chaîne de caractères). Lorsque la valeur courante de la glissière change, par manipulation du widget ou par réception d'une nouvelle valeur au slot d'entrée value de son manipulateur, la zone de texte affiche cette valeur. Le slot de sortie action du manipulateur du bouton (à gauche) est connecté à un dispositif pass qui envoie alors la valeur constante du dispositif Init Value au slot d'entrée value du manipulateur de la glissière. Ainsi, actionner le bouton permet de réinitialiser la glissière à une valeur par défaut.

**Figure 8.9:** Connexion entre manipulateurs. Une configuration permettant de décrire des interactions entre objets à l'aide de leurs manipulateurs.
$\includegraphics[width=.9\textwidth]{mvc}$

Cet exemple simple dénote des possibilités d'expression et de prototypage rapide que permettent les graphes d'interaction avec les manipulateurs d'objets graphiques. Mais nous y voyons aussi des possibilités évidentes pour des domaines tels que l'enseignement de l'IHM, une telle approche visuelle et interactive permettant de concentrer le discours sur les fondements plutôt que sur les techniques de programmation. Enfin, cette possibilité de connexion dynamique des entrées-sorties des états des objets d'intérêt de l'interface peut aussi permettre à l'utilisateur final de composer sa propre interface, de décider de quels objets vont devenir des instruments pour en contrôler d'autres.

D'un point de vue plus général sur les objets composites, il serait intéressant de spécifier leur modèle interne par un graphe d'interaction, à l'aide des manipulateurs des objets qui les composent, plutôt que par programmation comme nous l'avons fait jusqu'alors. Par exemple, les contraintes de déplacement portant sur la poignée du Slider et sa valeur courante pourraient être spécifiées de la sorte. Cette approche, encore plus flexible, permettrait le prototypage rapide d'objets composites et donc d'objets complexes réutilisables. Toutefois, cela soulève le problème à la fois conceptuel et technique d'attacher un graphe d'interaction particulier à un nœud du graphe de scène. En effet, bien qu'ICON permette la création de dispositifs composites, encapsulant une configuration d'entrée, il nous parait à l'heure actuelle complexe d'inclure dans notre modèle d'architecture logicielle des manipulateurs d'objets graphiques basés sur ces principes.

8.3.2 Les interactions

MAGGLITE propose un ensemble d'interactions clés en main. Réalisées sous la forme de dispositifs d'interaction, de comportements ou d'outils internes (voir le chapitre 7), elles peuvent être utilisées dans toutes les applications en les insérant dans des graphes d'interaction. Combinées entre elles, avec des manipulateurs d'objets et des dispositifs d'entrée, elle permettent la construction et le prototypage de nombreuses méthodes d'entrée.

8.3.2.1 Dispositif de sélection

Le Dispositif de sélection (pick) permet d'obtenir les objets graphiques situés à une position précise dans l'espace des coordonnées écran. Il communique avec le graphe de scène de manière à envoyer en sortie les références des objets situés sous la dernière position reçue par ses slots d'entrée (voir figure 8.10). Ces références peuvent être transmises à des dispositifs permettant d'interagir avec les objets, comme nous le verrons par la suite.

**Figure 8.10:** Dispositif de sélection (pick). Le dispositif de sélection d'objets émet en sortie les références des objets graphiques situés sous les coordonnées reçues en entrée. Ces références sont émises par les slots ml.inid lorsque la position reçue est sur l'objet et ml.proxid lorsqu'elle est dans la proximité de l'objet (le slot ml.id ne fait pas de distinction entre intérieur et proximité). Ce dispositif permet aussi la sélection de widgets Swing (émis par la sortie swing.id).
$\includegraphics[width=.5\textwidth]{pick}$

Pour une sélection standard, sous le curseur, nous proposons plusieurs stratégies:

ne renvoyer que l'objet le plus «haut»;
ne renvoyer que l'objet le plus «bas»;
renvoyer tous les objets sous la position (triés du plus haut au plus bas, ou inversement).

L'objet, ou la liste d'objets, sélectionné(s) est alors envoyé(e) par le slot de sortie ml.inid.

Nous avons étendu cette sélection par une méthode de sélection par proximité. Le dispositif de sélection permet de déterminer si la position reçue est dans la proximité d'un objet. De la même manière que précédemment, l'objet, ou la liste d'objets, sélectionné(s) par proximité est alors envoyé(e) par le slot de sortie ml.proxid.

Nous proposons une dernière méthode de sélection assimilable à la notion de focus. Le dispositif de sélection peut être paramétré pour renvoyer la référence de l'objet le plus proche de la position reçue. Il y a ainsi toujours un objet sélectionné, quelle que soit la position reçue.
Enfin, ce dispositif permet aussi la sélection de composants de la boîte à outils Swing, ceux-ci pouvant être ajoutés dans des graphes de scène MAGGLITE. Les références de ces objets sont émises par le slot swing.id.

8.3.2.2 Dispositifs de manipulation

Ces dispositifs sont des dispositifs d'interaction pour la manipulation directe d'objets graphiques, style d'interaction privilégié des interfaces post-WIMP.

Drag (Glisser-Déposer)
Le dispositif de Drag permet la manipulation d'objets graphiques par Glisser-Déposer. Ce dispositif générique n'implémente que l'action de déplacement des objets, sans fournir une sémantique particulière telle que le déplacement d'objets dans des conteneurs compatibles ou le déclenchement d'actions par Drag and Drop. Toutefois, il est envisageable d'étendre cette technique de base en décomposant justement ces actions de plus haut niveau sous forme de dispositifs et en les connectant dynamiquement (création d'un dispositif Drop, à connecter à la suite du dispositif Drag).

Paper sheet
Le dispositif Paper Sheet réalise une interaction de manipulation directe d'objets proposée dans [Beaudouin-Lafon2001]. Par analogie au déplacement d'une feuille de papier, cette technique permet d'effectuer simultanément une translation et une rotation sur un objet graphique (voir figure 8.11). Initialement conçue pour effectuer des rotations sur des fenêtres empilées, cette technique peut s'avérer applicable dans d'autres contextes d'utilisation. Sa réalisation sous une forme générique applicable à tous les objets graphiques de MAGGLITE facilite son emploi (nous verrons plus loin un exemple d'utilisation de cette technique).

Pliage
Issue aussi de [Beaudouin-Lafon2001], et associée à une interaction de franchissement (Crossing-based interaction) dans [Dragicevic2004a], la technique du Pliage permet de replier un objet graphique, de la même manière qu'une feuille de papier (voir figure 8.11). Ce dispositif permet une gestion globale du pliage des objets graphiques compatibles de la librairie: les objets implémentent la capacité de pliage (géométrie et affichage) et le dispositif permet de paramétrer son déclenchement par l'entrée dans sa proximité ou le franchissement de sa frontière (il est aussi possible de plier directement les objets par l'intermédiaire de leur manipulateur).

**Figure 8.11:** Dans [Beaudouin-Lafon2001], Michel BEAUDOUIN-LAFON a proposé des techniques de manipulation directe de fenêtres inspirées de la manière dont nous interagissons avec des feuilles de papier. Nous avons inclus ces techniques dans MAGGLITE, les généralisant alors à la manipulation d'objets graphiques.
$\includegraphics[width=.75\textwidth]{mblsheets}$

Responsive Handles
Nous proposons dans MAGGLITE une technique originale pour la manipulation d'objets graphiques: les Responsive handles^8.5. Ces poignées réactives étendent le principe des poignées de manipulation, courantes dans les logiciels de dessin 2D ou de modélisation 3D, par exemple. Les poignées sont des instruments, dont la représentation dépend de la fonction, visibles sur le contour de l'objet d'intérêt lorsque celui-ci est sélectionné et permettant de le transformer. Dans la figure 8.12, l'on peut voir les deux types de poignées les plus courantes: pour redimensionner ou tourner l'objet. Leur répartition autour de l'objet permet d'accéder facilement et rapidement à l'interaction. Toutefois, il est nécessaire de sélectionner l'outil (redimensionnement ou rotation, par exemple), puis l'objet d'intérêt pour avoir accès aux poignées.

**Figure 8.12:** Poignées de manipulation.
$\includegraphics[width=.4\textwidth]{chandles}$

La technique que nous proposons regroupe ces différentes poignées sur un même instrument réactif qui va apparaître et suivre automatiquement le pointeur lorsque celui-ci entre et se déplace dans la proximité d'un objet (voir figure 8.13). Ainsi, l'interaction devient accessible sans sélection explicite de l'objet et sans que l'instrument n'occupe de la place inutilement. De plus, les Responsive Handles permettent plusieurs manipulations avec un seul instrument: déplacement, redimensionnement ou rotation. Il n'est alors plus nécessaire d'opérer à une sélection préalable de la fonction désirée: celle-ci sera déterminée par la manière de manipuler la poignée, dépendant de la connexion de son dispositif aux périphériques d'entrée. Par exemple, les différents modes peuvent être connectés sur les trois boutons d'une souris. Dès lors, le bouton utilisé pour manipuler la poignée par Glisser-Déposer déterminera la transformation appliquée à l'objet correspondant. Enfin, dans le cas d'objets proches (dont les proximités se croisent), ces poignées permettent d'effectuer la sélection et la manipulation de plusieurs objets en un seul geste.

**Figure 8.13:** Responsive Handles. En haut, une configuration du dispositif avec une souris. La poignée apparaît pour permettre le déplacement de l'objet. Plusieurs poignées peuvent être saisies simultanément, permettant alors la sélection et la manipulation de plusieurs objets en un seul geste.
$\includegraphics[width=.75\textwidth]{handle}$

L'évaluation de cette nouvelle technique pourra nous permettre de confirmer les apports que nous lui supposons. Elle est en plus une piste vers d'autres types d'interactions basées sur le même paradigme d'interactions de proximité.

Mais elle est aussi un exemple concret des apports de MAGGLITE pour le prototypage et l'utilisation de nouvelles techniques:

réalisation rapide: l'implémentation de cette technique n'a en effet pas nécessité un lourd et long travail de programmation comme cela aurait été le cas dans d'autres environnements (nous détaillons cette réalisation dans l'annexe D, section D.2.2).
réutilisabilité et interchangeabilité: une fois réalisée sous la forme d'un dispositif d'interaction, cette technique peut être utilisée dans différentes applications, et donc différents contextes d'utilisation, à la place d'autres techniques. Elle n'a pas été exclusivement câblée pour une démonstration ou une étude comme c'est souvent le cas lors de la présentation de techniques innovantes. Cela permet de passer rapidement du prototypage à l'utilisation concrète, favorisant alors l'exploration.

8.3.2.3 Transformations

Nous avons aussi tiré parti de l'architecture modulaire de MAGGLITE pour développer des techniques avancées basées sur des transformations géométriques, souvent utilisées en visualisation d'informations par exemple. L'intérêt est, encore une fois, la relative rapidité avec laquelle ces techniques ont été implémentées sous la forme de dispositifs d'interaction, et la possibilité de les utiliser dans des applications et contextes variées.

La boîte à outil fournit les abstractions nécessaires à la réalisation de ces transformation sous la forme d'interfaces et de classes abstraites Java. Le principe d'implémentation est, pour chaque nouvelle transformation, de réaliser un objet graphique calque qui va être le conteneur dans lequel les objets graphiques seront transformés, la transformation en elle-même et le dispositif d'interaction contrôlant la transformation. Pour construire une application permettant une transformation, il suffit d'utiliser le calque correspondant comme conteneur (au niveau de n'importe quel nœud du graphe de scène). Il sera alors possible, par connexion du dispositif approprié, de déclencher et contrôler la transformation.

Fisheyes
La première transformation que nous proposons comme exemple est une déformation de type Fisheyes [Furnas1981,Furnas1986]. Cette technique, largement utilisée en visualisation d'informations [Fekete2004] mais aussi pour l'interaction avec les fisheye menus [Bederson2000] par exemple, applique le principe de déformation des objectifs photographiques du même nom à la visualisation d'informations.
Le principe est que les objets proches du point d'intérêt (le point focal) sont nets et visibles, et plus ils s'en éloigne, plus le niveau de détail diminue, selon une déformation sphérique (voir figure 8.14). Cela permet d'avoir une vue globale sur un grand nombre d'information (la périphérie), tout en conservant la précision et un haut niveau de détails (autour du point focal), cela de manière continue.

Nous avons donc réalisé cette transformation et l'interaction associée (changement du point focal), en réutilisant l'implémentation présente dans la boîte à outils InfoVis [Fekete2004]. Ainsi, cette technique de visualisation peut-être connectée selon les besoins et utilisée dans MAGGLITE. Dans la figure 8.14, elle est utilisée pour une application de visualisation d'informations (partie gauche de la figure). Mais nous voyons aussi qu'elle peut être utilisée facilement dans une application standard, avec des widgets (partie droite de la figure). Cette utilisation ne présente pas un grand intérêt du point de vue interaction et utilisabilité, mais elle montre que la généricité et la flexibilité de MAGGLITE encourage l'utilisation de techniques dans des contextes différents, permettant l'exploration et la découverte de nouveaux paradigmes.

**Figure 8.14:** Utilisation d'une déformation fisheyes. À gauche, pour une application de visualisation d'information. Au centre, la connexion du dispositif. À droite, avec des widgets.
$\includegraphics[width=1.4\textwidth]{fisheyes}$

Zoom adaptatif à la densité
Nous avons utilisé cette architecture pour prototyper une autre transformation, dont le principe est proche du fisheyes. Celle-ci consiste à appliquer un agrandissement proportionnel à la quantité d'objets présents autour du point d'intérêt, d'où son appellation adaptatif à la densité. Ainsi, plus il y a d'objets dans le voisinage, plus l'agrandissement est important, offrant alors une meilleure vue. Cette visualisation peut être renforcée par un effet visuel de flou (voir figure 8.15).

**Figure 8.15:** Utilisation d'une déformation de zoom adaptatif. À gauche, pour une application de visualisation d'information. À droite, avec un composant graphique.
$\includegraphics[width=.75\textwidth]{zoom}$

Outre son application à la visualisation d'informations, cette méthode montre aussi un intérêt pour d'autres applications, comme le composant de visualisation des calques de dessin utilisé dans SVALABARD (voir figure 8.15), même si dans ce cas, l'aspect adaptatif n'est pas pris en compte (les composants à agrandir sont répartis de manière uniforme).

8.3.2.4 Comportements

Les dispositifs de comportement par défaut sont au nombre de trois dans MAGGLITE:

la Pulsation, basée sur l'opacité des objets graphiques et qui permet de faire un effet cyclique d'apparition et de disparition plus ou moins rapide.
le Collage, effet graphique principalement utilisé pour distinguer les objets inactifs. Cet effet permet de désactiver l'ombre projetée par un composant graphique et d'augmenter sa transparence, comme si celui-ci était collé à son conteneur.
le Surlignage, permettant d'insister sur les contours et la forme d'un objet afin de le mettre en avant par rapport aux autres. C'est une technique bien adaptée pour distinguer un objet d'intérêt, en particulier lorsqu'elle est associée à une opération de sélection.

Dans l'exemple de la figure 8.16, la poignée de la glissière est connectée à un dispositif de comportement Surlignage déclenché lorsque celle-ci est sélectionnée. Les deux autres objets graphiques sont connectés à des dispositifs de collage, actifs lorsque les objets ne sont pas sélectionnés.

**Figure 8.16:** Comportements. En haut à gauche, la poignée de la glissière est surlignée, et les autres objets graphiques sont collés. En bas à gauche, la fenêtre ovale n'est plus collée. La configuration des dispositifs est représentée dans la partie droite de la figure.
$\includegraphics[width=1.3\textwidth]{comportementsdemo}$

8.3.2.5 Outils Internes

Nous avons réalisé trois outils internes: un outil de dessin, un de gomme et un outil interne générique. Les deux premiers permettent de tracer simplement des traits et de les effacer sur des objets graphiques compatibles. Le troisième permet de restreindre une technique d'interaction déjà définie (sous la forme d'un dispositif d'interaction) à l'intérieur des limites graphiques d'un composant graphique.

Dessin et gomme
Les outils internes de dessin et de gomme implémentent une action de dessin ou d'effacement. Ils peuvent être utilisés avec les calques de dessin que nous avons présentés précédemment, ainsi qu'avec tout autre objet graphique prévu pour (en implémentant l'interface Java correspondante). Ainsi, comme le montre la figure 8.5, il est très simple de réaliser des interfaces de dessin, que ce soit sur l'espace de travail ou à l'intérieur de composants graphique. De plus, cette approche permet de contrôler plusieurs outils simultanément, à l'aide de dispositifs différents dans le même objet graphique ou non (pointeurs multiples). Cela promets des possibilités intéressantes pour des interfaces collaboratives, par exemple.

Outil interne générique
L'outil interne générique présente la particularité de ne pas réaliser d'action spécifique sur le composant graphique auquel il a été ajouté (si l'on exclus évidemment son retour graphique). Il dispose en effet de trois slots de sortie supplémentaires (inside.use, inside.x et inside.y) qui propagent les valeurs reçues en entrée uniquement lorsque celles-ci sont dans les limites du composant graphique associé. Lors de la présentation des outils internes du chapitre précédent, nous avions évoqué un outil interne nommé gesture InnerTool. Cet outil est en fait une composition de dispositifs comme illustré dans la figure 8.17.

**Figure 8.17:** Outil Interne générique. L'outil interne générique, associé à un composant graphique nommé square, ne transmets ses valeurs d'entrée que lorsqu'elles sont dans les limites graphiques du dit composant. Le dispositif de reconnaissance gestuelle est donc activé dans ce cas.
$\includegraphics[width=1.2\textwidth]{innertoolgeneric}$

Un outil interne générique est associé à un composant graphique nommé square. Les slots de sortie «inside» de cet outil interne sont connectés aux slots d'entrée d'un dispositif de reconnaissance de gestes. En mode global, lorsque les valeurs reçues en entrée de l'outil interne générique sont dans les limites du composant graphique, le dispositif de reconnaissance de gestes est activé. Sinon, les valeurs sont transmises par les slots de sortie «outside», comme pour tout outil interne en mode global^8.6. C'est la technique que nous avons utilisée pour réaliser la zone de reconnaissance de gestes de SVALABARD.

Cet outil interne dit générique permet donc de restreindre une technique d'interaction, ou tout autre dispositif positionnel d'action, à l'intérieur des bornes d'un objet graphique. Il peut être vu comme un filtre de coordonnées, bien que proposant plus de fonctionnalités telles que le retour graphique paramétrable (curseur de l'outil interne), ou les différents modes de fonctionnement (local ou global).

stuf
2005-09-06