0
Mega-IHM : Malléabilité des Interfaces Homme-Machine dirigée par les Modèles Jean-Sébastien Sottet (ceci n’est pas moi) La...
Contexte : Informatique ambiante <ul><li>Accès à l’information </li></ul><ul><ul><li>Tout </li></ul></ul><ul><ul><li>Parto...
Problème traité : la complexité <ul><li>Complexité des  systèmes </li></ul><ul><ul><li>Informatique ambiante </li></ul></u...
Problème traité : la complexité
Problème traité : la complexité <ul><li>un exemple de système interactif graphique </li></ul>
Problème traité : la complexité <ul><li>un exemple de système interactif graphique </li></ul>Migration
Problème traité : la complexité <ul><li>un exemple de système interactif graphique </li></ul>Remodelage
Problème traité : la complexité Remodelage Redistribution DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot;...
Problème traité : la complexité Remodelage Redistribution DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot;...
Une solution ? DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtm...
Solution explorée : la Malléabilité <ul><li>Notion clé : point de malléabilité  </li></ul><ul><ul><li>= Point de décision ...
Approche : l’IDM <ul><li>IDM = Ingénierie Dirigée par les Modèles </li></ul><ul><ul><li>Les points de malléabilité sont de...
Approche : l’IDM <ul><li>IDM = Ingénierie Dirigée par les Modèles </li></ul><ul><ul><li>Les points de malléabilité sont de...
<ul><li>Ingénierie Dirigée par les Modèles et megamodèle </li></ul><ul><li>Megamodèle et système :  malléabilité des IHM <...
<ul><li>Ingénierie Dirigée par les Modèles et  megamodèle </li></ul><ul><li>Megamodèle  et système :  malléabilité des IHM...
<ul><li>Ingénierie Dirigée par les Modèles et  megamodèle </li></ul><ul><li>Megamodèle  et système :  malléabilité des IHM...
IDM : Systèmes <ul><li>Tout est «  système  » </li></ul>Un système
Modèles et Systèmes <ul><li>Un  modèle   représente  un  système </li></ul>Un modèle 
Modèles et Systèmes  
Modèles et Systèmes   
Modèles et Systèmes    
Modèles et Acteurs    
Modèles et  Métamodèles    Un metamodèle  Dimension Mur Fenêtre Porte 
Modèles et  Métamodèles  Dimension Mur Fenêtre Porte    
Modèles et  Métamodèles   Dimension Mur Fenêtre Porte    
Modèles et  Métamodèles   Dimension Mur Fenêtre Porte      wc anti-retour eau chaude eau froide
Modèles et  Métamodèles   Dimension Mur Fenêtre Porte       wc anti-retour eau chaude eau froide
Megamodèle       Dimension Mur Fenêtre Porte      wc anti-retour eau chaude eau froide
Megamodèle       Dimension Mur Fenêtre Porte      wc anti-retour eau chaude eau froide
Mégamodèle d’IHM       Une IHM *
Mégamodèle d’IHM      Une IHM  *
Mégamodèle d’IHM Une IHM        * *
Mégamodèle d’IHM       Une IHM  * *
Mégamodèle d’IHM       Une IHM * 
Mégamodèle d’IHM  Une IHM     * 
Mégamodèle d’IHM       Une IHM * 
Mégamodèle d’IHM       Une IHM  *
Mégamodèle d’IHM  Une IHM     * 
Mégamodèle d’IHM       Une IHM  *
Mégamodèle d’IHM       Une IHM  *
Mégamodèle d’IHM  Une IHM     * 
Mégamodèle d’IHM       Une IHM * 
Mégamodèle d’IHM       Une IHM  * *
Mégamodèle d’IHM  Une IHM      * *
Mégamodèle d’IHM       Une IHM   * * *
Mégamodèle d’IHM       Une IHM  *
Mégamodèle d’IHM  Une IHM      *
Mégamodèle d’IHM       Une IHM *  * 
   * 
  *  
   * 
Mégamodèle d’IHM       *  
Mégamodèle d’IHM     *    
Mégamodèles <ul><li>Un megamodèle est un graphe d’artefacts d’IDM </li></ul>
Mégamodèles <ul><li>Un megamodèle est un graphe d’artefacts d’IDM </li></ul>
Synthèse : Megamodèle <ul><li>Un megamodèle est un graphe d’artefacts d’IDM </li></ul><ul><li>nœuds </li></ul><ul><ul><li>...
Synthèse : Megamodèle <ul><li>Un megamodèle est un graphe d’artefacts d’IDM </li></ul><ul><li>nœuds </li></ul><ul><ul><li>...
<ul><li>Ingénierie Dirigée par les Modèles et  megamodèle </li></ul><ul><li>Megamodèle  et système :  malléabilité des IHM...
Des IHM sur mesure  aux IHM malléables
Des IHM sur mesure  aux IHM malléables
Des IHM sur mesures  aux IHM malléables
Des IHM sur mesure  aux IHM malléables
Des IHM sur mesure  aux IHM malléables
Des IHM sur mesure  aux IHM malléables
Des IHM sur mesure  aux IHM malléables
Des IHM sur mesure  aux IHM malléables
Points de malléabilité
Démonstrateur MARA
Démonstrateur MARA
Démonstrateur MARA
Démonstrateur MARA
Démonstrateur MARA
Démonstrateur MARA
Malléabilité : applications <ul><li>Prototypage rapide </li></ul>
Malléabilité : applications <ul><li>Prototypage rapide </li></ul><ul><li>Exploration et comparaison d’alternatives d’IHM <...
Malléabilité : applications <ul><li>Prototypage rapide </li></ul><ul><li>Exploration et comparaison d’alternatives d’IHM <...
Malléabilité : applications <ul><li>Prototypage rapide </li></ul><ul><li>Exploration et comparaison d’alternatives d’IHM <...
Malléabilité : applications <ul><li>Prototypage rapide </li></ul><ul><li>Exploration et comparaison d’alternatives d’IHM <...
Synthèse : Malléabilité <ul><li>Conservation des modèles à l’exécution </li></ul><ul><li>Manipulation de l’IHM  </li></ul>...
Plan <ul><li>Ingénierie Dirigée par les Modèles : megamodèle </li></ul><ul><li>Système : Malléabilité des IHM </li></ul><u...
Vue versus modèle Vue Modèle Syntaxe Abstraite Syntaxe Concrète
Vue versus modèle IDM Vue Modèle Syntaxe Abstraite Syntaxe Concrète
Vue versus modèle IDM IHM Vue Modèle Syntaxe Abstraite Syntaxe Concrète
Vue versus modèle <ul><li>Relation de concrétisation de la représentation µ i </li></ul>IDM IHM Vue µ i Modèle Syntaxe Abs...
IHM <ul><li>Vue associée à un utilisateur sur un système </li></ul>Vue µ i Système
IHM orientées modèles <ul><li>Vue associée à un modèle représentant un système </li></ul>Vue µ i Modèle Système µ
IHM orientées modèles <ul><li>Vue associée à un modèle représentant un système </li></ul><ApplicationModel> <RoomList> <ro...
Taxonomie d’IHM <ul><li>Extra-IHM </li></ul><ul><ul><li>IHM du modèle d’une IHM </li></ul></ul>IHM  µ i Système Modèle µ E...
Taxonomie d’IHM <ul><li>Extra-IHM </li></ul><ul><ul><li>IHM du modèle d’une IHM </li></ul></ul><taskModels> <tasks name=&q...
Taxonomie d’IHM <ul><li>Extra-IHM </li></ul><ul><ul><li>IHM du modèle d’une IHM </li></ul></ul><taskModels> <tasks name=&q...
Taxonomie d’IHM <ul><li>Extra-IHM </li></ul>IHM  µ i Système Modèle µ Extra-IHM µ i
Taxonomie d’IHM <ul><li>Meta-IHM </li></ul>Metamodèle χ Meta-IHM µ i IHM  µ i Système Modèle µ Extra-IHM µ i
Taxonomie d’IHM <ul><li>Meta-IHM </li></ul>Metamodèle χ Meta-IHM µ i IHM  µ i Système Modèle µ Extra-IHM µ i
Taxonomie d’IHM <ul><li>Meta-IHM </li></ul>Metamodèle χ Meta-IHM µ i IHM  µ i Système Modèle µ Extra-IHM µ i
Taxonomie d’IHM <ul><li>Trans-IHM </li></ul><ul><ul><li>IHM de transformation de modèles </li></ul></ul>Metamodèle Metamod...
Taxonomie d’IHM <ul><li>Définition d’une trans-IHM </li></ul><ul><ul><li>IHM de transformation entre modèles </li></ul></u...
Taxonomie d’IHM <ul><li>Définition d’une trans-IHM </li></ul><ul><ul><li>IHM de transformation entre modèles </li></ul></u...
Taxonomie d’IHM <ul><li>Définition d’une trans-IHM </li></ul><ul><ul><li>IHM de transformation entre modèles </li></ul></u...
Taxonomie d’IHM <ul><li>Définition d’une trans-IHM </li></ul><ul><ul><li>IHM de transformation entre modèles </li></ul></u...
Megamodèle pour les IHM  τ MetaModèle Tâche Modèle Tâche Extra-IHM (Concepteur) Meta-IHM (linguiste) Modèle interacteur T ...
Megamodèle pour les IHM  MetaModèle Tâche Modèle Tâche Extra-IHM (Concepteur) Meta-IHM (linguiste) Modèle interacteur τ χ ...
Megamodèle pour les IHM  MetaModèle Tâche Modèle Tâche Extra-IHM (Concepteur) Meta-IHM (linguiste) Modèle interacteur τ χ ...
Megamodèle pour les IHM  MetaModèle Tâche Modèle Tâche Extra-IHM (Concepteur) Meta-IHM (linguiste) Modèle interacteur τ χ ...
Mega-IHM
Synthèse : Mega-IHM <ul><li>Modèles observables et manipulables </li></ul><ul><li>  concepteur et/ou utilisateur </li></ul...
Synthèse : Mega-IHM <ul><li>Modèles observables et manipulables </li></ul><ul><li>  concepteur et/ou utilisateur </li></ul...
Plan <ul><li>Ingénierie Dirigée par les Modèles : megamodèle </li></ul><ul><li>Système : Malléabilité des IHM </li></ul><u...
Ponts entre outils ?
Ponts entre outils Extra-IHM (Concepteur) µi MetaModèle Tâche Modèle Tâche Extra-IHM (Concepteur) Meta-IHM (linguiste) Mod...
Ponts entre outils MetaModèle Tâche MetaModèle Tâche
Ponts entre outils MetaModèle Tâche MetaModèle Tâche
Cartographie
Cartographie
Cartographie
Cartographie
Cartographie
Cartographie : Evolution Dialogue Graph DiaTask V1.0 -8 Before DiaTask 1996 2004 2005
Synthèse : cartographie <ul><li>Megamodèle pour les  domaines </li></ul><ul><ul><li>recherche </li></ul></ul><ul><ul><li>i...
Plan <ul><li>Ingénierie Dirigée par les Modèles </li></ul><ul><li>Malléabilité des IHM </li></ul><ul><li>Mega-IHM & megamo...
En résumé <ul><li>Problème : la complexité pour le concepteur </li></ul><ul><li>Approche suivie : l’IDM et  megamodèle </l...
Contributions - Système <ul><li>Megamodèle pour identifier les points de malléabilité </li></ul><ul><li>Conservation des m...
Contributions– Développement  <ul><li>Taxonomie des IHM orientées modèles  </li></ul><ul><ul><li>Extra-IHM </li></ul></ul>...
(Meta)contribution– Domaine <ul><li>Megamodèle pour la cartographie </li></ul><ul><ul><li>Situer les contributions </li></...
Perspectives <ul><li>Etendre l’ensemble des metamodèles </li></ul><ul><ul><li>Ergonomie </li></ul></ul><ul><ul><li>Techniq...
Résultats  <ul><li>Publications : 14 </li></ul><ul><ul><li>Revues internationales avec comité de lecture : 1 </li></ul></u...
 
Questions?
Comparaison de metamodèles <ul><li>Exemple CTTe </li></ul>
Comparaison de metamodèles <ul><li>Exemple CTTe </li></ul>
Comparaison de metamodèles
Comparaison de metamodèles
Comparaison de metamodèles XML EMF
Démonstrateur MARA <ul><li>Apports technologiques </li></ul><ul><ul><li>ATL sous forme de « bundle » OSGI </li></ul></ul><...
Upcoming SlideShare
Loading in...5
×

JsPhDDefense

878

Published on

Slides of my PhD defence...
This is not the final version but the content is slightly the same.

Published in: Education, Business, Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
878
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
12
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • Transcript of "JsPhDDefense"

    1. 1. Mega-IHM : Malléabilité des Interfaces Homme-Machine dirigée par les Modèles Jean-Sébastien Sottet (ceci n’est pas moi) Laboratoire LIG Equipes IIHM & ADELE Thèse de Doctorat
    2. 2. Contexte : Informatique ambiante <ul><li>Accès à l’information </li></ul><ul><ul><li>Tout </li></ul></ul><ul><ul><li>Partout </li></ul></ul><ul><ul><li>Tout le temps </li></ul></ul><ul><ul><li>Tout de suite </li></ul></ul><ul><li>Souplesse pour l’utilisateur </li></ul><ul><li>=> Complexité pour l’ingénieur </li></ul>
    3. 3. Problème traité : la complexité <ul><li>Complexité des systèmes </li></ul><ul><ul><li>Informatique ambiante </li></ul></ul><ul><ul><li>Diversité et combinaison de (nouvelles) technologies </li></ul></ul><ul><li>Complexité du développement </li></ul><ul><ul><li>Multiples acteurs </li></ul></ul><ul><ul><li>Multiples langages </li></ul></ul><ul><ul><li>Pas de capitalisation </li></ul></ul><ul><ul><li>Souvent ad-hoc </li></ul></ul><ul><li>Complexité du domaine (de l’IHM) </li></ul><ul><ul><li>Multiples disciplines </li></ul></ul><ul><ul><li>Multiples équipes de recherche </li></ul></ul><ul><ul><li>Multiples outils </li></ul></ul><ul><ul><li>… en évolution permanente </li></ul></ul>
    4. 4. Problème traité : la complexité
    5. 5. Problème traité : la complexité <ul><li>un exemple de système interactif graphique </li></ul>
    6. 6. Problème traité : la complexité <ul><li>un exemple de système interactif graphique </li></ul>Migration
    7. 7. Problème traité : la complexité <ul><li>un exemple de système interactif graphique </li></ul>Remodelage
    8. 8. Problème traité : la complexité Remodelage Redistribution DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;> <html> <head> <meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html;charset=UTF-8&quot;/> <title id=&quot;title&quot;>&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie.css.gz?v=86&quot;/> <![endif]--> <!--[if IE 6]> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie6.css.gz?v=86&quot;/> <![endif]--> <script type=&quot;text/javacript&quot; src=&quot;/js/horde.js.gz?v=28&quot;></script> </head> <body id=&quot;body&quot;> <div id=&quot;cache&quot;> <img src=&quot;http://data.hordes.fr/gfx/design/tab_hover.gif&quot; alt=&quot;&quot;/> </div> <div class=&quot;ieWarning&quot;> <img src=&quot;http://data.hordes.fr/gfx/icons/status_terror.gif&quot; alt=&quot;&quot;/> Vous utilisez une version ancienne d'Internet Explorer. Nous vous recommandons fortement de le <a href=&quot;http://www.microsoft.com/france/windows/products/winfamily/ie/default.mspx&quot; target=&quot;_blank&quot;>mettre à jour</a> ou d'<a href=&quot;http://www.getfirefox.com&quot;>installer Firefox</a>. </div> <div id=&quot;main&quot;> <div id=&quot;contentBg&quot;> <div id=&quot;content&quot;> <div id=&quot;notification&quot;> <div class=&quot;black&quot;></div> <div class=&quot;box&quot;> <div id=&quot;notificationText&quot;>< /div> <a href=&quot;#&quot; class=&quot;button&quot; onClick=&quot; DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;> <html> <head> <meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html;charset=UTF-8&quot;/> <title id=&quot;title&quot;>&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie.css.gz?v=86&quot;/> <![endif]--> <!--[if IE 6]> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie6.css.gz?v=86&quot;/> <![endif]--> <script type=&quot;text/javascript&quot; src=&quot;/js/horde.js.gz?v=28&quot;></script> </head> <body id=&quot;body&quot;> <div id=&quot;cache&quot;> <img src=&quot;http://data.hordes.fr/gfx/design/tab_hover.gif&quot; alt=&quot;&quot;/> </div> <div class=&quot;ieWarning&quot;> <img src=&quot;http://data.hordes.fr/gfx/icons/status_terror.gif&quot; alt=&quot;&quot;/> &quot; target=&quot;_blank&quot;>mettre à jour</a> ou d'<a href=&quot;http://www.getfirefox.com&quot;>installer Firefox</a> . </div> <div id=&quot;main&quot;> <div id=&quot;contentBg&quot;> <div id=&quot;content&quot;> <div id=&quot;notification&quot;> <div class=&quot;black&quot;>< /div> <div class=&quot;box&quot;> <div id=&quot;notificationText&quot;>< /div> <a href=&quot;#&quot; class=&quot;button&quot; onClick=&quot;document.getElementById('body').className=''; d ocument.getElementById('notification').className=''; js.Tutorial.showTutorialStep(); return false&quot;>Fermer</a> < /div> </div> <div id=&quot;banner&quot; onclick=&quot;js.Js.reboot(); return false;&quot;> DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;> <html> <head> <meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html;charset=UTF-8&quot;/> <title id=&quot;title&quot;>&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie.css.gz?v=86&quot;/> <![endif]--> <!--[if IE 6]> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; ou d'<a href=&quot;http://www.getfirefox.com&quot;>installer Firefox</a>. </div> <div id=&quot;main&quot;> <div id=&quot;contentBg&quot;> <div id=&quot;content&quot;> <div id=&quot;notification&quot;> <div class=&quot;black&quot;></div> <div class=&quot;box&quot;> <div id=&quot;notificationText&quot;>< /div> <a href=&quot;#&quot; class=&quot;button&quot; onClick=&quot;document.getElementById('body').className=''; d ocument.getElementById('notification').className=''; js.Tutorial.showTutorialStep(); return false&quot;>Fermer</a> < /div> </div> <div id=&quot;banner&quot; onclick=&quot;js.Js.reboot(); return false;&quot;> </div> <!-- JS TOOLTIP --> <div id=&quot;tooltip&quot; class=&quot;dynamicTipCategoryHere&quot;> <div class=&quot;content&quot;> <div class=&quot;header&quot;> <div id=&quot;tooltipContent&quot;></div> </div> </div> </div> <!-- JS TOOLTIP --> <div id=&quot;tooltip&quot; class=&quot;dynamicTipCategoryHere&quot;> <div class=&quot;content&quot;> <div class=&quot;header&quot;> <div id=&quot;tooltipContent&quot;></div> </div> </div> <ul><ul><li>SVG, CSS, XUL, HTML, PHP, Sql, Osgi, Corba,Java, Servlet, Ajax, … </li></ul></ul>
    9. 9. Problème traité : la complexité Remodelage Redistribution DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;> <html> <head> <meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html;charset=UTF-8&quot;/> <title id=&quot;title&quot;>&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie.css.gz?v=86&quot;/> <![endif]--> <!--[if IE 6]> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie6.css.gz?v=86&quot;/> <![endif]--> <script type=&quot;text/javacript&quot; src=&quot;/js/horde.js.gz?v=28&quot;></script> </head> <body id=&quot;body&quot;> <div id=&quot;cache&quot;> <img src=&quot;http://data.hordes.fr/gfx/design/tab_hover.gif&quot; alt=&quot;&quot;/> </div> <div class=&quot;ieWarning&quot;> <img src=&quot;http://data.hordes.fr/gfx/icons/status_terror.gif&quot; alt=&quot;&quot;/> Vous utilisez une version ancienne d'Internet Explorer. Nous vous recommandons fortement de le <a href=&quot;http://www.microsoft.com/france/windows/products/winfamily/ie/default.mspx&quot; target=&quot;_blank&quot;>mettre à jour</a> ou d'<a href=&quot;http://www.getfirefox.com&quot;>installer Firefox</a>. </div> <div id=&quot;main&quot;> <div id=&quot;contentBg&quot;> <div id=&quot;content&quot;> <div id=&quot;notification&quot;> <div class=&quot;black&quot;></div> <div class=&quot;box&quot;> <div id=&quot;notificationText&quot;>< /div> <a href=&quot;#&quot; class=&quot;button&quot; onClick=&quot; DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;> <html> <head> <meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html;charset=UTF-8&quot;/> <title id=&quot;title&quot;>&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie.css.gz?v=86&quot;/> <![endif]--> <!--[if IE 6]> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie6.css.gz?v=86&quot;/> <![endif]--> <script type=&quot;text/javascript&quot; src=&quot;/js/horde.js.gz?v=28&quot;></script> </head> <body id=&quot;body&quot;> <div id=&quot;cache&quot;> <img src=&quot;http://data.hordes.fr/gfx/design/tab_hover.gif&quot; alt=&quot;&quot;/> </div> <div class=&quot;ieWarning&quot;> <img src=&quot;http://data.hordes.fr/gfx/icons/status_terror.gif&quot; alt=&quot;&quot;/> &quot; target=&quot;_blank&quot;>mettre à jour</a> ou d'<a href=&quot;http://www.getfirefox.com&quot;>installer Firefox</a> . </div> <div id=&quot;main&quot;> <div id=&quot;contentBg&quot;> <div id=&quot;content&quot;> <div id=&quot;notification&quot;> <div class=&quot;black&quot;>< /div> <div class=&quot;box&quot;> <div id=&quot;notificationText&quot;>< /div> <a href=&quot;#&quot; class=&quot;button&quot; onClick=&quot;document.getElementById('body').className=''; d ocument.getElementById('notification').className=''; js.Tutorial.showTutorialStep(); return false&quot;>Fermer</a> < /div> </div> <div id=&quot;banner&quot; onclick=&quot;js.Js.reboot(); return false;&quot;> DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;> <html> <head> <meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html;charset=UTF-8&quot;/> <title id=&quot;title&quot;>&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie.css.gz?v=86&quot;/> <![endif]--> <!--[if IE 6]> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; ou d'<a href=&quot;http://www.getfirefox.com&quot;>installer Firefox</a>. </div> <div id=&quot;main&quot;> <div id=&quot;contentBg&quot;> <div id=&quot;content&quot;> <div id=&quot;notification&quot;> <div class=&quot;black&quot;></div> <div class=&quot;box&quot;> <div id=&quot;notificationText&quot;>< /div> <a href=&quot;#&quot; class=&quot;button&quot; onClick=&quot;document.getElementById('body').className=''; d ocument.getElementById('notification').className=''; js.Tutorial.showTutorialStep(); return false&quot;>Fermer</a> < /div> </div> <div id=&quot;banner&quot; onclick=&quot;js.Js.reboot(); return false;&quot;> </div> <!-- JS TOOLTIP --> <div id=&quot;tooltip&quot; class=&quot;dynamicTipCategoryHere&quot;> <div class=&quot;content&quot;> <div class=&quot;header&quot;> <div id=&quot;tooltipContent&quot;></div> </div> </div> </div> <!-- JS TOOLTIP --> <div id=&quot;tooltip&quot; class=&quot;dynamicTipCategoryHere&quot;> <div class=&quot;content&quot;> <div class=&quot;header&quot;> <div id=&quot;tooltipContent&quot;></div> </div> </div> <ul><ul><li>SVG, CSS, XUL, HTML, PHP, Sql, Osgi, Corba,Java, Servlet, Ajax, … </li></ul></ul>
    10. 10. Une solution ? DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;> <html> <head> <meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html;charset=UTF-8&quot;/> <title id=&quot;title&quot;>&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie.css.gz?v=86&quot;/> <![endif]--> <!--[if IE 6]> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie6.css.gz?v=86&quot;/> <![endif]--> <script type=&quot;text/javacript&quot; src=&quot;/js/horde.js.gz?v=28&quot;></script> </head> <body id=&quot;body&quot;> <div id=&quot;cache&quot;> <img src=&quot;http://data.hordes.fr/gfx/design/tab_hover.gif&quot; alt=&quot;&quot;/> </div> <div class=&quot;ieWarning&quot;> <img src=&quot;http://data.hordes.fr/gfx/icons/status_terror.gif&quot; alt=&quot;&quot;/> Vous utilisez une version ancienne d'Internet Explorer. Nous vous recommandons fortement de le <a href=&quot;http://www.microsoft.com/france/windows/products/winfamily/ie/default.mspx&quot; target=&quot;_blank&quot;>mettre à jour</a> ou d'<a href=&quot;http://www.getfirefox.com&quot;>installer Firefox</a>. </div> <div id=&quot;main&quot;> <div id=&quot;contentBg&quot;> <div id=&quot;content&quot;> <div id=&quot;notification&quot;> <div class=&quot;black&quot;></div> <div class=&quot;box&quot;> <div id=&quot;notificationText&quot;>< /div> <a href=&quot;#&quot; class=&quot;button&quot; onClick=&quot; DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;> <html> <head> <meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html;charset=UTF-8&quot;/> <title id=&quot;title&quot;>&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie.css.gz?v=86&quot;/> <![endif]--> <!--[if IE 6]> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie6.css.gz?v=86&quot;/> <![endif]--> <script type=&quot;text/javascript&quot; src=&quot;/js/horde.js.gz?v=28&quot;></script> </head> <body id=&quot;body&quot;> <div id=&quot;cache&quot;> <img src=&quot;http://data.hordes.fr/gfx/design/tab_hover.gif&quot; alt=&quot;&quot;/> </div> <div class=&quot;ieWarning&quot;> <img src=&quot;http://data.hordes.fr/gfx/icons/status_terror.gif&quot; alt=&quot;&quot;/> &quot; target=&quot;_blank&quot;>mettre à jour</a> ou d'<a href=&quot;http://www.getfirefox.com&quot;>installer Firefox</a> . </div> <div id=&quot;main&quot;> <div id=&quot;contentBg&quot;> <div id=&quot;content&quot;> <div id=&quot;notification&quot;> <div class=&quot;black&quot;>< /div> <div class=&quot;box&quot;> <div id=&quot;notificationText&quot;>< /div> <a href=&quot;#&quot; class=&quot;button&quot; onClick=&quot;document.getElementById('body').className=''; d ocument.getElementById('notification').className=''; js.Tutorial.showTutorialStep(); return false&quot;>Fermer</a> < /div> </div> <div id=&quot;banner&quot; onclick=&quot;js.Js.reboot(); return false;&quot;> DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;> <html> <head> <meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html;charset=UTF-8&quot;/> <title id=&quot;title&quot;>&quot; type=&quot;text/css&quot; href=&quot;http://data.hordes.fr/css/ie.css.gz?v=86&quot;/> <![endif]--> <!--[if IE 6]> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; ou d'<a href=&quot;http://www.getfirefox.com&quot;>installer Firefox</a>. </div> <div id=&quot;main&quot;> <div id=&quot;contentBg&quot;> <div id=&quot;content&quot;> <div id=&quot;notification&quot;> <div class=&quot;black&quot;></div> <div class=&quot;box&quot;> <div id=&quot;notificationText&quot;>< /div> <a href=&quot;#&quot; class=&quot;button&quot; onClick=&quot;document.getElementById('body').className=''; d ocument.getElementById('notification').className=''; js.Tutorial.showTutorialStep(); return false&quot;>Fermer</a> < /div> </div> <div id=&quot;banner&quot; onclick=&quot;js.Js.reboot(); return false;&quot;> </div> <!-- JS TOOLTIP --> <div id=&quot;tooltip&quot; class=&quot;dynamicTipCategoryHere&quot;> <div class=&quot;content&quot;> <div class=&quot;header&quot;> <div id=&quot;tooltipContent&quot;></div> </div> </div> </div> <!-- JS TOOLTIP --> <div id=&quot;tooltip&quot; class=&quot;dynamicTipCategoryHere&quot;> <div class=&quot;content&quot;> <div class=&quot;header&quot;> <div id=&quot;tooltipContent&quot;></div> </div> </div> Générer
    11. 11. Solution explorée : la Malléabilité <ul><li>Notion clé : point de malléabilité </li></ul><ul><ul><li>= Point de décision en conception </li></ul></ul><ul><li>Les conserver à l’exécution </li></ul><ul><li>Les manipuler à l’exécution </li></ul><ul><ul><li>Concepteur </li></ul></ul><ul><ul><li>Utilisateur </li></ul></ul>
    12. 12. Approche : l’IDM <ul><li>IDM = Ingénierie Dirigée par les Modèles </li></ul><ul><ul><li>Les points de malléabilité sont des modèles en IHM </li></ul></ul><ul><li>Trois principes essentiels </li></ul><ul><ul><li>Explicitation </li></ul></ul><ul><ul><li>Capitalisation </li></ul></ul><ul><ul><li>Opérationnalisation </li></ul></ul>
    13. 13. Approche : l’IDM <ul><li>IDM = Ingénierie Dirigée par les Modèles </li></ul><ul><ul><li>Les points de malléabilité sont des modèles en IHM </li></ul></ul><ul><li>Trois principes essentiels </li></ul><ul><ul><li>Explicitation </li></ul></ul><ul><ul><li>Capitalisation </li></ul></ul><ul><ul><li>Opérationnalisation </li></ul></ul><ul><ul><ul><li>système </li></ul></ul></ul><ul><ul><ul><li>développement </li></ul></ul></ul><ul><ul><ul><li>domaine </li></ul></ul></ul>Savoir et Savoir faire
    14. 14. <ul><li>Ingénierie Dirigée par les Modèles et megamodèle </li></ul><ul><li>Megamodèle et système : malléabilité des IHM </li></ul><ul><li>Megamodèle et développement : mega-IHM </li></ul><ul><li>Megamodèle et domaine : cartographie </li></ul><ul><li>Conclusion </li></ul>Plan
    15. 15. <ul><li>Ingénierie Dirigée par les Modèles et megamodèle </li></ul><ul><li>Megamodèle et système : malléabilité des IHM </li></ul><ul><li>Megamodèle et développement : mega-IHM </li></ul><ul><li>Megamodèle et domaine : cartographie </li></ul><ul><li>Conclusion </li></ul>Plan
    16. 16. <ul><li>Ingénierie Dirigée par les Modèles et megamodèle </li></ul><ul><li>Megamodèle et système : malléabilité des IHM </li></ul><ul><li>Megamodèle et développement : mega-IHM </li></ul><ul><li>Megamodèle et domaine : cartographie </li></ul><ul><li>Conclusion </li></ul>Plan
    17. 17. IDM : Systèmes <ul><li>Tout est «  système  » </li></ul>Un système
    18. 18. Modèles et Systèmes <ul><li>Un modèle représente un système </li></ul>Un modèle 
    19. 19. Modèles et Systèmes  
    20. 20. Modèles et Systèmes   
    21. 21. Modèles et Systèmes    
    22. 22. Modèles et Acteurs    
    23. 23. Modèles et Métamodèles    Un metamodèle  Dimension Mur Fenêtre Porte 
    24. 24. Modèles et Métamodèles  Dimension Mur Fenêtre Porte    
    25. 25. Modèles et Métamodèles   Dimension Mur Fenêtre Porte    
    26. 26. Modèles et Métamodèles   Dimension Mur Fenêtre Porte      wc anti-retour eau chaude eau froide
    27. 27. Modèles et Métamodèles   Dimension Mur Fenêtre Porte       wc anti-retour eau chaude eau froide
    28. 28. Megamodèle      Dimension Mur Fenêtre Porte      wc anti-retour eau chaude eau froide
    29. 29. Megamodèle      Dimension Mur Fenêtre Porte      wc anti-retour eau chaude eau froide
    30. 30. Mégamodèle d’IHM       Une IHM *
    31. 31. Mégamodèle d’IHM      Une IHM  *
    32. 32. Mégamodèle d’IHM Une IHM        * *
    33. 33. Mégamodèle d’IHM       Une IHM  * *
    34. 34. Mégamodèle d’IHM       Une IHM * 
    35. 35. Mégamodèle d’IHM  Une IHM     * 
    36. 36. Mégamodèle d’IHM       Une IHM * 
    37. 37. Mégamodèle d’IHM       Une IHM  *
    38. 38. Mégamodèle d’IHM  Une IHM     * 
    39. 39. Mégamodèle d’IHM       Une IHM  *
    40. 40. Mégamodèle d’IHM       Une IHM  *
    41. 41. Mégamodèle d’IHM  Une IHM     * 
    42. 42. Mégamodèle d’IHM       Une IHM * 
    43. 43. Mégamodèle d’IHM       Une IHM  * *
    44. 44. Mégamodèle d’IHM  Une IHM      * *
    45. 45. Mégamodèle d’IHM       Une IHM   * * *
    46. 46. Mégamodèle d’IHM       Une IHM  *
    47. 47. Mégamodèle d’IHM  Une IHM      *
    48. 48. Mégamodèle d’IHM       Une IHM *  * 
    49. 49.    * 
    50. 50.   *  
    51. 51.    * 
    52. 52. Mégamodèle d’IHM       *  
    53. 53. Mégamodèle d’IHM     *    
    54. 54. Mégamodèles <ul><li>Un megamodèle est un graphe d’artefacts d’IDM </li></ul>
    55. 55. Mégamodèles <ul><li>Un megamodèle est un graphe d’artefacts d’IDM </li></ul>
    56. 56. Synthèse : Megamodèle <ul><li>Un megamodèle est un graphe d’artefacts d’IDM </li></ul><ul><li>nœuds </li></ul><ul><ul><li>systèmes </li></ul></ul><ul><ul><li>modèles </li></ul></ul><ul><ul><li>metamodèles </li></ul></ul><ul><ul><li>transformations </li></ul></ul><ul><li>arcs </li></ul><ul><ul><li>µ : système-modèle: </li></ul></ul><ul><ul><li> : modèle-metamodèle </li></ul></ul><ul><ul><li> : (trace de) transformations entre modèles </li></ul></ul><ul><ul><li> : transformations entre metamodèles </li></ul></ul>
    57. 57. Synthèse : Megamodèle <ul><li>Un megamodèle est un graphe d’artefacts d’IDM </li></ul><ul><li>nœuds </li></ul><ul><ul><li>systèmes </li></ul></ul><ul><ul><li>modèles </li></ul></ul><ul><ul><li>metamodèles </li></ul></ul><ul><ul><li>transformations </li></ul></ul><ul><li>arcs </li></ul><ul><ul><li>µ : système - modèle : </li></ul></ul><ul><ul><li> : modèle - metamodèle </li></ul></ul><ul><ul><li> : (trace de) transformations entre modèles </li></ul></ul><ul><ul><li> : transformations entre metamodèles </li></ul></ul>
    58. 58. <ul><li>Ingénierie Dirigée par les Modèles et megamodèle </li></ul><ul><li>Megamodèle et système : malléabilité des IHM </li></ul><ul><li>Megamodèle et développement : mega-IHM </li></ul><ul><li>Megamodèle et domaine : cartographie </li></ul><ul><li>Conclusion </li></ul>Plan
    59. 59. Des IHM sur mesure aux IHM malléables
    60. 60. Des IHM sur mesure aux IHM malléables
    61. 61. Des IHM sur mesures aux IHM malléables
    62. 62. Des IHM sur mesure aux IHM malléables
    63. 63. Des IHM sur mesure aux IHM malléables
    64. 64. Des IHM sur mesure aux IHM malléables
    65. 65. Des IHM sur mesure aux IHM malléables
    66. 66. Des IHM sur mesure aux IHM malléables
    67. 67. Points de malléabilité
    68. 68. Démonstrateur MARA
    69. 69. Démonstrateur MARA
    70. 70. Démonstrateur MARA
    71. 71. Démonstrateur MARA
    72. 72. Démonstrateur MARA
    73. 73. Démonstrateur MARA
    74. 74. Malléabilité : applications <ul><li>Prototypage rapide </li></ul>
    75. 75. Malléabilité : applications <ul><li>Prototypage rapide </li></ul><ul><li>Exploration et comparaison d’alternatives d’IHM </li></ul>
    76. 76. Malléabilité : applications <ul><li>Prototypage rapide </li></ul><ul><li>Exploration et comparaison d’alternatives d’IHM </li></ul>Contrôle explicite Gestion des erreurs Compatibilité
    77. 77. Malléabilité : applications <ul><li>Prototypage rapide </li></ul><ul><li>Exploration et comparaison d’alternatives d’IHM </li></ul><ul><li>Adaptation au contexte </li></ul>
    78. 78. Malléabilité : applications <ul><li>Prototypage rapide </li></ul><ul><li>Exploration et comparaison d’alternatives d’IHM </li></ul><ul><li>Adaptation au contexte </li></ul><ul><li>Enseignement de l’IHM et de l’IDM </li></ul>
    79. 79. Synthèse : Malléabilité <ul><li>Conservation des modèles à l’exécution </li></ul><ul><li>Manipulation de l’IHM </li></ul><ul><li>au travers de ses points de malléabilité </li></ul><ul><li>Multiples applications </li></ul>
    80. 80. Plan <ul><li>Ingénierie Dirigée par les Modèles : megamodèle </li></ul><ul><li>Système : Malléabilité des IHM </li></ul><ul><li>Développement : Mega-IHM </li></ul><ul><li>Domaine : Cartographie </li></ul><ul><li>Conclusion </li></ul>
    81. 81. Vue versus modèle Vue Modèle Syntaxe Abstraite Syntaxe Concrète
    82. 82. Vue versus modèle IDM Vue Modèle Syntaxe Abstraite Syntaxe Concrète
    83. 83. Vue versus modèle IDM IHM Vue Modèle Syntaxe Abstraite Syntaxe Concrète
    84. 84. Vue versus modèle <ul><li>Relation de concrétisation de la représentation µ i </li></ul>IDM IHM Vue µ i Modèle Syntaxe Abstraite Syntaxe Concrète
    85. 85. IHM <ul><li>Vue associée à un utilisateur sur un système </li></ul>Vue µ i Système
    86. 86. IHM orientées modèles <ul><li>Vue associée à un modèle représentant un système </li></ul>Vue µ i Modèle Système µ
    87. 87. IHM orientées modèles <ul><li>Vue associée à un modèle représentant un système </li></ul><ApplicationModel> <RoomList> <rooms name=Cellar  function: =#//@ApplicationModel.0/@Function.0 /> <rooms name=Kitchen function: =#//@ApplicationModel.0/@Function.1 /> <rooms name= AlexDesk function: =#//@ApplicationModel.0/@Function.2 /> <rooms name=LivingRoom function: =#//@ApplicationModel.0/@Function.3 /> </RoomList> <Function name=SetCellar … </ApplicationModel> Vue µ i Modèle Système µ
    88. 88. Taxonomie d’IHM <ul><li>Extra-IHM </li></ul><ul><ul><li>IHM du modèle d’une IHM </li></ul></ul>IHM µ i Système Modèle µ Extra-IHM µ i
    89. 89. Taxonomie d’IHM <ul><li>Extra-IHM </li></ul><ul><ul><li>IHM du modèle d’une IHM </li></ul></ul><taskModels> <tasks name=&quot;Manage Home Temperature&quot; decompositionOperator=&quot;#//@taskModels.0/@binaries.0&quot; taskType=&quot;#//@taskModels.0/@taskTypes.1&quot;/> <tasks name=&quot;Select Room&quot; taskType=&quot;#//@taskModels.0/@taskTypes.2&quot; manipulatedConcepts=&quot;#//@conceptModels.0/@concepts.0&quot; fromOperator=&quot;#//@taskModels.0/@binaries.0&quot;/> <tasks name=&quot;Set Room Temperature&quot; taskType=&quot;#//@taskModels.0/@taskTypes.0&quot; manipulatedConcepts=&quot;#//@conceptModels.0/@concepts.1&quot; fromOperator=&quot;#//@taskModels.0/@binaries.0&quot; interactor=&quot;#//@interactorModels.0/@interactors.0&quot;/> <binaries motherTask=&quot;#//@taskModels.0/@tasks.0&quot; nature=&quot;enablingWithInformationPassing&quot; subTasks=&quot;#//@taskModels.0/@tasks.1 #//@taskModels.0/@tasks.2&quot;/> <taskTypes name=&quot;Input&quot;/> <taskTypes name=&quot;Other&quot;/> <taskTypes name=&quot;Choice 1/n&quot;/> </taskModels> IHM µ i Système Modèle µ Extra-IHM µ i
    90. 90. Taxonomie d’IHM <ul><li>Extra-IHM </li></ul><ul><ul><li>IHM du modèle d’une IHM </li></ul></ul><taskModels> <tasks name=&quot;Manage Home Temperature&quot; decompositionOperator=&quot;#//@taskModels.0/@binaries.0&quot; taskType=&quot;#//@taskModels.0/@taskTypes.1&quot;/> <tasks name=&quot;Select Room&quot; taskType=&quot;#//@taskModels.0/@taskTypes.2&quot; manipulatedConcepts=&quot;#//@conceptModels.0/@concepts.0&quot; fromOperator=&quot;#//@taskModels.0/@binaries.0&quot;/> <tasks name=&quot;Set Room Temperature&quot; taskType=&quot;#//@taskModels.0/@taskTypes.0&quot; manipulatedConcepts=&quot;#//@conceptModels.0/@concepts.1&quot; fromOperator=&quot;#//@taskModels.0/@binaries.0&quot; interactor=&quot;#//@interactorModels.0/@interactors.0&quot;/> <binaries motherTask=&quot;#//@taskModels.0/@tasks.0&quot; nature=&quot;enablingWithInformationPassing&quot; subTasks=&quot;#//@taskModels.0/@tasks.1 #//@taskModels.0/@tasks.2&quot;/> <taskTypes name=&quot;Input&quot;/> <taskTypes name=&quot;Other&quot;/> <taskTypes name=&quot;Choice 1/n&quot;/> </taskModels> IHM µ i Système Modèle µ Extra-IHM µ i
    91. 91. Taxonomie d’IHM <ul><li>Extra-IHM </li></ul>IHM µ i Système Modèle µ Extra-IHM µ i
    92. 92. Taxonomie d’IHM <ul><li>Meta-IHM </li></ul>Metamodèle χ Meta-IHM µ i IHM µ i Système Modèle µ Extra-IHM µ i
    93. 93. Taxonomie d’IHM <ul><li>Meta-IHM </li></ul>Metamodèle χ Meta-IHM µ i IHM µ i Système Modèle µ Extra-IHM µ i
    94. 94. Taxonomie d’IHM <ul><li>Meta-IHM </li></ul>Metamodèle χ Meta-IHM µ i IHM µ i Système Modèle µ Extra-IHM µ i
    95. 95. Taxonomie d’IHM <ul><li>Trans-IHM </li></ul><ul><ul><li>IHM de transformation de modèles </li></ul></ul>Metamodèle Metamodèle T µ Trans-IHM µ i Modèle Transformation
    96. 96. Taxonomie d’IHM <ul><li>Définition d’une trans-IHM </li></ul><ul><ul><li>IHM de transformation entre modèles </li></ul></ul>Metamodèle Metamodèle T µ Trans-IHM µ i Modèle Transformation
    97. 97. Taxonomie d’IHM <ul><li>Définition d’une trans-IHM </li></ul><ul><ul><li>IHM de transformation entre modèles </li></ul></ul>Metamodèle Metamodèle τ µ Trans-IHM µ i Modèle Transformation
    98. 98. Taxonomie d’IHM <ul><li>Définition d’une trans-IHM </li></ul><ul><ul><li>IHM de transformation entre modèles </li></ul></ul>Metamodèle Metamodèle T µ Trans-IHM µ i Modèle Transformation
    99. 99. Taxonomie d’IHM <ul><li>Définition d’une trans-IHM </li></ul><ul><ul><li>IHM de transformation entre modèles </li></ul></ul>Metamodèle Metamodèle τ µ Trans-IHM µ i Modèle Transformation
    100. 100. Megamodèle pour les IHM τ MetaModèle Tâche Modèle Tâche Extra-IHM (Concepteur) Meta-IHM (linguiste) Modèle interacteur T χ µi µi IHM (utilisateur final) µ Modèle transformation µ Trans-IHM (Ingénieur) µi Extra-IHM (utilisateur) µi MetaModèle Interacteur χ Trans-IHM (Installateur) µi Meta-IHM (Etudiant) µi
    101. 101. Megamodèle pour les IHM MetaModèle Tâche Modèle Tâche Extra-IHM (Concepteur) Meta-IHM (linguiste) Modèle interacteur τ χ µi µi IHM (utilisateur final) µ Modèle transformation µ Trans-IHM (Ingénieur) µi Extra-IHM (utilisateur) µi MetaModèle Interacteur χ Trans-IHM (Installateur) µi Meta-IHM (Etudiant) µi
    102. 102. Megamodèle pour les IHM MetaModèle Tâche Modèle Tâche Extra-IHM (Concepteur) Meta-IHM (linguiste) Modèle interacteur τ χ µi µi IHM (utilisateur final) µ Modèle transformation µ Trans-IHM (Ingénieur) µi Extra-IHM (utilisateur) µi MetaModèle Interacteur χ Trans-IHM (Installateur) µi Meta-IHM (Etudiant) µi
    103. 103. Megamodèle pour les IHM MetaModèle Tâche Modèle Tâche Extra-IHM (Concepteur) Meta-IHM (linguiste) Modèle interacteur τ χ µi µi IHM (utilisateur final) µ Modèle transformation µ Trans-IHM (Ingénieur) µi Extra-IHM (utilisateur) µi MetaModèle Interacteur χ Trans-IHM (Installateur) µi Meta-IHM (Etudiant) µi
    104. 104. Mega-IHM
    105. 105. Synthèse : Mega-IHM <ul><li>Modèles observables et manipulables </li></ul><ul><li> concepteur et/ou utilisateur </li></ul><ul><li>Syntaxe abstraite versus concrète : </li></ul><ul><li>machines versus humains </li></ul><ul><li>Taxonomie d’IHM </li></ul><ul><li>Mega-IHM pour « tout » contrôler  </li></ul>
    106. 106. Synthèse : Mega-IHM <ul><li>Modèles observables et manipulables </li></ul><ul><li> concepteur et/ou utilisateur </li></ul><ul><li>Syntaxe abstraite versus concrète : </li></ul><ul><li>machines versus humains </li></ul><ul><li>Taxonomie d’IHM </li></ul><ul><li>Mega-IHM pour « tout » contrôler  </li></ul><ul><ul><li>Uniquement dans un contexte local </li></ul></ul>
    107. 107. Plan <ul><li>Ingénierie Dirigée par les Modèles : megamodèle </li></ul><ul><li>Système : Malléabilité des IHM </li></ul><ul><li>Développement : Mega-IHM </li></ul><ul><li>Domaine : Cartographie </li></ul><ul><li>Conclusion </li></ul>
    108. 108. Ponts entre outils ?
    109. 109. Ponts entre outils Extra-IHM (Concepteur) µi MetaModèle Tâche Modèle Tâche Extra-IHM (Concepteur) Meta-IHM (linguiste) Modèle interacteur τ χ µi µi IHM (utilisateur final) µ Modèle transformation µ Trans-IHM (Ingénieur) µi Extra-IHM (utilisateur) µi χ i χ i MetaModèle Interacteur χ Trans-IHM (Installateur) µi Meta-IHM (Etudiant) µi MetaModèle Tâche Modèle Tâche Extra-IHM (Concepteur) Modèle IUA τ χ µi Modèle transformation µ MetaModèle Interacteur χ
    110. 110. Ponts entre outils MetaModèle Tâche MetaModèle Tâche
    111. 111. Ponts entre outils MetaModèle Tâche MetaModèle Tâche
    112. 112. Cartographie
    113. 113. Cartographie
    114. 114. Cartographie
    115. 115. Cartographie
    116. 116. Cartographie
    117. 117. Cartographie : Evolution Dialogue Graph DiaTask V1.0 -8 Before DiaTask 1996 2004 2005
    118. 118. Synthèse : cartographie <ul><li>Megamodèle pour les domaines </li></ul><ul><ul><li>recherche </li></ul></ul><ul><ul><li>industrie </li></ul></ul><ul><li>Cartographie </li></ul><ul><ul><li>opérationnelle </li></ul></ul><ul><ul><li>communicationnelle </li></ul></ul><ul><li>Evolution des connaissances </li></ul>
    119. 119. Plan <ul><li>Ingénierie Dirigée par les Modèles </li></ul><ul><li>Malléabilité des IHM </li></ul><ul><li>Mega-IHM & megamodèle pour tout représenter et rendre accessible </li></ul><ul><li>Cartographie (megamodèle) pour les IHM </li></ul><ul><li>Conclusion </li></ul>
    120. 120. En résumé <ul><li>Problème : la complexité pour le concepteur </li></ul><ul><li>Approche suivie : l’IDM et megamodèle </li></ul><ul><li>Megamodèle utilisé à 3 niveaux </li></ul><ul><ul><li>Système </li></ul></ul><ul><ul><li>Développement </li></ul></ul><ul><ul><li>Domaine </li></ul></ul>
    121. 121. Contributions - Système <ul><li>Megamodèle pour identifier les points de malléabilité </li></ul><ul><li>Conservation des modèles à l’exécution </li></ul><ul><li>Démonstrateur MARA </li></ul><ul><li>Manipulation des représentations : </li></ul><ul><li>manipuler la réalité = malléabilité </li></ul><ul><ul><li>(Vidéo) </li></ul></ul>
    122. 122. Contributions– Développement <ul><li>Taxonomie des IHM orientées modèles </li></ul><ul><ul><li>Extra-IHM </li></ul></ul><ul><ul><li>Meta-IHM </li></ul></ul><ul><ul><li>Trans-IHM </li></ul></ul><ul><li>Capitalisation des modèles, metamodèles et transformations </li></ul><ul><li>Organisation de ces savoirs et savoir-faire </li></ul>
    123. 123. (Meta)contribution– Domaine <ul><li>Megamodèle pour la cartographie </li></ul><ul><ul><li>Situer les contributions </li></ul></ul><ul><ul><li>Les comparer </li></ul></ul><ul><ul><li>Tracer les évolutions </li></ul></ul><ul><ul><li>Réutiliser et intégrer </li></ul></ul><ul><li>Etat de l’art dirigé par les metamodèles </li></ul>
    124. 124. Perspectives <ul><li>Etendre l’ensemble des metamodèles </li></ul><ul><ul><li>Ergonomie </li></ul></ul><ul><ul><li>Techniques d’interaction </li></ul></ul><ul><ul><li>Plasticité : modèles de contexte et d’évolution </li></ul></ul><ul><li>Explorer le concept de mega-IHM et les techniques </li></ul><ul><li>Enseigner de l’IHM et de l’IDM </li></ul><ul><li>Compléter et opérationnaliser la cartographie </li></ul>
    125. 125. Résultats <ul><li>Publications : 14 </li></ul><ul><ul><li>Revues internationales avec comité de lecture : 1 </li></ul></ul><ul><ul><li>Chapitres d'ouvrages : 1 </li></ul></ul><ul><ul><li>Conférences internationales : 4 </li></ul></ul><ul><ul><li>Workshop internationaux : 6 </li></ul></ul><ul><ul><li>Conférences nationales : 2 </li></ul></ul>
    126. 127. Questions?
    127. 128. Comparaison de metamodèles <ul><li>Exemple CTTe </li></ul>
    128. 129. Comparaison de metamodèles <ul><li>Exemple CTTe </li></ul>
    129. 130. Comparaison de metamodèles
    130. 131. Comparaison de metamodèles
    131. 132. Comparaison de metamodèles XML EMF
    132. 133. Démonstrateur MARA <ul><li>Apports technologiques </li></ul><ul><ul><li>ATL sous forme de « bundle » OSGI </li></ul></ul><ul><ul><li>Metamodèles et modèles en EMF </li></ul></ul><ul><ul><li>Une infrastructure / d’interprétation de modèles à l’exécution </li></ul></ul><ul><li>Apports conceptuels </li></ul><ul><ul><li>Catalogue de modèles, metamodèles et de transformations </li></ul></ul><ul><ul><li>Megamodèle explicite et opérationnel. </li></ul></ul>
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×