|
@@ -0,0 +1,369 @@
|
|
|
+<header id='header'>
|
|
|
+
|
|
|
+h1. OLA#3 Documentation
|
|
|
+
|
|
|
+<nav id='menu'>
|
|
|
+
|
|
|
+* "content/bachir_soussi-chiadmi":#content/bachir_soussi-chiadmi
|
|
|
+* "content/claudie_under":#content/claudie_under
|
|
|
+* "content/dimitri_robert":#content/dimitri_robert
|
|
|
+* "content/emilie_coquard":#content/emilie_coquard
|
|
|
+* "content/louis_eveillard":#content/louis_eveillard
|
|
|
+* "content/Lucie_Maëlle":#content/Lucie_Maëlle
|
|
|
+* "content/sandrine_ripoll":#content/sandrine_ripoll
|
|
|
+
|
|
|
+</nav>
|
|
|
+</header>
|
|
|
+<section id='main'>
|
|
|
+<div id='content/bachir_soussi-chiadmi' class='user'>
|
|
|
+<section class='content'>
|
|
|
+
|
|
|
+h1. Playmo Gun
|
|
|
+
|
|
|
+h2. Bachir Soussi Chiadmi
|
|
|
+
|
|
|
+Hey Bill, t'aime bien les playmo ?
|
|
|
+Ouai, avec des guns John !
|
|
|
+
|
|
|
+<a data-lightbox='bachir_soussi-chiadmi' href='images/bachir_soussi-chiadmi-00.png'>!thumbs/bachir_soussi-chiadmi-00.png!</a>
|
|
|
+<a data-lightbox='bachir_soussi-chiadmi' href='images/bachir_soussi-chiadmi-01.png'>!thumbs/bachir_soussi-chiadmi-01.png!</a>
|
|
|
+
|
|
|
+</section>
|
|
|
+<section class='images'>
|
|
|
+
|
|
|
+* <a data-lightbox='bachir_soussi-chiadmi' href='images/bachir_soussi-chiadmi-02.png'>!thumbs/bachir_soussi-chiadmi-02.png!</a>
|
|
|
+* <a data-lightbox='bachir_soussi-chiadmi' href='images/bachir_soussi-chiadmi-03.png'>!thumbs/bachir_soussi-chiadmi-03.png!</a>
|
|
|
+
|
|
|
+</section>
|
|
|
+<section class='sources'>
|
|
|
+
|
|
|
+
|
|
|
+</section>
|
|
|
+</div>
|
|
|
+<div class="pagebreak"></div>
|
|
|
+<div id='content/claudie_under' class='user'>
|
|
|
+<section class='content'>
|
|
|
+
|
|
|
+h1. Le nom de mon animatique
|
|
|
+
|
|
|
+h2. Monprenom Monnom
|
|
|
+
|
|
|
+à partir d'ici vous pouvez écrire le texte de description de votre projet d'aniamtique
|
|
|
+
|
|
|
+<a data-lightbox='claudie_under' href='images/claudie_under-00.jpg'>!thumbs/claudie_under-00.jpg!</a>
|
|
|
+
|
|
|
+Pour insérer des images, comme des shoot écrans de votre travail, commencez par les déposer dans le dossier images de votre dossier perso
|
|
|
+puis ajouter cette ligne:
|
|
|
+
|
|
|
+bc. !images/nomdemonimage.jpeg!
|
|
|
+
|
|
|
+Toutes les images seront insérez automatiquement a la fin de votre description dans la documentation finale, sauf celle ajouté manuellement dans le texte.
|
|
|
+
|
|
|
+</section>
|
|
|
+<section class='images'>
|
|
|
+
|
|
|
+* <a data-lightbox='claudie_under' href='images/claudie_under-01.jpg'>!thumbs/claudie_under-01.jpg!</a>
|
|
|
+
|
|
|
+</section>
|
|
|
+<section class='sources'>
|
|
|
+
|
|
|
+
|
|
|
+</section>
|
|
|
+</div>
|
|
|
+<div class="pagebreak"></div>
|
|
|
+<div id='content/dimitri_robert' class='user'>
|
|
|
+<section class='content'>
|
|
|
+
|
|
|
+h1. Le nom de mon animatique
|
|
|
+
|
|
|
+Dimitri Robert
|
|
|
+
|
|
|
+h2. Débuts avec Krita
|
|
|
+
|
|
|
+Menu clic-droit très pratique, on a un accès rapide aux outils essentiels
|
|
|
+
|
|
|
+<a data-lightbox='dimitri_robert' href='images/dimitri_robert-21.png'>!thumbs/dimitri_robert-21.png!</a>
|
|
|
+
|
|
|
+Le stabilisateur permet de réellement stabiliser le trait pour quand on est une bille en dessin.
|
|
|
+
|
|
|
+!images/Unnamed-–Krita-0001.png!
|
|
|
+
|
|
|
+Les outils Alchimie permettent de remplir automatiquement des surfaces.
|
|
|
+
|
|
|
+!images/Unnamed-–Krita-0002.png!
|
|
|
+
|
|
|
+Attention, comportement différent entre la gomme du stylet (outil Gomme simple) et le fait de presser la touche E qui transforme le comportement de l'outil actuel en gomme.
|
|
|
+
|
|
|
+Premier dessin de personnage, c'est un peu n'importe quoi...
|
|
|
+
|
|
|
+!images/Unnamed-–Krita-0003.png!
|
|
|
+
|
|
|
+Un petit croquis tout à la tablette graphique, avec les différents plans dans des calques séparés. L'idée est de les déplacer séparément à l'animation.
|
|
|
+
|
|
|
+<a data-lightbox='dimitri_robert' href='images/dimitri_robert-15.png'>!thumbs/dimitri_robert-15.png!</a>
|
|
|
+
|
|
|
+Pour exporter chaque calque au format PNG, pas d'autre solution que de cacher tous les calques sauf celui qu'on veut exporter. Puis, Fichier → Enregistrer sous et nommer avec un suffixe numéroté (chemin_001.png par exemple).
|
|
|
+
|
|
|
+h2. Débuts avec Blender
|
|
|
+
|
|
|
+Ajouter l'add-on Import images as planes
|
|
|
+
|
|
|
+<a data-lightbox='dimitri_robert' href='images/dimitri_robert-01.png'>!thumbs/dimitri_robert-01.png!</a>
|
|
|
+
|
|
|
+h3. Importer des images
|
|
|
+
|
|
|
+File → Import → Images as planes
|
|
|
+
|
|
|
+Quelques options nécessaires :
|
|
|
+
|
|
|
+* Use alpha
|
|
|
+* Shadeless
|
|
|
+* Z-transparency
|
|
|
+
|
|
|
+Sélectionner toutes les images en pressant la touche Maj (Shift) et en cliquant sur chacune.
|
|
|
+
|
|
|
+Pour y voir plus clair, il faut créer une plaque blanche :
|
|
|
+
|
|
|
+* Shift-A (Add) Mesh → Plane
|
|
|
+* S pour changer ses dimensions (agrandir)
|
|
|
+* Dans la fenêtre Properties, puis l'onglet Material, ajouter un New material. Dans Shading, cocher Shadeless.
|
|
|
+
|
|
|
+Changer la vue :
|
|
|
+
|
|
|
+* View → Top
|
|
|
+* View → View Perp/ortho
|
|
|
+
|
|
|
+
|
|
|
+h2. Gérer l'animation dans Krita
|
|
|
+
|
|
|
+Doc en ligne : https://docs.krita.org/Animation
|
|
|
+
|
|
|
+h2. Blender : séquence d'images sur une plaque
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+<a data-lightbox='dimitri_robert' href='images/dimitri_robert-00.png'>!thumbs/dimitri_robert-00.png!</a>
|
|
|
+
|
|
|
+</section>
|
|
|
+<section class='images'>
|
|
|
+
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-02.png'>!thumbs/dimitri_robert-02.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-03.png'>!thumbs/dimitri_robert-03.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-04.png'>!thumbs/dimitri_robert-04.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-05.png'>!thumbs/dimitri_robert-05.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-06.png'>!thumbs/dimitri_robert-06.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-07.png'>!thumbs/dimitri_robert-07.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-08.png'>!thumbs/dimitri_robert-08.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-09.png'>!thumbs/dimitri_robert-09.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-10.png'>!thumbs/dimitri_robert-10.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-11.png'>!thumbs/dimitri_robert-11.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-12.png'>!thumbs/dimitri_robert-12.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-13.png'>!thumbs/dimitri_robert-13.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-14.png'>!thumbs/dimitri_robert-14.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-16.jpg'>!thumbs/dimitri_robert-16.jpg!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-17.png'>!thumbs/dimitri_robert-17.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-18.png'>!thumbs/dimitri_robert-18.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-19.png'>!thumbs/dimitri_robert-19.png!</a>
|
|
|
+* <a data-lightbox='dimitri_robert' href='images/dimitri_robert-20.png'>!thumbs/dimitri_robert-20.png!</a>
|
|
|
+
|
|
|
+</section>
|
|
|
+<section class='sources'>
|
|
|
+
|
|
|
+* "chemin_001.png":sources/chemin_001.png
|
|
|
+* "decor_001.png":sources/decor_001.png
|
|
|
+* "joujou.kra":sources/joujou.kra
|
|
|
+* "overlay_001.png":sources/overlay_001.png
|
|
|
+* "pacman-walk.kra":sources/pacman-walk.kra
|
|
|
+* "perso_001.png":sources/perso_001.png
|
|
|
+* "perso_002.png":sources/perso_002.png
|
|
|
+* "perso_003.png":sources/perso_003.png
|
|
|
+* "perso_004.png":sources/perso_004.png
|
|
|
+* "perso_005.png":sources/perso_005.png
|
|
|
+* "perso_006.png":sources/perso_006.png
|
|
|
+* "perso_007.png":sources/perso_007.png
|
|
|
+* "perso_008.png":sources/perso_008.png
|
|
|
+* "perso_009.png":sources/perso_009.png
|
|
|
+* "perso_010.png":sources/perso_010.png
|
|
|
+* "perso_011.png":sources/perso_011.png
|
|
|
+* "perso_012.png":sources/perso_012.png
|
|
|
+* "perso_013.png":sources/perso_013.png
|
|
|
+* "perso_014.png":sources/perso_014.png
|
|
|
+* "perso_015.png":sources/perso_015.png
|
|
|
+* "perso_016.png":sources/perso_016.png
|
|
|
+* "perso_017.png":sources/perso_017.png
|
|
|
+* "perso_018.png":sources/perso_018.png
|
|
|
+* "perso_019.png":sources/perso_019.png
|
|
|
+* "perso_020.png":sources/perso_020.png
|
|
|
+* "perso_021.png":sources/perso_021.png
|
|
|
+* "perso_022.png":sources/perso_022.png
|
|
|
+* "perso_023.png":sources/perso_023.png
|
|
|
+* "perso_024.png":sources/perso_024.png
|
|
|
+* "perso_025.png":sources/perso_025.png
|
|
|
+* "perso-tout-seul.png":sources/perso-tout-seul.png
|
|
|
+* "rue.blend":sources/rue.blend
|
|
|
+* "rue.blend1":sources/rue.blend1
|
|
|
+* "rue.kra":sources/rue.kra
|
|
|
+
|
|
|
+</section>
|
|
|
+</div>
|
|
|
+<div class="pagebreak"></div>
|
|
|
+<div id='content/emilie_coquard' class='user'>
|
|
|
+<section class='content'>
|
|
|
+
|
|
|
+h1. Le voyage du p'tit nuage
|
|
|
+
|
|
|
+h2. Emilie Coquard
|
|
|
+
|
|
|
+C'est l'histoire d'une petite fumée sortie d'une cheminée qui vient se mélanger aux nuages. On va découvrir un petit monstre en sortir et celui-ci va être dérangé par un autre des siens.
|
|
|
+
|
|
|
+Pour faire ce projet, on a d'abord appréhender le logiciel Krita.
|
|
|
+J'ai dessiné des personnages imaginaires avec un effet de dessin à la craie.
|
|
|
+
|
|
|
+<a data-lightbox='emilie_coquard' href='images/emilie_coquard-15.png'>!thumbs/emilie_coquard-15.png!</a>
|
|
|
+<a data-lightbox='emilie_coquard' href='images/emilie_coquard-04.png'>!thumbs/emilie_coquard-04.png!</a>
|
|
|
+
|
|
|
+Pour continuer, j'ai dessiné des storyboards pour imaginer l'histoire d'un petit monstre.
|
|
|
+!images/storyboard.png! (mettre les dessins)
|
|
|
+
|
|
|
+Dessin du monstre dans Krita :
|
|
|
+
|
|
|
+<a data-lightbox='emilie_coquard' href='images/emilie_coquard-08.png'>!thumbs/emilie_coquard-08.png!</a>
|
|
|
+<a data-lightbox='emilie_coquard' href='images/emilie_coquard-07.png'>!thumbs/emilie_coquard-07.png!</a>
|
|
|
+
|
|
|
+Et de la pluie :
|
|
|
+
|
|
|
+<a data-lightbox='emilie_coquard' href='images/emilie_coquard-14.png'>!thumbs/emilie_coquard-14.png!</a>
|
|
|
+
|
|
|
+
|
|
|
+Dessin du paysage de l'animation :
|
|
|
+
|
|
|
+<a data-lightbox='emilie_coquard' href='images/emilie_coquard-05.png'>!thumbs/emilie_coquard-05.png!</a>
|
|
|
+<a data-lightbox='emilie_coquard' href='images/emilie_coquard-13.png'>!thumbs/emilie_coquard-13.png!</a>
|
|
|
+<a data-lightbox='emilie_coquard' href='images/emilie_coquard-09.png'>!thumbs/emilie_coquard-09.png!</a>
|
|
|
+<a data-lightbox='emilie_coquard' href='images/emilie_coquard-00.png'>!thumbs/emilie_coquard-00.png!</a>
|
|
|
+<a data-lightbox='emilie_coquard' href='images/emilie_coquard-06.png'>!thumbs/emilie_coquard-06.png!</a>
|
|
|
+<a data-lightbox='emilie_coquard' href='images/emilie_coquard-03.png'>!thumbs/emilie_coquard-03.png!</a>
|
|
|
+
|
|
|
+Test d'animation du nuage avec le décor dans blender :
|
|
|
+<a data-lightbox='emilie_coquard' href='images/emilie_coquard-10.gif'>!thumbs/emilie_coquard-10.gif!</a>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+Pour insérer des images, comme des shoot écrans de votre travail, commencez par les déposer dans le dossier images de votre dossier perso
|
|
|
+puis ajouter cette ligne:
|
|
|
+
|
|
|
+bc. !images/nomdemonimage.jpeg!
|
|
|
+
|
|
|
+Toutes les images seront insérez automatiquement a la fin de votre description dans la documentation finale, sauf celle ajouté manuellement dans le texte.
|
|
|
+
|
|
|
+</section>
|
|
|
+<section class='images'>
|
|
|
+
|
|
|
+* <a data-lightbox='emilie_coquard' href='images/emilie_coquard-01.png'>!thumbs/emilie_coquard-01.png!</a>
|
|
|
+* <a data-lightbox='emilie_coquard' href='images/emilie_coquard-02.png'>!thumbs/emilie_coquard-02.png!</a>
|
|
|
+* <a data-lightbox='emilie_coquard' href='images/emilie_coquard-11.png'>!thumbs/emilie_coquard-11.png!</a>
|
|
|
+* <a data-lightbox='emilie_coquard' href='images/emilie_coquard-12.gif'>!thumbs/emilie_coquard-12.gif!</a>
|
|
|
+
|
|
|
+</section>
|
|
|
+<section class='sources'>
|
|
|
+
|
|
|
+* "test2.kra":sources/test2.kra
|
|
|
+* "test.kra":sources/test.kra
|
|
|
+
|
|
|
+</section>
|
|
|
+</div>
|
|
|
+<div class="pagebreak"></div>
|
|
|
+<div id='content/louis_eveillard' class='user'>
|
|
|
+<section class='content'>
|
|
|
+
|
|
|
+h1. Le nom de mon animatique
|
|
|
+
|
|
|
+h2. Monprenom Monnom
|
|
|
+
|
|
|
+à partir d'ici vous pouvez écrire le texte de description de votre projet d'aniamtique
|
|
|
+
|
|
|
+<a data-lightbox='louis_eveillard' href='images/louis_eveillard-00.jpg'>!thumbs/louis_eveillard-00.jpg!</a>
|
|
|
+
|
|
|
+Pour insérer des images, comme des shoot écrans de votre travail, commencez par les déposer dans le dossier images de votre dossier perso
|
|
|
+puis ajouter cette ligne:
|
|
|
+
|
|
|
+bc. !images/nomdemonimage.jpeg!
|
|
|
+
|
|
|
+Toutes les images seront insérez automatiquement a la fin de votre description dans la documentation finale, sauf celle ajouté manuellement dans le texte.
|
|
|
+
|
|
|
+</section>
|
|
|
+<section class='images'>
|
|
|
+
|
|
|
+* <a data-lightbox='louis_eveillard' href='images/louis_eveillard-01.jpg'>!thumbs/louis_eveillard-01.jpg!</a>
|
|
|
+
|
|
|
+</section>
|
|
|
+<section class='sources'>
|
|
|
+
|
|
|
+
|
|
|
+</section>
|
|
|
+</div>
|
|
|
+<div class="pagebreak"></div>
|
|
|
+<div id='content/Lucie_Maëlle' class='user'>
|
|
|
+<section class='content'>
|
|
|
+
|
|
|
+h1. Le nom de mon animatique
|
|
|
+
|
|
|
+h2. Monprenom Monnom
|
|
|
+
|
|
|
+à partir d'ici vous pouvez écrire le texte de description de votre projet d'aniamtique
|
|
|
+
|
|
|
+<a data-lightbox='Lucie_Maëlle' href='images/Lucie_Maëlle-00.jpg'>!thumbs/Lucie_Maëlle-00.jpg!</a>
|
|
|
+
|
|
|
+Pour insérer des images, comme des shoot écrans de votre travail, commencez par les déposer dans le dossier images de votre dossier perso
|
|
|
+puis ajouter cette ligne:
|
|
|
+
|
|
|
+bc. !images/nomdemonimage.jpeg!
|
|
|
+
|
|
|
+Toutes les images seront insérez automatiquement a la fin de votre description dans la documentation finale, sauf celle ajouté manuellement dans le texte.
|
|
|
+
|
|
|
+</section>
|
|
|
+<section class='images'>
|
|
|
+
|
|
|
+* <a data-lightbox='Lucie_Maëlle' href='images/Lucie_Maëlle-01.jpg'>!thumbs/Lucie_Maëlle-01.jpg!</a>
|
|
|
+
|
|
|
+</section>
|
|
|
+<section class='sources'>
|
|
|
+
|
|
|
+
|
|
|
+</section>
|
|
|
+</div>
|
|
|
+<div class="pagebreak"></div>
|
|
|
+<div id='content/sandrine_ripoll' class='user'>
|
|
|
+<section class='content'>
|
|
|
+
|
|
|
+h1. Le nom de mon animatique
|
|
|
+
|
|
|
+h2. Monprenom Monnom
|
|
|
+
|
|
|
+à partir d'ici vous pouvez écrire le texte de description de votre projet d'aniamtique
|
|
|
+
|
|
|
+<a data-lightbox='sandrine_ripoll' href='images/sandrine_ripoll-00.jpg'>!thumbs/sandrine_ripoll-00.jpg!</a>
|
|
|
+
|
|
|
+Pour insérer des images, comme des shoot écrans de votre travail, commencez par les déposer dans le dossier images de votre dossier perso
|
|
|
+puis ajouter cette ligne:
|
|
|
+
|
|
|
+bc. !images/nomdemonimage.jpeg!
|
|
|
+
|
|
|
+Toutes les images seront insérez automatiquement a la fin de votre description dans la documentation finale, sauf celle ajouté manuellement dans le texte.
|
|
|
+
|
|
|
+</section>
|
|
|
+<section class='images'>
|
|
|
+
|
|
|
+* <a data-lightbox='sandrine_ripoll' href='images/sandrine_ripoll-01.jpg'>!thumbs/sandrine_ripoll-01.jpg!</a>
|
|
|
+
|
|
|
+</section>
|
|
|
+<section class='sources'>
|
|
|
+
|
|
|
+
|
|
|
+</section>
|
|
|
+</div>
|
|
|
+<div class="pagebreak"></div>
|
|
|
+</section>
|