Découvre le Pixel art
Dans cette activité, les makers créent différents projets en pixel art avec le logiciel piskelapp et les animent sur scratch

Objectifs pédagogiques
Compétences techniques
- Prendre un main un nouvel outil de création graphique
- Savoir manipuler les outils et l’interface de création de PiskelApp.com
- Savoir exporter son dessin en .png
- Savoir importer son projet sur scratch
- Savoir animer simplement une scène sur Scratch (costumes, dialogues, etc)
Compétences design
- Se représenter le fondement du Pixel Art et la manière de représenter simplement des images plus complexes
- Représenter graphiquement sa personnalité en personnage de pixel art
- Savoir manipuler les outils et l’interface de création de PiskelApp.com
Compétences projet
- Concevoir et mener un premier projet jusqu’au bout
La place dans le module
Jour 1
Jour 2
Jour 3
Jour 4
Jour 5
1h
🤩
30 min
🤩
30 min
🤩
1h
🤩
Déroulé de l'activité
Segmentation de l’activité
- Segment 1 (1h) : Découverte du groupe et projet de team building sur piskelapp
- Segment 2 (30min) : Créer un personnage statique + sauvegarde + import perso
- Segment 3 (30 min) : Créer une animation signature sur piskel + import sur scratch
- Segment 4 (1h) : Créer une animation + dialogue sur scratch
Détail de l’activité
Segment 1 (1h) : Découverte du groupe et projet de team building sur piskelapp
Présentation makers, module et Charte (20 min)
Ton atelier va commencer par l’accueil de tes makers, c’est un moment très important car il te permettra de donner le ton de l’atelier. Tu découvriras plusieurs profils de makers ( réservés, extravertis , curieux…) . C’est donc le moment propice pour instaurer un climat bienveillant et distiller ta magic touch.
Tu peux commencer par te présenter brièvement et demander à tes makers de se présenter également. Tu peux également leur demander s’ils connaissent déjà magic makers, et s’ils ont déjà fait de la programmation.
Une fois cette étape passée, tu peux présenter à tes makers la charte.
Enfin, tu vas pouvoir présenter à tes makers le module, tu peux leur présenter brièvement ce que vous allez faire durant ses 10 séances pour les hebdos et 5 séances pour les stages.
Brainstorming (10min)
[Animateur]
Afin de découvrir tes makers et d’introduire le pixel art , tu vas dans un premier temps leur montrer différentes images en pixel art
- Après leur avoir montré les images, questionnez les makers sur ce qu’est un pixel / ce qu’est le pixel art / s’ils connaissent des jeux, des dessins?
Rappelez que le pixel art est un des premiers moyens, au tout début de l’informatique et des premiers ordinateurs, par lesquels on pouvait “dessiner” sur ordinateur ! exemple : Pacman, Mario, DonkeyKong, etc. On doit souvent simplifier pour dessiner en pixel ! On doit donc réfléchir aux couleurs des éléments à créer, aux formes importantes et les sim
- Comment réaliser un dessin en pixel ?
Est-ce qu’on dessine en pixel comme on dessine avec un vrai stylo ? Est-ce qu’on peut faire autant de détails qu’un dessin traditionnel ou qu’un dessin numérique actuel ?
Exemple : montrez l’image de Mario pixélisé vs non pixelisé et laissez parler les makers
On doit souvent simplifier pour dessiner en pixel ! On doit donc réfléchir aux couleurs, aux formes importantes et les simplifier !
Puis tu vas leur présenter le logiciel piskelapp.
Démo active (10 min)
Piskelapp, est un logiciel qui va nous permettre de créer les graphismes de notre jeu.
Présente l’interface en créant quelque chose que tu aimes tout particulièrement, cela va te permettre d’introduire le projet de team building
Les points importants de la démo :
- aller sur Piskel
- dessiner
- choisir une couleur et en changer
- gommer
Attention : pour cette première partie, ne montre pas la pelure d’oignon car le but est de prendre en main PiskelApp par la création d’un dessin fixe.
Projet de team building ( 25 min)
Afin de pouvoir prendre en main l’outil et d’apprendre à connaître tes makers, tu vas leur proposer de créer un pixel art autour de leur passion, de créer quelque chose que tes makers apprécient tout particulièrement ou de réaliser un objet ou animal à faire deviner aux autres makers.
Si tes makers n’ont pas d’idées précises, tu peux les aiguiller en leur donnant différents thèmes ( jeu vidéo, la cuisine, les films, les animaux, le sport….).
Tips : Tu peux timer cette étape grâce à un chronomètre que tu trouveras sur ce site en disant à tes makers qu’ils ont 15/20 minutes pour créer leur projet.
Partage et export
Une fois le timer passé, tu peux montrer à tes makers comment enregistrer en .PNG leurs créations.
Puis, tu vas proposer à chacun de tes makers de partager leurs projets avec le groupe en essayant de faire deviner leurs créations aux autres makers .
[Makers]
Les makers créent leurs projets et le partagent quand le timer est terminé.
Segment 2 (30 min) : Création de l’avatar et import sur scratch
Création d’un personnage statique (20 minutes)
[Animateur]
A partir de ce projet, tout ce que tu vas créer avec tes makers sera importé dans leur projet final, il faudra bien expliciter ce point à tes makers. Les makers vont donc se lancer dans la création d’un personnage statique. N’hésite pas à montrer quelques modèles de personnages en pixel ou à faire une démonstration rapide d’un personnage.
Prends le temps de dire aux makers de sauvegarder leurs projets en png.
[Makers]
Les makers créent un personnage et l’enregistrent en png.
Création des comptes scratch/ Import du projet sur scratch (10 minutes)
[Animateur]
S’ils ont déjà un compte, vérifies que les parents ont bien validé le mail pour qu’ils puissent partager leur projet. Si ce n’est pas le cas, pense dans ton mail de suivi à prévenir les parents où demande à mettre ton mail à la place pour valider toi même les comptes.
S’ils n’ont pas de compte, créé les avec eux, tu as la possibilité d’utiliser un compte scratch enseignant pour se faire, tu trouveras sur ce lien la marche à suivre pour l’utiliser. Le nom d’utilisateur doit être simple, propose leur ‘leur prénom + leur couleur favorite ou leur animal favoris’. Note tout dans un excel pour éviter les futurs “J’ai oublié mon mot de passe !”. Tu pourras même comme ça envoyer ces informations aux parents.
Une fois le projet sauvegardé en png, tu vas passer à l’import sur scratch. Explique à tes makers que chaque nouvelle création sera importée sur scratch et expliquer brièvement ce qu’est scratch “ c’est un logiciel qui va nous permettre de créer des animations, des histoires ou des jeux grâce à la programmation”
[Makers]
Les makers se connectent à leur compte et importent leur projet
Segment 3 (30 min) : Création d’une animation signature sur piskel et import sur scratch
Démo active (10 min)
Tes makers savent comment créer un personnage statique mais ne savent pas encore comment créer une animation avec piskelapp pour permettre à vos makers de comprendre comment fonctionnent les frames et la pelure d’oignon , vous allez faire une démo en animant des lettres. Vous pouvez dire aux makers qu’on va créer une signature numérique super stylée.
Les étapes importantes de la démo sont les suivantes et sur ce lien
- montrer comment dupliquer/supprimer une frame
- le miroir
- montrer les outils de sélection qui permettent de sélectionner une partie choisie de son dessin en l’entourant
- montrer le fonctionnement de la pelure d’oignon (activée vs désactivée) et le rendu animé
- montrer comment exporter en .gif
Animation signature sur piskel app (15 min)
C’est au tour de tes makers de créer une animation avec leur prénom sur piskelapp. L’objectif est qu’il utilise les frames et qu’il sache dupliquer également.
Sauvegarde du projet (5 min)
Une fois le projet sauvegardé en gif, vous allez passer à l’import sur scratch.
[Makers]
Les makers créent leur signature sur piskel, exportent leur projet en gif et l’importent sur scratch
Segment 4 (1h) : Programmation d’ une animation piskel/import sur scratch et programmation
Création d’une animation sur piskel app (30 min)
La pelure d’oignon et les frames n’ont plus aucun secret pour tes makers.
Tu vas donc leur proposer de créer un objet/un personnage qu’ils animeront sur piskel app. Tu peux thématiser l’atelier si tu le souhaites ou si tes makers sont à court d’idées. Voici quelques idées de thèmes:
- Animer un perso pour une animation / un jeu scratch
- Créer l’évolution d’une créature / un perso Pokémon / un perso inventé / etc.
- Animer une transformation (exemple un bonhomme qui se transforme en superhéros)
- Animer un changement de saison ou un personnage à travers les saisons
- Animer un objet qui explose , qui scintille, qui s’ouvre et se ferme
Encore une fois, tu vas indiquer aux makers que ce projet fera partie de leur histoire et qu’ils auront plus de temps de création pour ce projet.
[Makers]
Les makers créent une animation sur piskelapp et l’exportent en gif
Sauvegarde et import sur scratch (5 min)
Une fois le projet sauvegardé en gif, vous allez passer à l’import sur scratch.
Programmation de l’animation ( 15 min)
On va passer à la programmation du projet.
L’objectif est de permettre à tes makers de découvrir scratch et de comprendre comment on va créer notre histoire en la programmant. “ La programmation c’est le fait de donner des instructions à mon histoire, pour se faire sur scratch, je vais devoir utiliser des blocs qui vont me permettre de donner des instructions claires à mon animation. »
Tu peux, par la suite, introduire un code simple pour les moins autonomes sur Scratch et également montrer à tes makers comment faire dialoguer un sprite.

Voici un autre exemple de code pour les plus autonomes :

Partage en grand groupe et débrief (10 min)
On prend un temps en fin d’atelier pour permettre au makers de partager leur projet. Vous pouvez également créer un studio pour que chacun des makers puissent découvrir les animations des uns et des autres. (Les makers devront partager leur projet sur scratch au préalable pour pouvoir l’ajouter au studio)
Vous pouvez profiter de ce temps de partage et de fin d’activité pour revenir sur les notions que vous avez apprises lors de cette/ ces séances.
Tips et REX
Explicite chacun de tes gestes
Aide les makers à exécuter les gestes nécessitant une motricité fine et les verbalisant, en les guidant, etc. (exemple décrire comment cliquer sur un point, étirer une forme, etc.)
Recherche d’images « modèle »
- N’hésite pas à projeter des exemples au mur et à les laisser affichés, cela peut aider les makers à dessiner
- Pour la recherche d’images, aide-toi des mots clefs « pixel art » + le mot de l’objet/élément que vous recherchez
Sauvegarde des projets
Pense à sauvegarder / capturer toutes les créations sur une clé USB ET/OU sur les comptes Scratch des makers