introduction : plasticité des ihms – page 1 bref historique concernant les acteurs

Introduction : plasticité des IHMs –

Bref historiqueconcernant les acteurs


Quand les organismes de normalisations’y mettent …

OASIS et W3C


UIMLhttp://www.uiml.org/

dérivé d'XML permettant de décrire des interfaces graphiques. Il y a des outils (renderers) qui convertissent une représentation d'UIML en représentation pour divers GUI (par exemple Java awt).un langage commun de description d'interface utilisateur, ouvert et libre d'utilisation qui soit indépendants des plateformes, qu'il s'agisse des plateformes actuelles ou futures.définir un métalangage canonique qui peut décrire n'importe quelle interface utilisateur, sans être tributaire du type d'unité ou d'interface graphique utilisée. UIML peut décrire les interfaces utilisateur - interface de bureau, interface web, interface mobile, système embarqué, ou encore applications « voix ».

UIML 1.0: Décembre 1997

UIML 3.1: Mars 2004

http://www.oasis-open.org UIML 4


UIML

–« User Interface Markup Language »

–Langage multi-interface (graphique, voix, ...)

–Une norme : UIML (uiml.org)–Des implémentations ou «

renderers »• Harmonia : Awt/Swing,

HTML, WML, VXML, ...• Rubico : Visual Basic, GUI

builder• TV Server, AG : C++ for

embedded systems

Les 4 parties d'un document UIML:<Head> : metadata (author, date, version, ...)<Template> : réutilisation de fragments<Interface> : interface proprement dite

<Structure> : arbre des « widgets »<Style> : styles (propriétés) des widgets<Content> : contenu (texte, image, son)<Behavior> : objet / événement / action

<Peers> : mappings et liens vers l'extérieur


Traducteurs

XML

XSLHTML

VoiceML

WML

XML et XSL pour la présentation, UIML, SUNML, Xforms ….


User Interfaces langagesXML dans tout ses états


Recommandations W3C (World Wide Web Consortium)

http://www.w3.org/2001/di/Activity

CONSTAT : multiplication des terminaux, la distribution des contenus devient plus que jamais problématique. les données doivent être filtrées et leur format modifié.

Transformation ?la reconnaissance des caractéristiques de l'équipement client par le

serveur. Une solution :Le projet CC/PP (pour Composite Capability/Preference Profiles) 1999. Basé sur le format de meta-données RDF (Resource Description Framework), Application de XML pour décrire : les caractéristisques logicielles et matérielles d'un terminal (Web ou WAP, capacité machine, etc.) + les informations relatives au profil de son utilisateur.


CC/PP (dont font parti Ericsson, IBM, Nokia, SAP et Sun),

Un panel d'appareils assez large (téléphone portable, PC, assistant personnel,...), Avantage de CC/PP : proposer une méthode de description des configurations- réduire la quantité d'informations échangées entre client et serveur(protocoles de transmission sans fil restent limités en bande passante).- les variables d'un profil CC/PP (capacités du terminal, préférences utilisateur, etc.) peuvent être appliquées au sein d'une feuille de style XSLT afin de créerou d'adapter un document.

Recommandations W3C


XFormshttp://www.w3.org/2002/Forms/Activity.html

XForms un langage à balises pour les formulaires électroniques « modernes »

Basés sur XML et renvoie les valeurs saisies dans le formulaire sous forme de document XML

Il prend en compte l’authentification, l’utilisabilité et l’accessibilité, le device independence, l’internationalisation, et l’intégration pour plusieurs langages cibles tout en réduisant la mise en œuvre de traducteurs.


Mobile Web Initiativehttp://www.w3.org/2005/MWI/Activity.html

W3C MWI travaille actuellement à la mise en place des meilleures pratiques pour les sites web et les applications sur mobile

Il propose également des tests sur l’interoperabilité entre logiciels webs et l’usage du mobile au niveau social.

Ils accueillent des groupes de travail sur la thématique générale de l’utilisation des mobiles

1ere consigne : Design for one web (cf http://www.w3.org/Mobile)


WAIhttp://www.w3.org/WAI/

Le Web est partout : les services publics sont en ligne (impots, sncf, enseignement, etc…)

Il doit donc être accessible à TOUS Comment traiter le handicap : visuel, auditif, physique,

cognitif, neurologique, etc. De plus les solutions ne doivent pas handicapées les

personnes non handicapées Web Content Accessibility Initiative (WAI) représente

des industriels, des chercheurs et des personnes connaissant bien les handicap

Donner des consignes et développer des solutions


WAIhttp://www.w3.org/WAI/

Principaux résultats

–Outils automatiques de validation de pages webs(les sites publics ont longtemps été non conformes aux tests)

–Consignes pour évaluer si une page est accessible(exemple la faire lire par une synthèse vocale)

–Consignes pour concevoir des pages accessibles (exemple classique du tag image à renseigner correctement)


http://www.w3.org/2005/Incubator/model-based-ui/charter/

Model-based User Interfaces Incubator Group Charter

Model-based User Interfaces Incubator Group, a pour mission d’évaluer les travaux en recherche

autour des modèles pour la conception des IHMs pour essayer de sortir des standard

Par exemple : les concepteurs d’UsiXML font partie de ce groupe de réflexion


Quand les RIA sont inspirés


Passage d’une page Web à une IHM ...


RIA = le meilleur du web et du "desktop"

RIA & conception des interfaces Séparer présentation - logique – données Briques d'IHM réutilisables

Nécessité d'installer un plugin dans le navigateur et forte concurrence sur les technologies Multiplication des technologies sur le poste de travail !

...

RIAs


AJAX : un ensemble de techno open source éprouvées Asynchronous Javascript And XML

Utilisation combinée nouvelle

Autres offres Adobe Flex (2004) :

http://www.adobe.com/support/documentation/en/flex/

Microsoft Silverlight (2006) : http://www.silverlight.net

Sun JavaFX (2008) :

http://www.javafx.com/

Mozilla XUL (XML User Interface Language)

http://www.mozilla.org/projects/xul/

...

Solutions RIAs disponibles

Source : Google Insights


Exigence des supports mobiles

Illustration des besoins en entreprise–Pour la téléphonie

Exemple d’Open Plug


Elips

Open-Plug – Créateur d’ELIPS – Créée en 2002, Open-Plug est basée à Sophia-Antipolis. Open-Plug est

membre de la Fondation LiMo (Linux Mobile Foundation). – Fruit de 5 ans de R&D et a fait l’objet de dépôts de brevets.

ELIPS– environnement ouvert de développement (Framework) de téléphones portables

grand public. CELIPS permet aux éditeurs de logiciels, aux fabricants de téléphones et aux opérateurs de téléphonie mobile de créer et de déployer des applications mobiles, des interfaces utilisateurs riches et des solutions logicielles.

Pourquoi ?– Pour le développement rapide des nouveaux modèles de téléphones

portables et facilite l’implémentation de nouvelles solutions logicielles et la création d’interfaces utilisateurs.

– Pour réutiliser leurs développements d’une plateforme de téléphone à l’autre et développer des variantes de leurs produits plus rapidement.


Quand les chercheurs s’en mêlent…


Equipes et travaux en présence

Equipe IIHM Laboratoire IMAG à Grenoble–Gaelle Calvary & Joelle Coutaz

Equipe RAINBOW Laboratoire I3S à Sophia Antipolis– Michel Riveill & Philippe Renevier & Audrey Occello &

Anne Marie Dery Laboratoire HIIS à l’université de Pise

– Fabio Paterno Equipe IHM au Université de Valencienne

–Anas Hariri & Sophie Lepreux & Christophe Kolski Laboratoire CHI Université catholique de

Louvain–Jean Vanderdonckt


Exemples d’articles

EMMA pour la Plasticité en MobilitéIn Actes de la 20ème Conférence francophone sur l’Interaction Homme-Machine (IHM’2008,

Metz, France, Septembre 2008). 2008. Vincent Ganneau, Rachel Demumieux, Gaëlle Calvary http://iihm.imag.fr/publication/GDC08a/ Model-Driven Engineering of Multi-Target Plastic User InterfacesIn Proc. of 4th International Conference on Autonomic and Autonomous Systems ICAS 2008.

pages 7-14. 2008. Benoit Collignon, Jean Vanderdonckt, Gaëlle Calvary D. Greenwood, M. Grottke, H. Lutfiyya, M. Popescu (eds.), IEEE Computer Society Press, Los

Alamitos, Gosier, 16-21 March 2008http://iihm.imag.fr/publication/CVC08a/Anne-Marie Pinna-Déry, Cédric Joffroy, Philippe Renevier, Michel Riveill, Christophe Vergoni.

"ALIAS: A Set of Abstract Languages for User Interface Assembly" in Proceedings of the 9th IASTED International Conference Software Engineering and Applications (SEA'08), IASTED, pages 77--82, ACTA Press, Orlando, Florida, USA, 16-17 nov 2008http://rainbow.polytech.unice.fr/publis/pinna-dery-joffroy-etal:2008.pdf

Anne-Marie Pinna-Déry, Jérémy Fierstone. "Construction d'Interfaces Utilisateurs Par Fusion de Composants d'IHM : un Atout Pour la Mobilité" in Proceedings of the Premières Journées

Francophones: Mobilité et Ubiquité, 2004


Un cadre de référence : Cameleon

Projet multi partenaires


Cadre de référence : phase “conception”

Config 1 ModèleTâches etConcepts

IHM concrète

IHM finale

IHM abstraite

ModèleTâches etConcepts

Modèles archétypes

Config 2Concepts

Tâches

User

Plate-forme

Environment

Evolution

Transition

IHM concrète

IHM finale

IHM abstraite

Concepts

Tâches

User

Plate-forme

Environment

Evolution

Transition

Domaine

Concepts

Tâches

Contexte

User

Plate-forme

Environment

Adaptation

Evolution

Transition

Modèles ontologiques

ARTStudio

D. Thevenin

Réification, Factorisation, Traduction, Abstraction / Reconception, Crossing, Intervention Humaine

“Spécifier 1 fois -> N Interfaces” approche par modèles


Tâches &Concepts

IHM abstraite

IHM concrète

IHM finale

Config 1

Cadre de référence : phase “conception”


Equipe IIHM : "Plasticité des IHM"

Approches explorées :1) Composition d'IHM2) Transformation de modèles (IDM). - métamodèles pour l'IHM

- taxonomie d'IHM (extra-IHM, trans-IHM, meta-IHM, mega-IHM). 3) Modèle d'évolution.

- modèle utilisateur par réseau bayésien sur mobile- métamodèle d'évolution- premiers patrons d'adaptation.


Projet RAINBOW : Plasticité

Applications évolutives et adaptables – accessibles via un PDA, un portable ou une station– variabilité des fonctionnalités selon le contexte d'utilisation (mode dégradé, connecté ou déconnecté, dépendance des ressources…)

Applications construites à base de composants (composants métiers, composants d’IHM, composants services…)

S’appuyer sur les infrastructures systèmes (RMI, EJB, …) et sur une plate-forme à composants

Exemples :– Agenda collaboratif

– Gestion commerciale (facturations, commandes, client, fournisseur)


Contenu du module

Semaine 1 1H30: Introduction aux RIA (Audrey Occello) 2H00 : Introduction au module

Semaine 2 4H Cours Flex en entreprise Semaine 3 2H + 2H : Présentation Open Plug Flex pour MobileSemaine 4 Semaine libérée Semaine 5 3H : Cours XUL (Paul Franchi)

Semaine 6 Des solutions recherche : UsiXML + ALIAS Semaine 7 4H : TP XUL (Paul Franchi) Semaine 8 D’autres solutions en recherche - Approche IIHM (Gaelle Calvary) Semaine 9 ENTRETIENS


Evaluation

Pour chaque thème abordé en coursdéfinir le domaine de plasticité

plateforme / environnement / utilisateurconception / exécutionmodèle sous jacentillustration du besoin sur un exempleavantages et inconvénients

Conclusion : votre synthèseBibliographie

Travail individuelRendu : apport PDF + entretiensLe rapport doit être rendu 2 jours avant l’entretien

introduction : plasticité des ihms – page 1 bref historique concernant les acteurs

Documents