Projets

Tutoriel – Piskel

Créé par

Garo

Publié le

9 juillet 2017

Modifié le

9 juillet 2017

Illustration Niveau facile Création individuelle

Piskel est un outil de création en code ouvert te permettant de créer facilement des personnages et des environnements pixélisés. En plus, il est possible de les animer!

Piskel est une application web disponible en anglais seulement. Pour savoir comment traduire un site web, voir le tutoriel ici.

Avec ce premier tutoriel, tu seras en mesure de :

  • Dessiner tes premiers lutins (« sprites »), et;
  • Animer tes lutins

Quelques termes importants

Avant d’amorcer le tutoriel, il y a quelques termes importants à comprendre.

Lutin : dans le contexte ici, il ne s’agit pas de la petite créature imaginaire de forme humaine vivant dans des grottes, mais bien d’un élément graphique utilisé dans les jeux vidéo.

Un lutin est créé à partir d’une image matricielle (bitmap).

Par la suite, il est possible d’animer les lutins avec une suite d’images matricielles semblables. Avec le logiciel Piskel, cette étape est vraiment simple!

Une image matricielle (bitmap) est une image constituée, selon sa résolution, de plusieurs milliers de carrés colorés, les pixels. Pour simplifier : imagine les feuilles quadrillées qui sont utilisées pour les cours de sciences ou de mathématique. De très près, c’est exactement la même chose : chaque point qui forme l’image est en fait un petit carré. Une feuille complète correspond à une image matricielle : les points quadrillés sont les pixels. Plus la résolution est élevée, plus petits seront les quadrillés et vice versa.

Un exemple notable d’un lutin : le pointeur de la souris.

Tutoriel

  1. Rendez-vous sur le site web de Piskel: http://www.piskelapp.com/
  2. Il est possible de créer un compte sur le site web, ou de tout simplement créer un lutin sans compte. Il est bien évidemment recommandé de créer un compte, car tu auras accès à tes créations sur n’importe quel poste informatique et elles seront sauvegardées sur ton compte si tu souhaites y apporter des modifications plus tard;
  3. Clique sur la touche Créer Sprite/Create Sprite;
  4. Voici l’interface de travail. Elle est divisée en huit espaces :
    1. Les outils de travail (crayon, sélection, sceau, etc.)
    2. Les cadres/images
    3. L’espace de travail
    4. L’animation en temps réel (directement liée aux cadres/images)
    5. Les différentes couches
    6. Les outils de transformation (rotation, virement vertical, etc.)
    7. Palettes de couleur
    8. Les options (sauvegarde, exportation, préférences, etc.)
  5. Dans les options, il y a un outil Redimensionner. Cet outil permet d’augmenter ou de baisser la résolution. Plus la résolution est élevée, moins nous apercevrons les pixels. Vice versa. De base, Piskel offre une surface de 32 x 32 pixels.
  6. Il ne te reste plus qu’à tester les fonctionnalités du logiciel!
Banque NationaleLutinPiskelPixelsquare

Inscription

Ce projet n'est inscrit à aucun concours pour le moment.

Commentaires

Laisser un commentaire

Tu dois être connecté pour laisser un commentaire.