web/content/partiea/tp.md

-  
-
-# TP d'Animation de personnage (M1)
-
-  
-  
-
-## TP partie 1 : affichage
-
-![](/charanim_interpolation.png)  
-Vous allez créer un module Skeleton.h/.cpp (ce code n'est qu'indicatif, vous êtes libre de vos structures de données). Cette classe va stocker un tableau de toutes les articulations (SkeletonJoint) du squelette et pour chaque articulation stocke l'identifiant de l'articulation parent et la matrice de passage de l'articulation vers le monde.
-
-Le fichier est déjà présent dans le code départ avec des TODO à compléter :
-
-``` 
-
-class Skeleton
-{
-public:
-
-   struct SkeletonJoint
-   {
-      int m_parentId;    // Le numéro du père dans le tableau de CAJoint de CASkeleton
-      Transform m_l2w;  // La matrice passant du repère de l'articulation vers le monde
-   };
-
-   Skeleton() {}
-
-   //! Créer un squelette ayant la même structure que définit dans le BVH c'est à dire
-   //! creer le tableau de SkeletonJoint à la bonne taille, avec les parentId initialsé pour chaque case
-   void init(const BVH& bvh);
-
-   //! Renvoie la position de l'articulation i en multipliant le m_l2w par le Point(0,0,0)
-   Point getJointPosition(int i) const;
-
-   //! Renvoie l'identifiant de l'articulation père de l'articulation numéro i
-   int getParentId(const int i) const;
-   
-   //! Renvoie le nombre d'articulation
-   int numberOfJoint() const;
-
-   //! Positionne ce squelette dans la position n du BVH. 
-   //! Assez proche de la fonction récursive (question 1), mais range la matrice (Transform)
-   //! dans la case du tableau. Pour obtenir la matrice allant de l'articulation local vers le monde,
-   //! il faut multiplier la matrice allant de l'articulation vers son père à la matrice du père allant de
-   //! l'articulation du père vers le monde.
-   void setPose(const BVH& bvh, int frameNumber);
-
-
-protected:
-   //! L'ensemble des articulations.
-   //! Remarque : la notion de hiérarchie (arbre) n'est plus nécessaire ici,
-   //! pour tracer les os on utilise l'information "parentID" de la class CAJoint
-   std::vector<SkeletonJoint> m_joint;
-};
-
-```
-
-  
-Dans le Viewer vous devez :
- * Déclarer un Skeleton en variable de la classe
- * écrire une fonction qui fait l'affichage
-
-``` 
-    void CharAnimViewer::skeletonDraw(const Skeleton& ske);
-```
-
- * initaliser l'instance de Skeleton dans la fonction init
- * Appeler setPose dans la fonction update
-
-  
-Remarques :
- * On sépare bien l'affichage de la gestion du squelette pour pouvoir réutiliser le code Skeleton avec une autre librairie d'affichage.
- * On ne s'occupe pas du temps pour l'instant mais uniquement du numéro de la posture.\\
- * Vous pouvez trouvez des BVH dans le répertoire data du code de départ. Notamment le fichier robot.bvh pour debuguer.
-
-  
-  
-## TP partie 2 : Contrôleur d'animation
-
-##### Déplacer une sphère au clavier
-
-Ecrivez une class CharacterControler qui à partir des touches claviers contrôlera le déplacement d'un personnage. Dans une 1er temps faites juste déplacer une boule : accélérer, freiner, tourner à droite, tourner à gauche, sauter. Ce contrôleur comportera une position et une vitesse. La vitesse sera modifiée par les flèches (ou un pad) et la position sera mise à jour dans la fonction update du Viewer en utilisant le paramètre "delta" recu par la fonction update.
-
-Une classe de Controller peut ressembler à ceci.
-
-``` 
-    class CharacterController
-    {
-    public:
-        CharacterController() : ... {}
-
-        void update(const float dt);
-
-        void turnXZ(const float& rot_angle_v);
-        void accelerate(const float& speed_inc);
-        void setVelocityMax(const float vmax);
-
-        const Point position() const;
-        const Vector direction() const;
-        float velocity() const;
-                const Transform& controller2world() const { return m_ch2w; }
-
-    protected:
-                Transform m_ch2w;   // matrice du character vers le monde
-                                    // le personnage se déplace vers X
-                                    // il tourne autour de Y
-                                    // Z est sa direction droite
-                                    
-        float m_v;          // le vecteur vitesse est m_v * m_ch2w * Vector(1,0,0)
-        float m_vMax;       // ne peut pas accélérer plus que m_vMax
-    };
-```
-
-  
-
-##### Déplacer un personnage au clavier
-
-Dans un 2e temps, votre contrôleur comportera également une série
-d'animation bvh : attendre, marcher, courir, et donner un coup de pied.
-En fonction de l'action que veut faire le joueur appuyant sur des
-touches vous changerez d'animation. Vous coderez la machine à états
-finis (FiniteStateMachine) de l'image ci-dessous. Les cercles sont les
-états (l'animation en train d'être jouée), les rectangles rouges sont
-les éventements et les carrés bleus sont les actions à effectuer
-(fonction de la classe). Ce changement se fera brutalement. Ne vous
-occupez pas non plus des pieds qui glissent sur le sol. Un meilleur
-contrôle peut-être fait la construction d'un graphe d'animation.
-
-![](/fsm.png)
-
-  
-  
-
-## TP partie 3 : Transition et plus
-
-a) Pour améliorer le réalisme, il serait bon de faire les transitions
-entre deux animations en choisissant deux poses des animations qui sont
-proches. Pour cela il faut calculer la distance entre deux poses
-d'animations (Voir les infos dans le sujet Graphe d'animation).  
-  
-
-b) Pour aller encore plus loin, on peut construire un automate de
-manière complètement automatique, on appelle alors ceci un graphe
-d'animation. [Voir le sujets de TP
-suivants.](https://perso.liris.cnrs.fr/alexandre.meyer/public_html/www/doku.php?id=master_charanim_tp_m2_cpp&s[]=graphe#tp_3e_partiegraphe_d_animation)  
-  
-
-a.bis) Indépendamment de la machine à état ou du graphe, si vous voulez
-gérer le temps de manière plus juste, il faudrait récupérer le temps
-réellement écoulé depuis l'affichage précédent. Ceci vous fera ne vous
-fera pas tomber précisément sur une frame stocké dans le clip (BVH). Il
-faudra donc interpoler entre les 2 frames. Le résultat sera de l'ordre
-du détail lors de l'affichage mais si vous voulez que votre moteur
-d'animation tourne sur toutes les machines indépendamment du CPU, il
-faut le faire. Cette interpolation peut également servir pour passer
-d'un clip à un autre.
-
-  
-  
-  
-
-## TP partie 3.PLUS : graphe d'animation
-
-*  -* [Motion Graph de l'article original](http://www.cs.wisc.edu/graphics/Gallery/kovar.vol/MoGraphs/);
-* Des BVH avec squelette compatible pour le graphe sont donné dans le git, répertoire Second\_Life.  
-
-Nous avons remarqué dans la partie 1 que la transition d'animation ne fonctionne bien que lorsque les deux poses du squelette sont assez proches (il faut bien sûr également que les deux squelettes aient la même topologie). L'idée d'un graphe d'animation est de construire un graphe où chaque noeud correspond à une pose d'une animation et où chaque arrête définit qu'une transition est possible entre les deux poses.
-
-  
-
-#### Comparaison de deux poses d'animation
-
-Pour construire un graphe d'animation à partir d'une ou plusieurs animations, on doit être capable de comparer deux poses d'animation. Une distance de 0 indique que les deux poses sont identiques. Une distance grande indique que les 2 poses sont très différentes.
-
-A partir de la classe Skeleton, écrivez la fonction de calcul de distance entre deux poses de squelette. Cette fonction est déjà présente dans la classe Skeleton plus haut mais en commentaire. Cette fonction calcule itérativement sur toutes les articulations la somme des distances euclidienne entre chaque articulation de deux squelettes aillant la même topologie mais dans des poses différentes.
-
-```
-    friend float Skeleton::Distance(const Skeleton& a, const Skeleton& b);
-```
-
-  
-Remarque : il est important de ne pas tenir compte de la translation et de la rotation de l'articulation racine. Une même pose a deux endroits du monde doit donner une distance de 0. Dans un 1er temps, votre personnage aura son noeud root centré en (0,0,0), puis dans la dernière partie de cette question, vous traiterez le centre de gravité.
-
-  
-  
-
-#### Construction du graphe
-
-Ecrivez un module MotionGraph qui contiendra un ensemble de BVH et le graphe d'animation définissant des transitions dans cette ensemble d'animation.
- * Un noeud du graphe=(Identifiant d'une animation + un numéro de pose); 
- * un arc du graphe entre deux poses indique la transition possible entre ces deux poses. Deux poses sont compatibles à la transition quand la distance entre les deux squelettes sont inférieurs à un certain seuil fixé empiriquement.
-
-  
-Vous pouvez créer un module CACore/CAMotionGraph.h/.cpp
-
-```
-    class MotionGraph
-    {
-       ...
-    protected:
-       //! L'ensemble des BVH du graphe d'animation
-       std::vector<BVH> m_BVH;
-    
-       //! Un noeud du graphe d'animation est repéré par un entier=un identifiant
-       typedef int GrapheNodeID;
-    
-       //! Une animation BVH est repérée par un identifiant=un entier 
-       typedef int BVH_ID;
-       
-       //! Un noeud du graphe contient l'identifiant de l'animation, le numéro 
-       //! de la frame et les identifiants des noeuds successeurs 
-       //! Remarque : du code plus "joli" aurait créer une classe CAGrapheNode
-       struct GrapheNode
-       {
-         BVH_ID id_bvh;
-         int frame;
-         std::vector<GrapheNodeID> ids_next;     //! Liste des nœuds successeurs 
-       };
-    
-    
-       //! Tous les noeuds du graphe d'animation
-       std::vector<GrapheNode> m_GrapheNode;
-    
-    };
-```
-  
-  
-
-#### Navigation dans le graphe
-
-Une fois ce graphe construit, on peut définir différente manière de naviguer dedans :
-   * Un parcours aléatoire dans le graphe (juste pour vérifier que le graphe est ok);
-   * L'utilisateur donne des directions au clavier => le parcours dans le graphe est conditionné par ces contraintes.
-
-
-#### Gestion correcte du centre de gravité
-
-Pour chaque arc du graphe, vous devez stocker la transformation (soit une matrice 4x4, soit un quaternion et une translation) du noeud root (souvent le centre de gravité) entre la pose i et la pose i+1. Cette transformation sera appliqué au noeud root de votre personnage quand il empruntera l'arc.
-
-  
-  
-  
-
-## NON DEMANDE CETTE ANNEE : Animation physique (voir la partie de F. Zara à la place)
-
-#### Particules
-
-![](/charanim_ball.png)
-
-Dans la fonction init de la class CharAnimViewer indiquez un nombre de particules non nul :
-
-``` 
-    m_world.setParticlesCount( 10 );
-```
-
-Dans la fonction render, il faut afficher les particules en dé-commentant cette ligne :
-
-``` 
-    m_world.draw();
-```
-
-Vous verrez alors les particules s'afficher, mais elles ne seront pas animées. Pour calculer la physique sur les particules, il y a deux
-classes **PhysicalWorld** et **Particle**. Regardez le fichier Particles.h. Il faudra compléter les fonctions update, collision et groundCollision :
-
-``` 
-    void update(const float dt = 0.1f)
-    void groundCollision()
-    void collision(const Point& p, const float radius)
-```
-
-Le code de update doit mettre à jour la vitesse avec l'équation F=m.a où a = dv/dt  
-Et mettre à jour la position avec l'équation habituelle p = p + v.t  
-
-[Regardez les explications dans la vidéo de cours ou ici](https://perso.liris.cnrs.fr/alexandre.meyer/teaching/master_charanim/aPDF_COURS_M1/M1_TP_PhysicsAnimation_ParticulesMassesRessorts.pdf).
-
-  
-
-#### Interaction personnage/particules
-
-Pour ajouter l'interaction entre votre personnage et des boules/sphères se trouvant dans l'environnement, il faut appeler PhysicalWorld::collision depuis CharAnimViewer::update en parcourant toutes les articulations du personnage. Dans un 1er temps, vous pouvez juste faire disparaitre les particules touchées en faisant passer le rayon de la particule à -1 et faire en sorte que les particules de rayon négatif ne soient pas affichées. Puis ajoutez dans Particle::collision du code pour déplacer les particules en collisions (résoudre les collisions) et changer leur vecteur vitesse.
-
-#### Tissus
-
-Un tissu est composé d'un maillage de Masses/Ressorts. Ajoutez une classe Spring qui va comporter :
- * la raideur du ressort
- * la longueur au repos du ressort
- * idA et idB : l'identifiant des 2 particules aux extrémités du ressort. Ces 2 identifiants sont l'indices de deux particules dans le tableau de particules stocké dans la classe PhysicalWorld.
-
-Munissez cette classe d'une fonction *addForce* qui calcule les forces qu'applique le ressort sur les 2 particules.
-```
-    void Spring::addForce(vector<Particles>& part, const float dt)
-```
-
-
-Dans la classe PhysicalWorld, ajoutez un tableau de ressort :
-
-``` 
-   std::vector<Spring> m_springs;
-```
-
-Le constructeur de PhysicalWorld créera un tissu avec des masses ressorts sous la forme de l'image ci-dessous. La génération se fera procéduralement.
-
-![](/mass-spring.jpg)
-
-
-#### Interaction avec le personnage
-
-Normalement, le personnage va pouvoir interagir avec le tissu en passant dessous ...

web/content/planning/_index.md

+
+---
+title: "Planning"
+description: "Planning"
+---
+
+TODO
\ No newline at end of file

web/content/projet/_index.md

+---
+title: "Projet réalisé en TP"
+description: "Projet"
+---
+
+
+<img src="doc/projet.jpg" width="300" class="center">  
+
+
+### Sujet et critères de notation
+
+Vous êtes libre du sujet de votre projet, mais discutez-en avec les intervenants de TD et TP afin d'obtenir leur accord. [Si vous êtes en panne d'inspiration, voici quelques idées de sujets](./project_ideas.md).
+
+* **Le projet est à réaliser en groupe de 2 ou 3 maximum** (4 n'est pas possible)
+* [N'oubliez pas de lire les règles à respecter lors de la conception et la réalisation d'un projet](https://forge.univ-lyon1.fr/Alexandre.Meyer/L2_ConceptionDevApp/-/blob/master/doc/coding_rules.md)
+* Regardez également les critères de notations (notes "Technique", "Conception" et "Organisation") [dont le détail est ici](https://docs.google.com/spreadsheets/d/1OcpRm6gQtmRNWSXeG7QwnFJ6Eqzl7_DKCjUM4V9P4A0/edit?usp=sharing).  (IMPORTANT A LIRE)
+* Vous devez **être autonome ET nous montrer régulièrement l'état d'avancement de votre projet**. Un groupe dont les membres arrivent à 10h voir plus tard, voir pas du tout et qui, tout d'un coup, une semaine avant la soutenance ont un projet bien abouti, sera considéré comme très très suspect.
+* Travail en équipe : vous disposez de 100 points par projet. A la fin du projet, vous affectez ces points à chacun des membres du groupe en fonction du degré d'implication. Par exemple, un groupe équilibré avec une personne un peu plus leader donnera 30, 30 et 40 points. Cette information servira à moduler les notes de chacuns (voir les critères de notation dans la grille). La modulation peut aller plus loin que juste les points sur l'organisation du travail. Un étudiant non impliqué peut avoir une note très faible sur les 3 parties, loin du reste du groupe.  
+
+
+<img src="doc/cahier2.jpg" width="200" class="center">
+
+### Cahier des charges
+
+Après quelques séances de conception et développement, vous devez rédiger et soumettre un cahier des charges (case 'DepotCahierDesCharges' sur Tomuss au format pdf, un seul dépôt par groupe). Ce cahier des charges reprend l'organisation vue en cours et en TD. Il doit comporter au moins une présentation du projet, une description détaillée de l'application (ex. règles du jeu ou fonctionnalités du logiciel), une liste exhaustive et détaillée des tâches à réaliser, un diagramme des classes (UML) et un diagramme de Gantt (tous les deux prévisionels). Ce document fait typiquement entre 4 et 10 pages.  
+
+#### Réaliser votre diagramme des classes (UML)
+
+* [Les bases d'un diagramme de classes sur wikipedia.](https://fr.wikipedia.org/wiki/Diagramme_de_classes) Nous n'utilisons que la notion d'association (et un peu héritage) en LIFAP4 pour les relations entre classes
+* Des outils
+ *  [Umbrello UML modeller](http://uml.sourceforge.net/) (Linux) est un programme permettant de modéliser les différents diagrammes UML (Unified Language Diagram)
+ * [Dia](http://en.wikipedia.org/wiki/Dia_(software)) est un programme
+    pour dessiner des diagrammes
+ * [StarUML](http://staruml.io/)
+ * [www.diagrams.net](https://www.diagrams.net/index.html) : app en ligne ou app à installer (simple, léger et efficace)
+ * [Outils online Viual-paradigm](https://online.visual-paradigm.com). Choisissez "Class diagram".
+ * [Ce lien](http://en.wikipedia.org/wiki/List_of_Unified_Modeling_Language_tools) répertorie différents outils pouvant être utilisés pou définir des diagrammes de modules
+
+Remarque : normalement sur les machines du Nautibus, Umbrello et Dia sont installés, sinon utilisez un outil en ligne.  
+
+
+
+<img src="doc/demo.png" width="200" class="center">
+
+### Démo mi-parcours
+
+A la moitié de votre projet, vous donnerez une démonstration aux intervenants de 10 minutes, qui sera suivie de quelques questions. Le
+but de cette démonstration est de faire un point sur ce qui marche et ce qui reste à faire, ainsi que de présenter l'organisation et la gestion de votre projet en général. Vous devez donc à la fois montrer ce que votre application est déjà capable de faire, mais aussi que vous avez les capacités à finaliser le projet à temps.  
+
+<img src="doc/soutenance.jpg" width="200" class="center">
+
+### Soutenance
+
+**La soutenance dure 20 min = 15 min de présentation démo, suivi de 5 min de questions**.
+La présentation devra être réalisée sous Powerpoint ou équivalent. Le mieux est de générer un PDF pour des raisons de compatibilité. Voici quelques conseils pour la présentation (entre 8 et 10 minutes).
+
+* Il s'agit d'une présentation technique. Passez donc rapidement sur l'interface graphique et les fonctionnalités, sur lesquelles vous pourrez plus vous attarder durant la démo. La majeure partie devra être consacrée à expliquer comment vous avez conçu et programmé votre application, en décrivant les classes et les structures correspondantes.
+* Le fruit d'un travail de plus de 40h doit être décrit en quelques minutes, ce qui est très court. Allez rapidement à l'essentiel ! Le planning étant très serré, vous serez interrompu si vous dépassez le temps imparti.
+* Pour les projets réalisés en groupe, le temps de parole devra être équitablement réparti entre les étudiants.
+* Le meilleur aperçu de la conception de votre projet reste le diagramme des classes (UML). Soignez sa présentation !
+
+Voici un plan possible.
+
+* Slide 1: Titre du projet, auteurs, principe de l'application (très rapide, avec une capture d'écran)
+* Slide 2: **Vue d'ensemble du diagramme des classes (UML)** (donc le diagramme doit être à jour)
+* Slide 3 à n-1: Explications détaillées des 3 ou 4 classes les plus importants et/ou les plus intéressants (ex. ceux dont vous êtes les plus fiers, sur lesquels vous avez passé le plus de temps)
+* Slide n: Conclusion. Attention à éviter les banalités du style "Le projet a été intéressant..." (ou l'inverse !). Les intervenants vous ont suivis pendant un semestre et ont déjà leur idée là-dessus! Décrivez par exemple ce qui marche et ce qui ne marche pas (les objectifs initiaux du cahier des charges ont-ils été atteints ?), les éventuelles difficultés rencontrées, et ce que vous (re)feriez avec un peu (ou beaucoup) plus de temps.
+
+Quelques conseils pour la démo (entre 5 et 7 minutes).
+
+* Le code doit être compilé, et la démo doit être lancée via l'exécutable
+* Préparez la démo pour être lancée tout de suite après la présentation (ex. sur votre ordinateur portable)
+* Répétez les actions que vous voulez illustrer, concentrez vous sur ce qui fonctionne (soyez vendeur!)
+* Utilisez le plein écran si approprié, prévoyez de quoi entendre sons et musiques si besoin
+* Si nécessaire, testez votre démo avant sur écran externe (ie. apprenez comment afficher en double écran sur votre machine)
+* **Faîtes au moins une répétition complète pour éviter les surprises (timing, démo qui fonctionne pas, etc.).**  
+
+
+<img src="doc/livrable.png" width="200" class="center">
+
+#### Travail à rendre (case 'DepotProjetFinal' dans Tomuss)
+
+Préparer et soumettre une archive suivant les mêmes conventions que le module Image nommée `NOM_PROJET_NUMEROETU1_NUMEROETU2_NUMEROETU3.tar.gz` et contenant au minimum les points suivants.
+
+* Un `readme.md` à la racine de l'archive contenant au moins
+  * les informations factuelles du projet : noms, prénoms, numéros étudiant et identifiant du projet sur la forge
+    * un manuel : commandes de compilation et d'exécution, règles du jeu ou utilisation de l'application, la liste des fonctionnalités du programme
+    * une description de l'organisation de votre archive
+* Tout le code (dans le répertoire src)
+* Un makefile (dans le répertoire racine) ou un fichier CMakeLists.txt
+  * Attention, toute autre librairie que la SDL devra être incluse dans l'archive ou pouvoir s'installer avec les packages
+* Les assets de votre application (dans le répertoire data, ex. images, sons, modèles 3D, fonts, fichiers de configuration)
+* Les exécutables sont compilés dans le répertoire bin
+* La documentation de votre projet (dans le répertoire doc) contenant au minimum
+  * La présentation orale (fichier PowerPoint ou pdf)
+  * Le diagramme des classes UML à jour (fichier image ou pdf)
+  * Le diagramme de Gantt à jour (fichier image ou pdf) avec une description de qui a fait quoi dans le projet (associations entre les tâches du diagramme et les étudiants)
+  * La documentation du code (dans le répertoire doc/html, générée par doxygen)
+
+Veillez à bien nettoyer votre archive avant soumission, i.e. supprimer les fichiers inutiles (fichiers objets, dossiers/fichiers git etc.).  

web/content/projet/project_ideas.md

+# Voici une liste non exhaustive d'idées de sujet
+
+
+## Jeux
+
+Le plus rigolo c'est les jeux ... inspirez vous des mini-jeux de vos mobiles ou des consoles.
+
+#### Plateaux
+- Dames
+- Les dames chinoises
+- Othello
+- Reversi
+- Sudoku et variantes
+- Démineur
+- Risk, ou autre jeu de stratégie basé sur l'occupation du plateau
+- Monopoly
+- Scrabble
+- etc.
+
+#### Jeux de cartes
+- Poker
+- Munchkin
+- Tarot
+- etc.
+
+#### Jeux d'arcade
+- Pacman
+- Tetris
+- Nibble
+- Sokoban
+- Space invaders
+- Azerty warrior
+- Mini-course de voitures caméra au-dessus [type SuperSprint](http://en.wikipedia.org/wiki/Super_Sprint)
+- Galaga
+- Donkey Kong
+- Star Wars
+- Dig Dug
+- Asteroids
+- Defender
+- Tron
+- Tempest (tie)
+- Centipede (tie)
+- Snake
+- etc.
+
+
+## Simulation et vie artificielle
+
+- génération de plantes à partir d'une grammaire (plutôt pour ceux qui ont déjà suivi "Infographie")
+- génération automatique de terrain (plutôt pour ceux qui ont déjà suivi "Infographie") :
+    cf. "Real Time Procedural Terrain Generation"\]\]
+- vie artificielle (jeux de la vie, colonie de fourmies ? les sims ?)
+
+
+## Applications
+- Logiciel de traitement d'images : Application affichant une image et proposant différents algorithmes de traitement d'images : éclaircissement, niveau de gris, flou, etc.
+- Gestion de rendez-vous / agenda
+- Gestion de bibliothèques / dvd, etc.
+- Musique : Gestion de playlist et autres
+- Geographie : affichage du monde avec des infos sur les pays et villes
+- Math : calcul formel, résolution de système, calcul matriciel, vecteur, etc.
+- Logiciel de dessin vectoriel : On désire réaliser un logiciel de dessin vectoriel. Par vectoriel on entend qu'un dessin est constitué d'une liste de primitives géométriques simples : points, droites, cercles, carrés, ... auxquelles on peut par exemple associer des caractéristiques comme la couleur ou l'épaisseur du trait, etc. Pour être utilisable ce logiciel devra être muni d'une interface : par exemple une fenêtre constituée d'une barre d'outils, d'une zone de dessin et d'un menu. Vous êtes entièrement libre des outils que vous proposez à l'utilisateur ainsi que de la manière dont vous pensez votre interface. Prévoir un fichier d'aide pour l'utilisateur peut être une bonne idée si vous avez le temps.
\ No newline at end of file

web/content/td/_index.md

+---
+
+title: "Travaux Dirigés"
+description: "TD"
+---
+
+
+<br>
+Il y a des TD au tableau/stylo et des TD sur machine. Pour la partie marchine, le module Image est à rendre.
+<br>
+
+
+### TD-C1 Conception et diagramme des classes
+
+<img src="doc/conception.jpg" width="100" class="center">
+
+* [TD Conception : étude de la conception de différentes applications, diagramme des classes](http://liris.cnrs.fr/~npronost/UCBL/LIFAP4/LIFAP4_TD1_ConceptionLogicielle.pdf)
+<!--* [Elements de correction du TD Conception](http://liris.cnrs.fr/~npronost/UCBL/LIFAP4/LIFAP4_TD1_ConceptionLogicielle_corriges.pdf)-->
+
+<br>
+<br>
+
+
+### TD Outils
+
+<img src="doc/tools.png" width="200" class="center">
+
+#### TD-O0 Installation et choix d'un éditeur de code
+
+Choisisser un éditeur de code. Nous vous conseillons de choisir parmi VSCode, Visual Studio(Windows), XCode(MacOS), CLion ou Codeblocks (Windows/Linux). [Regarder les consignes d'installation ici](https://forge.univ-lyon1.fr/Alexandre.Meyer/L2_ConceptionDevApp/*/blob/master/doc/install.md)
+
+<br>
+
+
+#### TD-O1 Classe Image
+
+Voir l'énoncé de la [Partie 1](doc/LIFAPCD_TD-O1_ClasseImage.pdf)
+
+* Ecriture de la structure Pixel et de la classe Image
+* Organisation des fichiers
+* Début des tests de la mémoire avec Valgrind  
+
+<br>
+
+
+#### TD-O2 Gestionnaire de version et documentation
+
+* Passage du code dans un projet git
+  * Se connecter sur la [forge Lyon 1](https://forge.univ-lyon1.fr)
+  * Dupliquez le projet suivant de module Image 
+  * Ajoutez-y les membres de votre groupe
+  * [Réalisez le tutorial "Premier pas" se trouvant ici](https://forge.univ-lyon1.fr/Alexandre.Meyer/L2_ConceptionDevApp/-/blob/master/doc/git.md)
+* Documentation de la classe Image avec les balises doxygen. [Voir les explications générales sur doxygen ici](https://forge.univ-lyon1.fr/Alexandre.Meyer/L2_ConceptionDevApp/-/blob/master/doc/doxygen.md).  
+
+<br>
+
+
+#### TD-O3 Débogage
+
+Voir l'énoncé de la [Partie 3](doc/LIFAPCD_TD-O3_Debogage.pdf)
+
+* Gestion de mémoire et optimisation de code sur un exemple "jouet"
+* Débogage des fonctions de sauvegarde et de chargement d'une image
+* Gdb
+* Valgrind
+
+<br>
+
+
+#### TD-O4 Bibliothèques (lib)
+
+Voir l'énoncé de la [Partie 4](doc/LIFAPCD_TD-O4_SDL.pdf)
+
+* Installer les librairies SDL2
+* Écrire la classe ImageViewer
+* Faire le diagramme des classes du module Image
+
+<br>
+<br>
+
+
+## Module Image à rendre
+
+<img src="../projet/doc/livrable.png" width="150" class="center">
+
+### À rendre
+
+Votre archive sera testée avec un script particulier (cf. plus bas). Vous devez donc **respecter exactement le format attendu par ce script sinon vous aurez la note zéro**.
+
+**Déposez votre archive sur TOMUSS**, dans la case `DepotModuleImage` du cours. Vous devez **respecter l'heure limite,** car le dépôt sera désactivé après l'heure limite. Une soumission en retard (par email ou autre) entraînera la note zéro pour tout le groupe. Un seul dépôt par groupe d'étudiants (sur n'importe lequel des comptes).
+
+Votre module Image doit respecter les conventions suivantes.
+
+* À faire en groupe de 2 ou 3 étudiants
+* Votre archive s'appelle `NUMEROETU1_NUMEROETU2_NUMEROETU3.tgz` ou `NUMEROETU1_NUMEROETU2_NUMEROETU3.tar.gz` (pas de zip) où `NUMEROETU1` est le numéro étudiant du premier membre du groupe, etc.
+* Tous les fichiers se décompressent dans un répertoire ayant pour nom `NUMEROETU1_NUMEROETU2_NUMEROETU3` (même nom que l'archive)
+* Ce répertoire doit contenir les sous-répertoires `bin`, `src`, `obj`, `data` et `doc`
+* Le fichier `Makefile` (donné explicitement ou bien générable par le fichier `CMakeLists.txt` de CMake) compile les trois programmes :
+  * `bin/exemple` exécute le code générant les images en sortie (i.e. exécute mainExemple.cpp)
+  * `bin/test` appelle `testRegression`  (test de non-régression qui vérifie tout) et affiche les tests effectués à l'écran (i.e. exécute mainTest.cpp)
+  * `bin/affichage` fait l'affichage de l'image dans une fenêtre SDL avec zoom/dézoom (i.e. exécute mainAffichage.cpp)
+* `readme.md` est un fichier texte expliquant la librairie. Au minimum comment compiler et exécuter, ce que fait le module et chacun des exécutables, l'organisation de l'archive, etc., et il doit indiquer les noms/prénoms/numéros des étudiants et l'id du projet sur la forge
+* Vos fichiers sources (.h et .cpp) sont placés dans le dossier `src`
+* Les images sauvées et lues seront toujours placées dans le dossier `data`
+* Dans le dossier `doc`, vous aurez
+  * `doc/image.doxy` est le fichier de configuration de doxygen
+  * `doc/html/index.html` est la page d'entrée de la documentation (générée avec doxygen)
+
+Ces conventions sont très répandues, et il serait de bonne habitude de les appliquer pour tous vos rendus de TP (info ou autres), ou vos projets futurs publiés sur internet. Vous utiliserez notamment ces conventions pour votre projet.
+
+**Vous n'avez pas le droit de modifier le code fourni.** Les programmes principaux, les noms des fichiers, des classes et structures, des fonctions, des données, etc., doivent être exactement les mêmes que ceux donnés. Ceci conditionne fortement le succès du script.
+
+
+### Script de test du module Image
+
+Votre archive du module Image sera testée avec le script présent dans le répertoire `TD_moduleImage` [fourni durant le TD ici](https://forge.univ-lyon1.fr/Alexandre.Meyer/L2_ConceptionDevApp), s'appelant evalModuleImage.py (script Python). Avant de soumettre votre archive, vérifiez que l'exécution du script se déroule sans erreur. Pour vous, il y a 3 manières de lancer le script :
+
+* sous linux avec le code du script en tapant la commande `python3 evalModuleImage.py NUMEROETU1_NUMEROETU2_NUMNUMEROETU3.tgz`;
+* sur la machine de l'université en [suivant les explications ici]https://forge.univ-lyon1.fr/Alexandre.Meyer/L2_ConceptionDevApp);
+* en clonant [ce projet](), à chaque commit le script est lancé.
+
+#### Script et notation
+
+* Si le script échoue à une étape, le correcteur n'ira pas plus loin (même si la suite est juste).
+* Si le script rapporte des erreurs, corrigez les avant de soumettre votre archive.
+* Le script vous donne également une note **INDICATIVE** à la fin. **Pour la note finale, des vérifications supplémentaires (non automatiques) seront effectuées par les enseignants.** La note indicative est donc une note maximale possible.
+
+
+#### Précision technique sur ce script
+
+* Ce script doit tourner sous Linux avec python3 (uniquement Linux à cause de valgrind). Si vous l'exécutez sur votre machine personnelle, il faut installer python, doxygen, valgrind, SDL2, etc. Voir les installations à faire sur [la page projet](projet).
+* Si votre code nécessite l'utilisation du standard CPP11 ou plus, n'oubliez pas d'ajouter l'option `-std=c++11` (ou plus) dans les lignes de commande g++ de votre Makefile.
+* Sous MacOS, [regardez les consignes ici](doc/tools_MacOS.pdf) (merci Erwan)
+* Sous Windows, installer WSL, puis tout se passe comme sous Linux
+* Si le message suivant apparaît, vous devez utiliser Python 3 (Python 2 produit ce type d'erreur).
+  ```
+  File "evalModuleImage.py", line 120
+      print("Numeros des etudiants =", end=' ')
+  SyntaxError: invalid syntax​
+  ```