Halloween avec Piskel


Nous allons dessiner une citrouille en pixel-art pour Halloween. Pour cela, nous allons utiliser le logiciel Piskel. Si vous voulez vous familiariser avec ce logiciel, voici quelques articles : Créer son smiley avec Piskel, Piskel, création d'un personnage de jeux vidéo, Piskel, animation d'un personnage et Piskel, notre personnage marche.

Joyeux Halloween


Cet article sera composé de petites missions.
Mission 1 Personnage Dessinez la citrouille suivante :

Contour de la citrouille

 <ul class="collapsible">
<li>
  <div class="collapsible-header black white-text"><i class="material-icons">vpn_key</i>Solution</div>
  <div class="collapsible-body black"><span class="white-text">
      Ce n'est pas si facile, pour obtenir la solution, il va falloir répondre à une petite question. 
        <div id="zoneFormulaire">
            <label>Remplacez les pointillés par le mot manquant : Piskel permet de faire du ....... art
                <input class="white-text" type="text" id="reponse1" />
            </label>
            <a class="waves-effect waves-light btn"  id="btnRepondre1">Répondre</a>
        </div>
      <div id="solution1">
      </div>
      <script>
          var vBtnAj = document.getElementById("btnRepondre1");
          vBtnAj.addEventListener("click", afficher);
          function afficher() {
                            var rep = document.getElementById("reponse1");
                            if(rep.value == "pixel"){
                                document.getElementById("solution1").innerHTML = '<a href="https://drive.google.com/open?id=1igR8OPBM7hy1t8sDwTd8zo9YxxpmB5nn">Solution 1</a>';
                            }
                        }
      </script> 
      </span></div>
</li>

Mission 2 Personnage Coloriez la citrouille :

 La citrouille en orange

  • vpn_keySolution
    Répondre

<div class="row">
<div class="col s12 m12">
  <div class="card-panel #e65100 orange darken-4">
      <span class="card-title white-text"><b>Mission 3</b>
                    <img align="right" class="responsive-img" width="5%" src="images/technologies/irobotechart_logo_openscad/character.png" alt="Personnage">
    </span>
    <span class="white-text">Améliorez la citrouille :
        <center><br><img class="responsive-img" width="50%" src="images/technologies/halloween_piskel/mission3.png" alt="Citrouille colorée"></center>
      </span>
  </div>
</div>


  • vpn_keySolution
    Répondre

Mission 4 Personnage Dessinez un personnage de Space Invaders :

Space Invaders
  • vpn_keySolution
    Répondre
Mission 5 Personnage Complétez la citrouille :

Citrouille avec Space Invaders
  • vpn_keySolution
    Répondre

Bravo, maintenant, il ne vous reste plus qu'à exporter l'image. Et Joyeux Halloween !



Voir plus d'articles