Page 1

Travail Personnel Encadré – Rapport final

2010

Institut de la Francophonie pour l’Informatique

Rapport final

Travail Personnel Encadré

Étude des Outils de Modélisation Graphique Collaborative – Application à la modélisation des comportements d'agents

Encadrement : Benoit Gaudou (UMI 209 UMMISCO - IFI) Ho Tuong Vinh (UMI 209 UMMISCO – IFI) Nicolas Marilleau (UMI 209 UMMISCO - IRD) Étudiant : LE Nguyen Tuan Thành Promotion : 15

Hanoï, Juin 2010 1

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

REMERCIEMENTS Je tiens tout d’abord à remercier mes encadrements Benoit Gaudou, Ho Tuong Vinh et Nicolas Marilleau, les professeurs à l’Institut de la Francophonie pour l’Informatique (IFI) et IRD. Ils m’a beaucoup aidé dans la réalisation du TPE. Il m’a aussi donné des reconnaissances de base et des documents nécessaires pour compléter mon TPE. Je tiens aussi remercier mes amis qui m’ont aidé beaucoup à résoudre les problèmes difficiles que j’ai rencontré sur la réalisation du sujet.

2

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

TABLE DES MATIÈRES Chapitre 1. Introduction........................................................................................................................6 1.1 Contexte du travail.....................................................................................................................6 1.2 L'objectif du TPE.......................................................................................................................6 1.3 Organisation du rapport.............................................................................................................7 Chapitre 2. État de l'art.........................................................................................................................8 2.1 Les principales des outils de modélisation graphique collaborative..........................................8 2.2 Les outils disponibles.................................................................................................................8 2.2.1 Analyser des outils de dessin.............................................................................................9 2.2.2 Analyser des tableaux blancs...........................................................................................10 Chapitre 3. Solution proposée............................................................................................................13 3.1 La technologie Flex.................................................................................................................13 3.2 L'outil BeoModeler..................................................................................................................13 3.3 Compléter des manques de BeoModeler.................................................................................15 3.3.1 Les difficultés...................................................................................................................16 3.3.2 Construire un tableau blanc..............................................................................................16 3.3.3 Implémenter la collaboration pour BeoModeler..............................................................18 Chapitre 4. Partie pratique..................................................................................................................20 4.1 Réalisation pratique.................................................................................................................20 4.1.1 Tester dans l'ordinateur local...........................................................................................20 4.1.2 Intégrer le programme en PAMS.....................................................................................22 4.2 Expérimentation.......................................................................................................................23 Chapitre 5. Conclusion et perspectives..............................................................................................26 5.1 Conclusion...............................................................................................................................26 5.2 Perspectives.............................................................................................................................26 Références..........................................................................................................................................27 Appendices.........................................................................................................................................29

3

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

LISTE DES FIGURES Figure 1 : Freestyler Figure 2 : BeoModeler Figure 3 : Le support d'UML Class dans BeoModeler Figure 4 : Le support d'UML Cas d'utilisation dans BeoModeler Figure 5 : Le service collaboratif d'Adobe Figure 6 : La fonction du tableau blanc en utilisant Flex Figure 7 : Le modèle utilisant le protocole HTTP Figure 8 : La collaboration pour BeoModeler Figure 9 : L'interface du programme Figure 10 : Le tableau blanc Figure 11 : La collaboration du tableau blanc Figure 12 : La collaboration de UML Figure 13 : Implémentation dans PAMS Figure 14 : L'erreur du paramètre blendMode Figure 15 : L'erreur quand on modifie un figure

4

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

LISTE DES TABLEAUX Tableau 1: Comparaison des outils de dessin Tableau 2: Comparaison des tableaux blancs

5

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Chapitre 1. Introduction 1.1 Contexte du travail Maintenant, la modélisation et simulation du système complexe est une tâche pluridisciplinaire et collaborative. Chaque projet a besoin de chercheurs, scientifiques dans les domaines différents. Chaque personne a des connaissances dans un domaine spécifique. Donc, la collaboration entre les personnes est très importante pour que l'on peut réaliser un projet avec succès. Le TPE 12, un sujet de développement d'un outil de modélisation graphique collaborative, va peut-être appliquer la modélisation et simulation dans le travail professionnel pour que l'on peut modeler ses idées par un outil commun et puis les partager avec des autres. Par ailleurs, la plate-forme PAMS (Plate-forme collaborative d’Accompagnement à la Modélisation Simulation) qui développée dans l’équipe UMMISCO nous permet de créer des modèles dans les systèmes multi-agents, de les manipuler, de les expérimenter, de les modifier et de les coupler en manière collaborative.554 Les mathématiciens, des modeleurs, des techniciens avec des points de vue, des compétences et des connaissances complémentaires peuvent travailler ensemble dans une interface unique. Ils peuvent utiliser des outils de collaboration afin d'aider efficacement leurs fonctions. Les outils de collaboration en PAMS sont : Blogger, Ressources, Conferencing, Forums, Chatroom, Wiki, Whiteboard. Le tableau blanc (whiteboard) est une excellente idée qui aide des scientifiques, des enseignants pour illustrer leurs concepts, leurs idées clairement et concrètement. Une image = 10.000 mots, on alors comprend un concept, une définition plus facilement quand ils sont présentés par une image ou un modèle que celle par des mots. À partir d'un souhait que l'on voudrait développer un outil informatique pour remplacer les tableaux blancs traditionnels en classe, les outils ayant des fonctions de tableau blanc se développe rapidement. Maintenant, on peut trouver beaucoup de ces outils sont soit des applications de bureau, soit des applications sur le web. La plupart de ces tableaux blancs supportent des fonctions de conception et est collaborative. Le travail à distance, donc la collaboration sont des tendances nécessaires dans le développement de la science, en particulier, dans l'informatique. La collaboration et la coopération nous aident à développer davantage et améliorer nos faiblesses. Par contre, l'outil Whiteboard dans PAMS est simple et n'est pas chargé la collaboration entre des chercheurs. On ne peut pas également ajouter des nouveaux modèles dans d'autres domaines. 1.2 L'objectif du TPE Mon TPE a donc l'objectif de développer un outil de modélisation graphique collaborative pour que des mathématiciens, des concepteurs, des modeleurs et des techniciens peuvent l'utiliser en des étapes différents pour créer les modèles de simulation. Cet outil doit avoir les fonctions de base d'une application du tableau blanc comme : Freehand, Ligne, Figures (Triangle, Cercle, Carré), Texte, Couleur, Undo, Clear. Cet outil doit nous permettre d'ajouter des plugins/templates, des nouveaux modèles qui peuvent être utilisés pour dessiner des modèles dans les domaines différents. Cet outil doit aussi être collaboratif, c'est-à-dire deux personnes peuvent dessiner un modèle ensemble sur deux ordinateurs différents. En particulier, il doit être capable de s'intégrer dans PAMS. Il s'agit donc d'une application web. Ce sont les principales exigences. De plus, on souhaite que cet outil ait des fonctions supplémentaires comme : il peut exporter des modèles aux formats PNG, JPG, JPEG, PDF, il peut corriger automatiquement des figures dans la mode Freehand, il peut faire directement des calculs dans un modèle etc. Travail théorique Mon travail théorique est l'étude de l'art critique des outils graphiques de modélisation : • Étudier des connaissances concernant les domaines comme la modélisation et simulation, le système multi-agents, la théorie de graphique etc. • Étudier l'état de l’art critique des outils graphiques • Apprendre des outils, des logiciels concernés 6

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Travail pratique Après la partie théorique, je vais choisir/créer un ou des outils les plus adaptés à la modélisation collaborative du comportement des agents et les intégrer dans PAMS, permet via une interface web collaborative d’effectuer des simulations multi-agents de manière collaborative : • Créer/choisir un outil de modélisation graphique collaborative • Intégrer ce outil dans PAMS • Expérimenter 1.3 Organisation du rapport Ce rapport est organisée en cinq chapitres qui sont les suivantes : Chapitre 1 : La première partie est une présentation sur le contexte du TPE Chapitre 2 : Cette partie se consacre à l'état de l'art. Je vais parle des outils de modélisation graphique collaborative. Ensuit, je vais présenter quelques outils de dessin et de tableau blanc existant. Je vais alors analyser leurs avantages et leurs faiblesses, comparer un outil à autre pour choisir des caractéristiques appropriées à mes besoins. Chapitre 3 : Dans cette partie, je vais propose une solution à réaliser dans mon TPE. Chapitre 4 : C'est la partie pratique. Je vais tester le programme et donner des résultats obtenus, également des expérimentations Chapitre 5 : Enfin, c'est la conclusion et des perspectives Mots-clés : Modélisation et Simulation, Modélisation Graphique Collaborative, Whiteboard, Plugin, Extension, Addon, Addin.

7

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Chapitre 2. État de l'art 2.1 Les principales des outils de modélisation graphique collaborative La collaboration est un processus visant à partager le travail entre un groupe d’individus qui a un problème commun à résoudre. Chaque membre a un point de vue et une compréhension différente du problème. Ils échangent leurs connaissances et leurs opinions pour résoudre le problème. Un système collaboratif est une infrastructure logicielle qui favorise le travail en collaboratif. Pour cela, il doit fournir une interface partagée permettant la réalisation de tâches communes. Une tâche commune et une interface partagée sont des éléments essentiels pour un système collaboratif. Un outil/système de modélisation graphique collaborative est différente d'un outil/système collaboratif général comme Gdocs de Google. Ce système ne traite pas des textes, il traite des figures graphiques. 2.2 Les outils disponibles Dans le processus du développement un outil de modélisation graphique collaborative, je poursuis deux pistes suivantes : • Analyser les outils de dessins existants et voir comment ils peuvent être modifiés pour ajouter l'aspect collaboratif • Analyser les tableaux blancs collaboratifs et voir comment ils peuvent être modifiés pour ajouter des plugins/templates qui sont des formes de dessin prédéfini. Maintenant, il y a quelques outils de modélisation graphique comme Freestyler, CoolModes de la faculté de génie de l'Université de Duisburg-Essen. Ils permettent aux utilisateurs de dessiner des modèles ou des idées facilement en utilisant la souris ou les formes existantes. FreeStyler est un outil coopératif et interactif de modélisation qui combine des langages graphiques différents et sont utilisés pour structurer le contenu des contributions qui écrites à la main. Les formes prédéfinies sont fournis en représentant les types différents d'entrée. Ils aident à distinguer les éléments différents dans l'élaboration et l'analyse d'une question. Le plugin concept permet d'échanger avec souplesse et d'étendre les palettes.

Figure 1 : Freestyler

8

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Des outils sont peut-être des outils UML ou les outils de l'esprit comme MindTools. On peut utiliser la souris ou peut-être un TouchPen pour dessiner ses modèles. Pour analyser des outils existants concernant la modélisation graphique collaborative, je donne les critères de comparaisons suivantes : 1. Interface web : des outils soutiennent l'interface web ou non. Si un outil soutient l'interface web, on va s'intégrer facilement dans PAMS. 2. Soutenir le plugin : des outils soutiennent des plugins ou non. Un outil qui est un cadre pour des plugins nous permet ajouter des nouveaux modèles. De plus, il est léger et flexible. On peut dans l'autre main supprimer des modèles que l'on ne l'utilise plus. C'est un critère important pour construire l'outil de mon TPE. 3. La richesse des fonctions de dessin : Certains outils soutiennent des nombreuses fonctions de dessin. Mais d'autres sont tout simplement comme l'outil Paint de Microsoft. 4. Soutenir le calcul interne : C'est une fonction avancée. Si un outil soutient des calculs internes, on peut non seulement tirer des modèles, on peut faire des calculs ou expérimenter nos hypothèses directement sur ces modèles. 5. Soutenir la collaboration : Si un outil soutient la collaboration, c'est-à-dire deux personnes peuvent tirer un modèle ensemble sur une seule interface. C'est aussi un critère important pour construire l'outil de mon TPE. 6. Exporter vers d'autres formats comme PNG, JPG, JPEG, PDF … : Quand on finit son modèle, on peut l'exporter vers d'autres formats afin de stocker dans son ordinateur, partager avec des autres ou utiliser dans ses rapports etc. C'est aussi un critère important pour construire l'outil de mon TPE. 7. Corriger automatiquement : c'est -à-dire quand on utilise la fonction Freehand afin de tirer des figures ou des lignes (il est difficile à tirer exactement des bonnes figures par la fonction Freehand), l'outil est donc capable d'identifier son idée et remplacer automatiquement ses figures par des figures appropriés, ce sont peut-être des triangle, des cercles ou des carrés. 8. Soutenir le chat : Le chat est trop populaire maintenant. Si un outil soutient le chat, les utilisateurs peut communiquer quand ils travaillent ensemble. 9. Licence : PAMS est construit sur un logiciel libre Sakai. Je voudrais donc développer un outil de licence GNU/GPL. 10. Système d'exploitation : PAMS est une plate-forme sur le web. Un outil de cross-platforme est nécessaire. 2.2.1 Analyser des outils de dessin Maintenant, il existe de nombreux outils de dessin qui nous permettent de tirer nos idées. La plupart d'entre eux est l'application de bureau. Les outils commercials connus comme CorelDraw, Adobe Flash soutiennent largement les fonctions de dessin. Adobe Flash est un logiciel de création qui oriente les utilisateurs tels que des designers graphiques, des peintres etc. Pour des techniciens, ils peuvent utiliser les outils comme StarUML, Rational Rose, Visio, MindMap, FreeMind etc. Visio et surtout MindMap, FreeMind sont les logiciels généraux qui nous permet de tirer nos idées d'après la méthode Brainstorming. On peut trouver des outils libres (Open-Source) tel que Inkscape qui nous permet de créer des graphiques vectoriels. En 2005, Inkscape a ajouté Inkboard, un tableau blanc XMPP pour permettre à plusieurs utilisateurs d'Inkscape pour collaborer à la messagerie instantanée Jabber / chat environnement. Un autre logiciel libre est Freestyler de la Faculté de génie, Université de Duisburg-Essen [20]. FreeStyler est un outil coopératif et interactif de modélisation qui combine des langages graphiques différents et sont utilisés pour structurer le contenu des contributions qui écrites à la main. Un des outils libres de dessin peut utiliser sur le bureau et également sur le web est BeoModeler [30]. BeoModeler est un outil Web pour dessiner UML. Mais, il peut fonctionner sur le bureau si on s'installe Plash Player d'Adobe. BeoModeler utilise la technique Flex (comme Flash, mais Flex est libre à utiliser – un open-source plate-forme). Il marche bien, mais il ne soutient pas la collaboration entre des individus. 9

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Figure 2 : BeoModeler C'est le tableau de comparaison des outils de dessins existants Adobe Flash

Visio 2007 MindMap

BeoModeler FreeMind Inkscape Freestyler

Interface web

X

Soutenir le plugin

X

La richesse des fonctions de dessin

X

X

X

X

X

X

X

Soutenir le calcul interne

X

Soutenir la collaboration Exporter vers d'autres formats (PNG, JPG, JPEG, PDF ...)

X

Corriger automatiquement

X

X

X

X

X

Soutenir le chat Licence Système d'exploitation

X

X

X

X

X (Jabber) Propriétaire Propriétaire Propriétaire Windows

Windows

Windows

BSD Licence Crossplatforme

GNU/ GPL

GNU/ GPL

GNU/ GPL

CrossCrossCrossplatforme platforme platforme

Tableau 1: Comparaison des outils de dessin 2.2.2 Analyser des tableaux blancs Des logiciels de tableau blanc viennent de l'idée qu'ils aident les étudiants, les professeurs d'apprendre des cours facilement et concrètement. La collaboration est donc une composante obligatoire de ces logiciels. La plupart entre d'eux a l'interface web, c'est-à-dire tout le monde peut 10

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

accéder un site et dessiner es modèles, illustrer des idées ensemble et en realtime. Ces logiciels utilisent presque les techniques comme Flash/Flex, Applet, JavaScript, Ajax afin qu'ils puissent s'intégrer facilement dans un site web. On peut trouver quelques outils de tableaux blancs tel que LucidChart, Twiddla, Daddleboard, Cosketch, WhiteBoardMeeting. WhiteBoardMeeting est un plug-in du logiciel Skype afin d'aider les utilisateurs de Skype à dessiner des modèles ensemble sur un tableau unique. C'est le tableau de comparaison des tableaux existants. LucidChart

Twiddla

Dabbleboard

Cosketch

Interface web

X

X

X

X

Soutenir le plug-in

X

X

La richesse des fonctions de dessin

X

X

WhiteBoardMeeting

Soutenir le calcul interne Soutenir la collaboration

X

X

X

Exporter vers d'autres formats (PNG, JPG, JPEG, PDF ...)

X

X

X

Corriger automatiquement Soutenir le chat Licence Système d'exploitation

X X

X

X X

X

X

X

Propriétaire

Freeware

Shareware

Freeware

Freeware

Crossplatforme

Crossplatforme

Crossplatforme

Crossplatforme

Windows

Tableau 2: Comparaison des tableaux blancs Chaque outil a ses avantages et ses propres faiblesses. • Les outils commercials de dessin comme Adobe Flash et Visio 2007 sont des excellents logiciels pour des designers graphiques ou des peintres avec des riches fonctionnalités. Mais ils utilisent uniquement sous Windows. En outre, ils ne soutiennent pas le plugin, la collaboration et ils sont impossibles à s'intégrer sur le web. • Les outils MS Paint de Microsoft et Cosketch sont simple. Ils ne soutiennent pas le plugin, la collaboration. • L'outil WhiteBoardMeeting est un plugin du logiciel Skype. Il est léger, soutient la collaboration et le chat. Mais il ne soutient pas le plug-in. • Les outils MindMap et FreeMind nous permet de tirer nos idées d'après la méthode Brainstorming avec des riches fonctionnalités. Mais ils ne soutiennent pas le plugin, la collaboration. • L'outil Inkscape nous permet de créer des graphiques vectoriels avec des riches fonctionnalités. Inscape avec Inkboard soutient la collaboration et le chat, mais il ne soutient pas le plug-in. De plus, il est un logiciel du bureau. • L'outil Freestyler soutient le plugin, la collaboration, le chat. En particulier, il soutient des calculs internes. Mais il est un logiciel du bureau. • L'outil Twiddla est un logiciel libre (freeware en anglais) sur le web. Il soutient la collaboration, le chat et l'exportation vers d'autres formats. Mais il ne soutient pas le plugin. • L'outil LucidChart est un logiciel sur le web avec des riches fonctionnalités. Il soutient le plug-in, la collaboration, le chat. Mais il est un logiciel propriétaire. • L'outil Daddleboard est un logiciel shareware sur le web avec des riches fonctionnalités. Il soutient le plugin, la collaboration, le chat. En particulier, il peut corriger automatiquement nos figures. Dans cette étape de mon TPE, l'objectif est d'analyser les outils existants et puis choisir une bonne solution. Pour réaliser un bon outil de tableau blanc, je tiens à coordonner les avantages de ces outils existants. Les outils Freestyler et Daddleboard soutiennent la plupart des fonctionnalités 11

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

d'outil de modélisation graphique collaborative dont j'ai besoin. De plus, ils ont des idées, des fonctions spéciales comme : soutenir le calcul interne ou corriger automatiquement. Ils sont aussi les logiciels de crosse-plateforme. On peut les utiliser légalement pour développer notre outil. À partir de ces avantages, je vais choisir ces outils et combiner leurs fonctionnalités permettant de créer l'outil de mon TPE.

12

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Chapitre 3. Solution proposée Pour accomplir l'objectif de mon TPE : développer un outil de modélisation graphique collaborative, j'ai suivi la première approche : analyser les outils de dessins existants et voir comment ils peuvent être modifiés pour ajouter l'aspect collaboratif. En détail, j'ai utilisé l'outil open-source BeoModeler, l'analysé et le modifié pour ajouter l'aspect collaboratif. BeoModeler est un outil Web pour dessiner UML. Il est déjà un outil de modélisation graphique. Cet outil nous permet de dessiner des modèles UML. Il peut exporter des modèles aux formats PNG, JPG, JPEG, PDF. On peut ajouter des plugins/templates, des nouveaux modèles dans les domaines différents. Mais cet outil manque les fonctions de base d'une application du tableau blanc comme : Freehand, Ligne, Figures (Triangle, Cercle, Carré), Texte, Couleur, Undo, Clear. En particulier, BeoModeler n'est pas un outil de modélisation collaborative en temps réel (on peut sauver des modèles dans un ordinateur et les ouvrir pour modifier dans autre ordinateur). Je vais donc compléter ses manques. Cet outil utilise la technologie Flex, il est alors une application web par défaut. Il est donc capable de s'intégrer dans PAMS. 3.1 La technologie Flex Maintenant, l'application web est très populaire et peu à peu important dans le développement de Internet. Ces applications vont remplacer des applications de bureau dans la future. La puissance de ordinateurs et web browsers faire des applications webs devenir d'être populaire. On peut calculer directement sur le web, pas seulement dans l'ordinateur local. Beaucoup des techniques webs sont inventées. HTML, Applet, Ajax, Javascript et Flash sont utilisés pour créer des applications webs. Tout récemment, Flex est représenté comme une nouvelle technique. Flex est une solution du développement créé par Macromedia en 2004 puis reprise par Adobe en 2006, permettant de créer et de déployer des applications Internet riches (RIA) multi plates-formes grâce à la technologie Flash et particulièrement son lecteur. Son modèle de programmation fait appel à MXML (basé sur XML) et ActionScript 3.0, reposant sur ECMAScript. La technologie Flex produit un fichier .swf intégré dans une page html. La richesse de l'interface graphique ainsi générée a le désavantage comme toutes applets de générer ici un fichier .swf sur le serveur un peu long à télécharger dans le poste client lors du chargement de la page. 3.2 L'outil BeoModeler L'outil BeoModeler se compose de deux parties : une partie pour des clients et une partie pour le serveur. Le serveur est peut-être Red5 ou Apache-Tomcat. Sa courante version est 1.0.29 Ses caractéristiques • Open Source Modeler • 100% Web • RIA • Convivialité • Très rapide, fait pour la vitesse • Exporter et importer à partir d'IBM Rational RSA / RSM et TopCased • UML 2.1 Le support d'UML • Cas d'utilisation • Object • Class • Package • Interaction (Collaboration)

13

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Voici l'interface du programme avec les schémas Classe et Cas d'utilisation

Figure 3 : Le support d'UML Class dans BeoModeler

Figure 4 : Le support d'UML Cas d'utilisation dans BeoModeler On peut voir que le programme se compose de 4 parties : 1. Le menu des icônes avec 4 icônes (à gauche, au-dessus):

14

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final •

Créer un nouveau schéma

Ouvrir un schéma existant (dans local ou sur le serveur)

Enregistrer le schéma courant

Quitter le schéma courant

2010

2. La panneau UML Tool (à gauche, justement en arrière des icônes de menu) 3. Treeview (à gauche, justement en arrière de la panneau UML Tool) 4. La zone du travail (au centre, la plus grande partie) Quand un utilisateur compléte son diagramme, il peut l'enregister sur le serveur sous le format XMI. Voici l'exemple du fichier représentant un diagramme <beoproject name="Project1"> <beodiagram name="Diagram0" id="BEO-72EA-A5E5-8BE0C8DD" type="Uml"/> <uml:Model xmi:version="2.1" xmi:id="BEO-72EA-A5E5-8BE0C8DD" name="Diagram0" xmlns:xmi="http://schema.omg.org/spec/XMI/2.1" xmlns:uml="http://www.eclipse.org/uml2/2.1.0/UML"> <packagedElement xmi:id="BEO-63EE-C215-8BE0D60C" name="class0" xmi:type="uml:Class" visibility="public"> <generalization xmi:id="BEO-92F6-CA00-8D9B95CC" xmi:type="uml:Generalization" general="BEO-2757-021F-8D9ADD59"/> </packagedElement> <packagedElement xmi:id="BEO-2757-021F-8D9ADD59" name="class2" xmi:type="uml:Class" visibility="public"/> <beoProperties> <beoObject id="BEO-63EE-C215-8BE0D60C" width="368" height="331" x="907" y="1075" z="1" backgroundColor="16013056"/> <beoObject id="BEO-2757-021F-8D9ADD59" width="235" height="220" x="1434" y="1052" z="0" backgroundColor="16013056"/> <beoObject id="BEO-92F6-CA00-8D9B95CC" backgroundColor="0" middlePointX="1381" middlePointY="1319" linkNumber="1"/> <beoDesignArea hScrollPosition="990.5" vScrollPosition="1013"/> </beoProperties> </uml:Model> </beoproject> Le nom du projet est Project1. Ce projet contient un diagramme qui appelle Diagram0. Dans ce diagramme, on défini des packages et la relations entre ces packages. Ensuite, on défini des propriétés pour chaque élément dans le diagramme 3.3 Compléter des manques de BeoModeler Pour avoir un outil de modélisation graphique collaborative, nous devons compléter deux manques principals de BeoModeler : construire un tableau blanc et implémenter la collaboration. Dans cette partie, nous allons analyser des techniques 15

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

3.3.1 Les difficultés Dans le développement d'un outil de modélisation graphique collaborative, nous choisissons l'outil BeoModeler. Cet outil est un outil de dessin. Malgré il est une application web (car il est écrit par Flex), il n'est pas un tableau blanc. Son but est de développer un outil pour dessiner des schémas UML. Il oriente de construire une bibliothèque de dessiner des schémas UML. Il n'oriente pas le tableau blanc ou la collaboration. Il y a quelques façons pour construis un tableau blanc. On peut utiliser Applet ou Flash/Flex pour construire un tableau blanc. Par ailleurs, on voudrait également que des utilisateurs peuvent utiliser ce tableau pour travailler ensemble. Flash/Flex est donc plus approprié. Le manque de la collaboration est grave, car cet outil est une application web. Maintenant, on travaille sur le web ensemble pour partager ses idées, pour s'aider mutuellement. La puissance de la collaboration est magnifique. La difficulté est comment on implémente la collaboration dans un programme qui ne le supporte pas. Une autre difficulté est que le tableau blanc et la collaboration suivent deux directions différentes, donc il est difficile à combiner deux parties. PAMS est une plate-forme qui développe à partir de SAKAI, utilise les vieux techniques. Elle demande d'utiliser la version jdk1.5.0_19 et apache-tomcat-5.5.27. De plus, elle contient quelques erreurs. La différence entre les versions (Java et Tomcat) utilisant dans PAMS et BeoModeler fait s'installer BeoModeler en PAMS difficile. 3.3.2 Construire un tableau blanc Pour construire la fonction du tableau blanc, j'ai utilisé le service Adobe Livecycle Collaboration Server d'Adobe. J'ai créé un compte-rendu (account) dans ce portal et deux Room : myfirstroom et tpe12. Ces Rooms sont utilisés pour la collaboration entre des individus. Le tableau blanc est écrit par MXML et le code pour connecter au serveur d'Adobe est comme : <rtc:AdobeHSAuthenticator id="auth" userName="daidungsi@yahoo.com" password="loveHien92" /> <rtc:ConnectSessionContainer id="sess" authenticator="{auth}" width="100%" height="100%" roomURL="https://connectnow.acrobat.com/daidungsi/tpe12"> Ici, nous utilisons AdobeHSAuthenticateur pour identifier un compte-rendu. On doit spécifier le nom du compte-rendu et son mot de passe. On doit également indiquer l'adresse de l'espace connecté (https://connectnow.acrobat.com/daidungsi/tpe12). Quand une personne veut utiliser le tableau blanc pour dessiner son idée, elle ouvre cet outil que j'ai ajouté dans BeoModeler. Cet outil soutient quelques fonctionnalités d'un tableau blanc comme : Freehand, Ligne, Figures (Triangle, Cercle, Carré), Texte, Couleur, Undo, Clear. Chaque fois, lorsque l'on ouvre cet outil, il va connecter à le Room tpe12 dans le serveur d'Adobe. Deux personnes peuvent donc utiliser le service de la collaboration en temps réel pour travailler ensemble.

16

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Figure 5 : Le service collaboratif d'Adobe

Figure 6 : La fonction du tableau blanc en utilisant Flex 17

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

3.3.3 Implémenter la collaboration pour BeoModeler Il y a deux approches pour compléter à ajouter la collaboration pour BeoModeler. 1. Quand deux utilisateurs travaillent sur même fichier dans le serveur (ils ouvrent même fichier), chaque 10 seconds, par exemple, on va enregistrer l'état courant sur ce fichier et chaque 12 seconds, par exemple, on va ouvrir ce fichier pour mettre à jour des changements. Cette approche est simple et on a besoin de modifier seulement le code source du client de BeoModeler. 2. On modifie le code source du serveur de BeoModeler pour qu'il peut fonctionner comme un serveur de Red5 (maintenant, le serveur BeoModeler utilise le protocole HTTP, pas le protocole de Red5). On doit également modifier le code source du client de BeoModeler pour qu'il peut contacter avec la nouvelle version du serveur. Car un serveur Red5 soutient la collaboration en temps réel par défaut, on n'a pas besoin d'implémenter le code pour la collaboration dans le client comme la première approche. Cette approche est plus complexe que la première. Pour simplement, je choisis la première approche : implémenter la fonction de la collaboration dans le client en utilisant le protocole HTTP.

Figure 7 : Le modèle utilisant le protocole HTTP

18

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Figure 8 : La collaboration pour BeoModeler Le mécanisme de la collaboration est importante. Une approche populaire est qu'un utilisateur crée une session de travail dans le serveur. Il va ensuite envoyer un émail d'invitation aux autre utilisateurs. Les autres peuvent participer cette session ou non par cliquer sur le lien dans leur boite de réception. Pour faire ca, chaque utilisateur a un espace (un compte-rendu) sur le serveur. Dans notre cas, on n'identifie pas des utilisateurs. Il n'y a pas des compte-rendus sur le serveur. Le serveur stocke seulement des fichiers de schéma UML et des images exportées. Un utilisateur peut participer de dessiner des schémas librement par ouvrir le même fichier sur le serveur.

19

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Chapitre 4. Partie pratique Dans ce chapitre, nous allons faire des tests et donner des expérimentations, des résultats pour analyser notre programme, choisir des bons paramètres 4.1 Réalisation pratique Pour analyser le programme, j'ai testé le tableau blanc et la collaboration dans mon ordinateur, puis j'ai installé dans PAMS 4.1.1 Tester dans l'ordinateur local BeoModeler se compose de deux parties : un serveur pour stocker des fichiers du schéma, des images exportées (PNG) Dans mon ordinateur, j'utilise les serveurs Apache-Tomcat 6.0.26 et Red5. Pour tester avec le serveur Tomcat, on met le fichier beomodelerserver.war dans le dossier webapps de Tomcat et met le fichier crossdomain.xml dans le dossier ROOT de Tomcat J'utilise la porte du serveur est 8586 (par défaut 8080), je dois changer le fichier config/config_[VESION].xml pour mettre à jour cette porte. Pour tester avec le server Red5, on met également le fichier beomodelerserver.war dans le dossier webapps de Red5 Après voir configurer le serveur et le client, on doit simplement cliquer sur le fichier BeoModeler.html pour afficher le programme. Voici l'interface du programme

Figure 9 : L'interface du programme J'ai ajouté une icône pour le tableau blanc sur le menu des icônes (la cinquième icône). Ici on est en train d'ouvrir un fichier du schéma sur le serveur (Tomcat/Red5) ou dans l'ordinateur local. Quand on clique sur l'icône du tableau blanc, le programme affiche le tableau blanc et connecte à le serveur d'Adobe pour obtenir des configurations. Il fait quelques secondes selon la vitesse du réseau Voici des figures que des utilisateurs en train de dessiner et sont stockées sur un espace dans le serveur d'Adobe.

20

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Figure 10 : Le tableau blanc Il y a 3 parties principales : le palette des outils (on peut le déplacer), le zone du travail (WorkArea) et le zone des propriétés. C'est des composantes nécessaires d'un tableau blanc. Pour tester la collaboration du tableau blanc, j'ai ouvert deux fenêtres, c'est-à-dire deux utilisateurs dessinent des figures ensemble. Quand un utilisateur change un figure ou crée un nouveau figure, le changement va mettre à jour dans l'écran d'autre utilisateur. Le délai pour le changement est petit. On peut connaître quel utilisateur est en train de modifier, son nom va afficher dans l'écran des autres utilisateurs

Figure 11 : La collaboration du tableau blanc 21

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Après je va tester la collaboration entre deux utilisateurs quand ils dessinent un fichier du schéma ensemble dans le serveur. Deux utilisateurs ouvrent même fichier dans le serveur. Le temps qu'un utilisateur participent de dessiner n'est pas important. Il peut participer le travail n'importe quand.

Figure 12 : La collaboration de UML Ici, on peut voir que l'utilisateur à gauche modifie le ligne de la relation entre deux classes. Ce changement va enregistrer automatiquement dans le fichier de schéma sur le serveur (le programme va enregistrer automatiquement chaque 12s si il y a des changements). Après quelques secondes, le changement dans l'écran à gauche va mettre à jour dans l'écran à droit. 4.1.2 Intégrer le programme en PAMS L'objectif de ce TPE est de développer un outil de modélisation graphique collaborative pour la plate-forme PAMS. L'implémentation dans PAM est un devoir obligatoire. Pour effacer le conflit entre la différence de la version de PAMS et BeoModeler, j'ai utilisé un autre serveur Tomcat pour BeoModeler. Le client de BeoModeler est mis dans même ordinateur de PAMS. On modifie le fichier webapps/pams-groupware-0.1/conferenMain.jsp pour ajouter le client de BeoModeler dans PAMS. On va créer un popup pour ce client.

22

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Figure 13 : Implémentation dans PAMS L'icône noir à droit est pour ouvrir notre programme. Quand on clique sur cet icône, le programme va afficher un popup. J'ai testé le tableau blanc et la collaboration entre deux utilisateurs. Le programme marche comme dans l'ordinateur local. 4.2 Expérimentation Cet outil peut marcher sur Windows et Linux, car il est une application web. Nous avons testés ce programme sur les web browsers différents : Firefox et Chrome. Il marche normalement. Le problème est la compatibilité de Flash Player (sa version) avec chaque web browser dans chaque système d'exploitation. La sécurité implémentée dans Flash Flayer peut empêcher notre programme. On doit configurer son Flash Player afin qu'il puisse accès de vos ressources locales par ajouter le dossier qui contient le client de BeoModeler dans la page web Flash Player Configuration Manager d'Adobe Pour trouver le bon paramètre de temps autosave et autoload, j'ai testé avec la durée 5s, 10s, 15s, 20s, 25s et 30s. Il y a toujours la perte de données. Les paramètres : 10s pour enregistrer automatiquement et 12s pour mettre à jour sont assez bons. Ils ne sont pas long et ils balancent entre le temps pour autosave/autoload et la perte de données. Si il y a plusieurs utilisateurs connectés, la probabilité de la perte de données est élevée. Si le temps entre deux actions consécutives est petit, la probabilité de la perte de données est élevée. De plus, car notre tableau blanc dépend le serveur d'Adobe, le temps pour connecter à ce serveur est assez long dans des ordinateurs testés. Malgré notre programme (tous les deux : tableau blanc et schéma UML) ne limite pas le nombre de clients connectés, si le nombre d'utilisateurs connectés est élevé, il y a des erreurs de synchronisation entre des utilisateurs. Des figures n'affichent pas correctement dans la zone de travail. Quand des figures sont enregistrés sur le serveur, la structure du fichier de schéma est détruit et on ne l'utilise encore. C'est les défauts en utilisant le protocole HTTP pour réaliser la collaboration. La perte de données ne détruit pas la structure du fichier dans le serveur, mais l'utilisateur doit refaire son travail. Cette perte apparaît quand le changement qu'un utilisateur fait n'enregistre encore sur le serveur et dans ce temps le programme met à jour automatiquement la vieille version du fichier. Il faut donc

23

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

enregistrer manuellement chaque changement par cliquer sur l'icône de sauvegarde dans le menu des icônes. Un autre erreur est que la version de Java et Tomcat utilisant dans PAMS et BeoModeler sont différentes. Le serveur testé de PAMS donc ne fonctionne pas le fichier beomodelerserver.war Je donne ici deux erreurs qui je les rencontre souvent quand je fais des tests dans l'ordinateur local

Figure 14 : L'erreur du paramètre blendMode Cet erreur apparaît quand on modifie un texte comme le nom d'un classe, d'un package, des commentaires etc.

Figure 15 : L'erreur quand on modifie un figure

24

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Cet erreur apparaît quand on modifie un figure dans le digramme à gauche et dans ce temps, le programme fait enregister ou mettre à jour automatiquement. Le programme va afficher des figures incorrectement. Mais l'information stockée sur le serveur de ce schéma est encore correct.

25

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Chapitre 5. Conclusion et perspectives 5.1 Conclusion Dans le travail pour compléter le TPE, j'ai construit un outil de modélisation graphique collaborative avec plein de fonctionnalités. J'ai implémenté la collaboration pour un outil de dessin existant BeoModeler. De plus, j'ai ajouté le tableau blanc qui manque dans cet outil. J'ai ensuite évalué la performance du programme neuf dans l'ordinateur local et dans le serveur testé PAMS. Le résultat obtenu est assez bon, mais il reste beaucoup de choses à faire. Premièrement, le tableau blanc dépend le serveur d'Adobe. Tous les utilisateurs vont connecter à un espace dans ce serveur. L'information et la configuration du tableau blanc sont enregistrées dans ce serveur. L'utilisateur n'est pas capable de créer une nouvelle session. L'espace de travail est fixé. Quand un utilisateur voudrait créer un nouveau schéma, il doit effacer tout dans le tableau blanc. On ne peut pas restaurer le schéma précédent. Il faut utiliser un serveur local, on peut donc contrôler toutes les actions, les configurations dans le serveur local. La façon que des utilisateurs travaillent ensemble n'est pas également bon. Il faut créer des compte-rendu pour chaque utilisateur dans notre serveur. Deuxièmement, la collaboration de dessiner des schémas UML ne marche pas bien. Il y a des erreurs : les erreurs de Flash Player (il faut mettre à jour la nouvelle version de Flash Player, la version courante est 10), les erreurs du programme originaire BeoModeler (ils apparaissent souvent quand on modifie un texte dans le schéma UML), les erreurs du mécanisme autosave/autoload en utilisant le protocole HTTP. De plus, il n'y a pas connexion entre des clients (seulement la connexion client-serveur) et on ne sait pas combien de clients connectés et quel client est en train de modifier le schéma. Troisièmement, il n'y pas la relation entre la partie du tableau blanc et la partie de dessiner des schémas UML. Nous utilisons deux protocoles différents, deux serveurs différents Finalement, le mécanisme de travail n'est pas bon. Maintenant, quand un utilisateur connecte à le serveur, le serveur va envoyer tous les fichiers stockés à cet utilisateur. Ensuite, l'utilisateur va choisir un des fichiers pour travailler. Il peut également créer un nouveau schéma, puis enregistrer ce schéma sur le serveur pour que des autres utilisateurs peuvent le voir. Un utilisateur peut voir tous les fichiers dans le serveur, c'est pas intelligent. On voudrait un mécanisme plus raisonnable. Quand un utilisateur crée un schéma, il veut partager son travail avec quelques utilisateurs, pas tout le monde. Il va donc envoyer un émail qui contient l'adresse de son schéma à des utilisateurs qu'il veut travailler ensemble. Seulement des utilisateurs invités peuvent voir ce schéma. 5.2 Perspectives Pour combattre le problème de la collaboration des schémas UML, il faut suivre la deuxième approche : utiliser le protocole de Red5 qui supporte la collaboration par défaut. De plus, notre programme soutient maintenant des schémas UML, il faut modifier le code de BeoModeler pour ajouter des autres modèles. Le problème du serveur d'Adobe et la relation entre le tableau blanc et la partie de dessiner des schémas UML, on peut les résoudre par changer à utiliser un serveur local. Pour identifier des utilisateurs, on peut utiliser des comptes-rendus de PAMS. Chaque utilisateur a une espace privé et quand il crée un schéma par BeoModeler, il peut partager ce schéma avec des autres par envoyer un émail (il y a une composante du courriel dans PAMS)

26

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Références [1]

Benoit Gaudou, Ho Tuong Vinh, Nicolas Marilleau. Introduce collaboration in methodologies of modeling and simulation of Complex Systems. INCOS'09. 2009.

[2]

A. Giemza, S. Ziebarth. Overview of the freestyler modeling environment. Collide, University of DuisburgEssen, Tech. Rep., 2008.

[3]

Niels Pinkwart. Collaborative Modeling in Graph Based Environments. PhD Thesis, Université DuisburgEssen, 2005

[4]

Trong Khanh Nguyen, Benoit Gaudou, Tuong Vinh Ho, Nicolas Marilleau. Application of PAMS Collaboration Platform to Simulation-Based Researches in Soil Science: The Case of the MIcro-ORganism Project. IEEE-RIVF International Conference on Computing and Telecommunication Technologies (IEEERIVF 09), Da Nang City, Viet Nam, 2009

[5]

Trong Khanh Nguyen, Nicolas Marilleau, Tuong Vinh Ho. PAMS – A New Collaborative Framework for Agent-Based Simulation of Complex Systems

[6]

Trong Khanh Nguyen. PAMS-Plateforme collaborative pour la modélisation et simulation. Rapport de Master II, 2008

[7]

Jacques Gignoux. Standard for ecological model description in 3Worlds. Rapport, Mars 2009

[8]

Péter Domokos, Dániel Varró. An Open Visualisation Framework for Metamode-Based Modeling Languages. GraBaTs'02 Preliminary Version

[9]

Annie Corbel, Philippe Jaillon, Xavier Serpaggi, Michael Baker, Mathieu Quignard, Kristine Lund, Arnaud Séjourné. DREW : Un outil Internet pour créer des situations d’apprentissage coopérant

[10]

Annie Corbel, Jean-Jacques Girardot, Philippe Jaillon. DREW: a dialogical reasoning web tool

[11]

DREW Web Site. http://drew.emse.fr/

[12]

Collide,

Faculté

de

génie,

Université

de

Duisburg-Essen.

Cool

Modes.

http://www.collide.info/index.php/Cool_Modes [13]

Edutech Wiki. CoolModes. http://edutechwiki.unige.ch/en/Cool_Modes

[14]

Collide, Faculté de génie, Université de Duisburg-Essen. Freestyler.

http://www.collide.info/index.php/FreeStyler [15]

Edutech Wiki. Freestyler. http://edutechwiki.unige.ch/en/Freestyler

[16]

Laboratoires de la collaboration d'Europe. http://www.co-lab.nl/index.html.

[17]

Belvedere Knowledge Mapping. http://sourceforge.net/projects/belvedere/

[18]

Institut

für

Arbeitswissenschaft.

Mardi 2006

SeeMe

Method.

http://www.imtmiaw.rub.de/projekte/seeme/methode/index.html.en. 27 Octobre 2009 [19]

Cosketch Beta. http://cosketch.com/

[20]

Inkscape. http://www.inkscape.org/?lang=fr

[21]

Cosketch Beta. http://cosketch.com/

[22]

Dabbleboard http://www.dabbleboard.com/

[23]

Twiddla http://www.twiddla.com/Home.aspx

[24]

Wiki Plug-in (computing) : http://en.wikipedia.org/wiki/Plugins

[25]

Wiki Software extension : http://en.wikipedia.org/wiki/Extension_(computing)

[26]

Wiki Plugin : http://fr.wikipedia.org/wiki/Plugin

[27]

Java Plug-in Framework (JPF) : http://jpf.sourceforge.net/

[28]

HiveBoard :

[29]

CoolCollaborator : http://coolcollaborator.org

27

http://hiveboard.sourceforge.net

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final [30]

28

2010

BeoModeler : http://www.beotic.org/us/projects/beomodeler/index.php

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Appendices Des fonctionnalités de BeoModeler • Raccourcis • Les icônes de menu • Le panneau UML Tool • Le panneau Use Case Tool • Le panneau Collaboration Tool • Propriétés • Miniview • Treeview 1. Raccourcis Pour créer un objet, cliquez sur la zone de travail et passer à la dimension désirée. Pour créer un lien, cliquez la souris sur la première case et rejetez la souris sur la deuxième case. • Cliquez + déplacer la souris dans la mode de sélection sur la feuille de calcul: déplacer la feuille de calcul • Cliquez simplement sur arrière-plan dans la mode de création: Passer en mode de sélection (activation de la sélection d'un outil). • Double-cliquez sur la boîte ou un lien: switch pour renommer le mode de l'objet / modifier l'objet. CTRL + N Créez un nouveau projet / schéma. CTRL + O Ouvrir un projet. CTRL + S Enregistrez le projet. CTRL + A Sélectionner tous les objets. CTRL + C Copier les objets sélectionnés. CTRL + V Coller les objets sélectionnés. CTRL + M Afficher / Masquer MiniView. CTRL + Z Annuler / Refaire la dernière action. CTRL + SPACE Afficher / Masquer la boîte de propriétés. CTRL + ALT + P Exporter le schéma au format d'image. F2 Renommer l'objet sélectionné / Modifier l'objet sélectionné. DEL Drop les objets sélectionnés. ESCAPE Drop de l'objet courant créé (case / lien / élément dans la boîte). CTRL dans la Switch à la mode de sélection (activation de la sélection d'un outil). mode de création F2 (Dans classe) Modifier l'élément sélectionné. ESCAPE (Dans Supprimer l'élément courant ajouté. classe) DEL (Dans classe) Supprimer l'élément sélectionné. 2. Les icônes de menu

Créez un nouveau projet / schéma.

29

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Le projet peut être créé sur le serveur ou sur le système local. Trois types de graphique sont disponibles: diagramme de classes, diagramme de cas d'utilisation et diagramme de collaboration. Si le projet existe déjà, le nouveau diagramme sera créé en elle. Ouvrir/Importer un projet.

Ouvrir un projet ou importer un fichier dans le projet actuel soit à partir du serveur ou de système de fichier local.

Lorsque Import est cochée, le fichier est importé dans le projet actuel. Sinon, un nouveau projet est créé. Il est possible d'ouvrir un schéma par défaut, enregistrés sur le serveur, lors du lancement de la modeler. Pour ce faire, vous devez passer un paramètre via l'adresse URL. Le nom du paramètre est defaultXmi. Exemple (pour ouvrir le fichier nommé myXmiFile.xmi XMI): http://www.beotic.org/us/projects/beomodeler/online/beomodeler.php?defaultXmi=myXmiFile.xmi 30

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Enregistrez le projet. S'il s'agit d'un projet de serveur, il est enregistré sur le serveur. Sinon, le projet est enregistré sur le système de fichier local (le navigateur télécharge le fichier). Exporter des schémas

Exporter les schémas sélectionnés dans le type d'exportation choisi. Le navigateur télécharge un fichier XMI ou un fichier zip (si plusieurs diagrammes sont sélectionnés). Exporter le schéma au format d'image (PNG) Pour exporter un diagramme, cliquez à droite sur la feuille pour ouvrir le menu contextuel. Ensuite, cliquez sur "Export to PNG format".

Sélectionner le fond et remplir le nom du champ. Le PNG exporté est téléchargé ou ouvert dans une nouvelle fenêtre (selon votre navigateur). 3. Le panneau UML Tool Outil de sélection:

31

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Cet outil est utilisé pour : • • • • •

Sélectionner les objets (simple click) Déplacer des objets (mouse down + mouse move) Modifier des object (double click) Drag n 'drop des classes/ interfaces à entrer/sortir un paquet Déplacer la zone de travail.

L'outil de note Cet outil est utilisé pour créer l'objet Note. Il est possible de lier cette note à un autre objet avec un lien Note.

L'outil Lien Note : Cet outil est utilisé pour lier une note à un objet.

32

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

La note prend la couleur de l'objet. Lorsque la boîte est déplacée, la note est allé également. L'outil Package : Cet outil est utilisé pour créer un objet package. Cet objet peut contenir d'autres objets (objet classe ou une interface).

Pour écrire le nom du paquet: <visibility><name> Example: +utils Visibilité des symboles sont : • • • •

33

+ : public - : private # : protected ~ : package

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

La visibilité est facultative (la visibilité par défaut est public). L'outil Class: Cet outil est utilisé pour créer l'objet de la classe. C'est possible d'ajouter des attributs et des opérations dans la classe et les objets d'interface. Pour ajouter l'attribut / opération, cliquez sur la zone blanche et remplissez le champ. Pour écrire le nom de la classe : <visibility><name>:<stereotype> Example: +Person Pour écrire un attribut: <visibility><name>:<type> Example: -firstName:String Pour écrire une opération : <visibility><name>(<param>:<type>...):<type> Example : +getCompleteName():String Visibilité, le type et stéréotype sont facultatives. Le classe Person

Avec son stéréotype

L'outil Interface : Cet outil est utilisé pour créer l'objet de l'interface. Il est similaire à l'outil de classe.

34

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

L'outil Dependency : Cet outil est utilisé pour créer une relation de dépendance entre deux classes :

L'outil Association : Cet outil est utilisé pour créer une relation d'association entre deux classes: To name link and set cardinalities type text : Pour nommer un lien et mettre des cardinalités, taper: <visibility><name>(<cardinality>):linkname:<visibility><name>(<cardinality>) Example : -person(0..1):person_address:-address(1) Les cardinalités possibles sont: • • • •

0..1 1 1..* *

Il est possible de faire des liens réflexive. Pour l'attirer, démarrez le lien sur un objet et l'arrêter sur le même objet.

35

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

L'outil d'Assossiation partagé : Cet outil est utilisé pour créer une relation d'association partagée entre deux classes :

L'outil Assossiation composite: Cet outil est utilisé pour créer une relation d'association composite entre deux classes :

L'outil Generalization: Cet outil est utilisé pour créer une relation de généralisation entre deux classes:

36

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

4. Le panneau Use Case Tool L'outil Selection :

Cet outil est utilisé pour : • • • • •

Sélectionner les objets (simple click) Déplacer des objets (mouse down + mouse move) Modifier des objets (double click) Drag n 'drop des classes/ interfaces à entrer/sortir un paquet Déplacer la zone de travail.

L'outil Package : 37

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Il est similaire à l'outil le paquet dans le diagramme de classe. L'outil Area : Cet outil est utilisé pour créer l'objet Area. Il fonctionne comme un objet Package: il peut contenir d'autres objets.

L'outil Actor : Cet outil est utilisé pour créer l'objet acteur.

L'outil Use Case : Cet outil est utilisé pour créer des cas d'utilisation d'objet.

38

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

L'outil Use : Cet outil est utilisé pour créer la relation Use.

5. Le panneau Collaboration Tool L'outil Selection :

Cet outil est utilisé pour : • • • • •

Sélectionner les objets (simple click) Déplacer des objets (mouse down + mouse move) Modifier des objets (double click) Drag n 'drop des classes/ interfaces à entrer/sortir un paquet Déplacer la zone de travail.

L'outil Package : Il est similaire à l'outil le paquet dans le diagramme de classe. L'outil Classe : Il est similaire à l'outil de classe dans le diagramme de classe. L'outil Association : 39

LE Nguyen Tuan Thành – P15


Travail Personnel Encadré – Rapport final

2010

Cet outil est utilisé pour créer des relations d'association. Le nom de l'objet peut être réglé. 6. Propriétés Vous pouvez modifier les propriétés d'un objet à partir du panneau Propriétés. Pour l'afficher, sélectionnez une catégorie et cliquez sur riqht sur elle. Cliquez sur Propriétés dans le menu.

Lorsque vous modifiez un champ de texte, vous devez taper Enter pour enregistrer la nouvelle valeur. Le panneau Propriétés est disponible pour la classe, les interfaces, les attributs, les méthodes et les associations. 7. Miniview Le MiniView est un aperçu de la feuille de calcul. Pour l'afficher, cliquez droit sur la feuille de calcul et cliquez sur "Afficher le MiniView".

8. Treeview Vous pouvez fermer projet, créer un paquet et un schéma avec une clique à droit. Vous pouvez faire glisser un diagramme / paquet sur un paquet ou du projet.

40

LE Nguyen Tuan Thành – P15


Rapport final de TPE  

Mon rapport final de TPE : Un outil de modélisation graphique collaborative

Advertisement
Read more
Read more
Similar to
Popular now
Just for you