Des lutins à télécharger pour scratch

Le logiciel de programmation par blocs Scratch plait beaucoup aux élèves. Et je dois bien avouer... à moi aussi. Ca m'intéresse notamment de pouvoir réinvestir et transmettre mon bagage de développeur et les élèves s'en sont vite rendus compte. Je les accompagne donc dans leur programmation et j'essaye de les encourager à réaliser de vrais projets, plutôt que de simplement faire bouger le petit chat vers la gauche puis vers la droite.

Evidemment, dès qu'ils se rendent compte du potentiel de l'outil, ils sont nombreux à vouloir réaliser un petit jeu. J'ai donc fait en sorte de mettre à leur disposition des "lutins" allant dans ce sens. Ces lutins sont issus de projets Scratch existants. Je les ai téléchargés, la licence Creative Commons étant la règle pour tous les projets publiés sur le site de Scratch, puis expurgés de leurs scripts. Il n'en reste donc plus que les "costumes" (c'est-à-dire des images qui correspondent à différentes versions d'un même objet/personnage, par exemple dans différentes positions), qui permettent un très beau rendu au niveau des animations.

Une petite mise en forme sympa pour les publier sur esidoc, et le tour est joué ! Voilà à quoi cela ressemble au final dans le portail du CDI :

Tu es un adepte de Scratch et tu souhaites développer des petits jeux ?

Tu peux alors utiliser les lutins ci-dessous. Ils contiennent de nombreux costumes qui te permettront d'animer leurs mouvements, leurs attaques, etc.

Pour les utiliser, clique sur le lutin qui t'intéresse et enregistre-le sur ton ordinateur. Depuis Scratch, utilise le bouton d'importation de lutin et va chercher le fichier que tu viens d'enregistrer.

Maintenant, c'est à toi d'ajouter des scripts pour leur donner vie !

Dragon Ball
Pokemon
Star wars
Mario
Sonic
Flappy Bird
Pacman
Dino run

Même si vous ne vous sentez pas une âme de programmeur pour les aider, vous pouvez compter sur vos élèves pour trouver la méthode pour utiliser ces lutins à bon escient. Et si vous voulez vraiment comprendre, voilà le principe de base :

  1. Repérer la séquence de costumes que l'on va utiliser (par exemple : de "attack1" à "attack4")
  2. Les faire se succéder pour donner une illusion d'animation
  3. Insérer une très courte attente entre 2 images car sinon l'animation serait trop rapide
  4. Associer le tout à un évènement, comme par exemple l'appui sur une touche
  5. Revenir au costume de base (par exemple : "attente")

Cela nous donnera donc le script suivant :

Pour intégrer cette bibliothèque de lutins dans esidoc, copiez le code ci-dessous puis collez-le dans le contenu html du texte d'introduction d'une rubrique (bouton "configurer").

<style><!--
.sous-titre { font-weight:bold; margin-bottom:10px; }
#lutins-scratch a { display:inline-block; border-radius:20px; padding:3px; transition:background-color 1s; }
#lutins-scratch a:hover { background-color:#D8D8D8; }
#lutins-scratch a img { margin:0px 5px 5px 10px; }
#lutins-scratch .h30 img { height:30px }
#lutins-scratch .h40 img { height:40px }
#lutins-scratch .h50 img { height:50px }
--></style>
<div>
<p>Tu es un adepte de Scratch et tu souhaites développer des petits jeux ?</p>
<p>Tu peux alors utiliser les lutins ci-dessous. Ils contiennent de nombreux costumes qui te permettront d'animer leurs mouvements, leurs attaques, etc.</p>
<img src="https://drive.google.com/uc?id=1An_teQ_RReFzmx5EfXu1HWnlegld-_sV" style="border: 0; max-width: 490px; float: right; margin: 0px 0px 0px 15px;" border="0">
<p>Pour les utiliser, clique sur le lutin qui t'intéresse et enregistre-le sur ton ordinateur. Depuis Scratch, utilise le bouton d'importation de lutin et va chercher le fichier que tu viens d'enregistrer.</p>
<p>Maintenant, c'est à toi d'ajouter des scripts pour leur donner vie !</p>
</div>
<div id="lutins-scratch">
<div><img style="border: 0; margin: 0px 5px 5px 0px;" src="https://drive.google.com/uc?id=1QB1h0gGTTZufvPauwpv7kbD2rbcqa4lz" border="0"></div>
<div class="sous-titre">Dragon Ball</div>
<div class="h50"><a href="https://drive.google.com/uc?id=1EbgSr3zkmdzut4TvSYHr2E3iLKlBMkF9" title="Goku"><img style="border: 0;" src="https://drive.google.com/uc?id=1IyIiH_qqCi7U3smss4DojNBC-UDXCC6G" border="0"></a><a href="https://drive.google.com/uc?id=1JCVpQmmsuapXGdvgTjQ14CrMTDLLKkGf" title="Vegeta"><img style="border: 0;" src="https://drive.google.com/uc?id=1baczbEGaOHoCaLYTonMV-slOoECcMlvR" border="0"></a><a href="https://drive.google.com/uc?id=1COuHhR1TV4SWMFTQm48mzteWvyftwpC-" title="Cell"><img style="border: 0;" src="https://drive.google.com/uc?id=1W7whBcAmIWPUIweb9BDZ24AHWduKG1rr" border="0"></a><a href="https://drive.google.com/uc?id=1UknqJSvo3EwdqmxlMIV-I3m6WejSGIxY" title="Garlic"><img style="border: 0;" src="https://drive.google.com/uc?id=1FnQVzQEGU_Em4swifjt50IanYbY1zX06" border="0"></a><a href="https://drive.google.com/uc?id=1-STPCS0_z9kbzNgXtcLeZys-hjjv2sWJ" title="Piccolo"><img style="border: 0;" src="https://drive.google.com/uc?id=1lgDfprMnR1yg5AY1cmq2H-ZM-b3ISHiR" border="0"></a></div>
<div class="sous-titre">Pokemon</div>
<div class="h40"><a href="https://drive.google.com/uc?id=1DbL8Muj2RPdIqMS8dhfhHqy3NgT32hBa" title="Pikachu"><img src="https://drive.google.com/uc?id=1HE2L8PdngMcwQymiB2HJxBCQ50siDjAe" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1l_ptskWaOeafnH8YWqAi2uowMP-Gkj_d" title="Salamèche"><img src="https://drive.google.com/uc?id=1khaRvKKuRq_zxuOMYyawBK1NocWuhWiM" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1NznGJQJFklWbJf0M-kdkkzeb0m9mfvYN" title="Voltali"><img src="https://drive.google.com/uc?id=1yBhy5Pl1Y4aMucLab_IqPr12KSx9vsbI" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1iJa9OH7iFj2niLKk4Al3ubJArUBTJNKW" title="Carapuce"><img src="https://drive.google.com/uc?id=1Zi0gJYMK3cqzqW4Ypv0nF-4ftkFkBMrJ" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1LquGyh4G1Xa5-CkGBOA6BC365LbA_D-u" title="Hypnomade"><img src="https://drive.google.com/uc?id=1Fxsoyx9z5kSN74k2AErGlLMs3cPLtFjr" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=11ciM1a9RJ51xK__--RwufmrRAGEwFhBz" title="Insécateur"><img src="https://drive.google.com/uc?id=1tAusHgch04xmb0WzJ2-CP8XWFnr13uSY" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1D5hUP3eNTaKHpjIlDdQsFOL2iPazJTFh" title="Osselait"><img src="https://drive.google.com/uc?id=1GY9JZ_wLN51d7gvmaYQWqtSvjkby7x6J" style="border: 0;" border="0"></a></div>
<div class="sous-titre">Star wars</div>
<div class="h40"><a href="https://drive.google.com/uc?id=1NVdprjvJDSthYsIZP2x8xJx7grM4jU7b" title="Anakin"><img src="https://drive.google.com/uc?id=1AxAtNwvMGai7iewRcVSaUawMhseu61HO" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1xdeWhR_Km1gl4nRhzXaYliy8BtL3QmD-" title="Obi-Wan"><img src="https://drive.google.com/uc?id=1oA33GW7COGIaOlYMt6cZcOfq3CWOfEFf" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1VM1NQroNS44g8mupuZpnjQoDBqni9xFe" title="Dooku"><img src="https://drive.google.com/uc?id=1WNeaLfppFGe7AJpqwdOcTJmQX8c8v7YI" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1ltqkgW39slTDHpqgOE-hp0B52ob-jBLA" title="Grievous"><img src="https://drive.google.com/uc?id=1GXPL76mpwMRpST3FtIEocWclg3N013AE" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1k7DnF0wX3f880yuA81rEXc5FrUE-b2fm" title="Stormtrooper"><img src="https://drive.google.com/uc?id=1JO74yAHNgsYLvkOYgZFoZVQtLRyurgwk" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1whRz1bo59V1yfupaGu1sZvP1dtyvcLbL" title="Super battle"><img src="https://drive.google.com/uc?id=1fPYH7l-NVfED8hIpxyT_u4dL079a1wZq" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1uC8HT-DFkGhtg3plmzJmPsNCFpU2Ml7E" title="Droide"><img src="https://drive.google.com/uc?id=1mdgRkJPgHfaW8Bs-jEt7qFgxAhHtAGpW" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1-TTSHCCh2EPhOHQSRpBOFsYjFYocIVup" title="Droidika"><img src="https://drive.google.com/uc?id=1ghpLNt8NM2ME9NM1-yyaNUIDP_IWmpoi" style="border: 0;" border="0"></a></div>
<div style="margin-top: 20px;"><img style="border: 0; margin: 0px 5px 5px 0px;" src="https://drive.google.com/uc?id=1jfTqUTeOP8MUNR6IiMcRf8fz8Hcrfctr" border="0"></div>
<div class="sous-titre">Mario</div>
<div class="h40"><a href="https://drive.google.com/uc?id=1WknkuBXFUL9KHb0h-Emx_9HuRtEh4zwZ" title="Mario"><img src="https://drive.google.com/uc?id=1kbvu7ieJHmEYfZHBOoTcG3p7Y_1ISPjD" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1dgxsl53dBbA0k8-cDdtBRF-T5Dk3f7rT" title="Koopa"><img src="https://drive.google.com/uc?id=1IUuotoxYDqhRTNDiT6GFXunvRiXk8nu8" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1lNN30TP6s2FOPXd1sNmt6ETTcqD4cadv" title="Goompa"><img src="https://drive.google.com/uc?id=1BxujHJavI4FdhmphNdOHml5KOTEn1aP_" style="border: 0; height: 30px; margin: 10px 5px 5px 10px;" border="0"></a><a href="https://drive.google.com/uc?id=1_RSacu78m1QaI_fNW8SRb1nGqWmwdCn-" title="Carapace"><img src="https://drive.google.com/uc?id=1rUQngXJE5N_Esc9iVUKA97HuyBHyKxAF" style="border: 0; height: 20px; margin: 20px 5px 5px 10px;" border="0"></a><a href="https://drive.google.com/uc?id=1amhxlGvKHkaNMOUgWe8OdhcwqDaSNqQ4" title="Piece"><img src="https://drive.google.com/uc?id=1mPUIA6idXR9br-avO_6Qe27lxFA_Vn-9" style="border: 0; height: 20px; margin: 0px 5px 25px 10px;" border="0"></a></div>
<div class="sous-titre">Sonic</div>
<div class="h40"><a href="https://drive.google.com/uc?id=1effT6mByplS4iDqt9ChtFtj8uuOIL02g" title="Sonic"><img src="https://drive.google.com/uc?id=1jb1uzxkLM8hLxZTynTdEp3D--c0Dyq8f" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1tAEpVnSv9r1DnPJbFgvaCOtEg13fN-oV" title="Egg pawn"><img src="https://drive.google.com/uc?id=1ZhZTNxMyp6k7g6Bgr8YJ_GC1v6qd6VkE" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1zkeqOWr7knIAvOMMBrbGcN6IIxwnWjM_" title="Spinner"><img src="https://drive.google.com/uc?id=1DaxxO_OiAoCCU7flfb2AOiojV8wchgxg" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1diKJjMjhR3Vog65YKxyQB-OYHkYuGEpJ" title="Anneau"><img src="https://drive.google.com/uc?id=1aJweJi_5TUj-lmE46ZhkRQ9fEi1HaARz" style="border: 0; height: 30px;" border="0"></a></div>
<div style="margin-top: 20px;"><img style="border: 0; margin: 0px 5px 5px 0px;" src="https://drive.google.com/uc?id=1UmlbaYnj0MsEtT21eOXgXQGWpGXnnoKr" border="0"></div>
<div class="sous-titre">Flappy Bird</div>
<div><a title="Oiseau" href="https://drive.google.com/uc?id=1mYSv4qt6SzOuiQhwApPU695_b61lPqmz"><img src="https://drive.google.com/uc?id=1rHh255iqiaUTqZru3R1IK6otJZPe_JLJ" style="border: 0; height: 30px; margin: 0px 5px 5px 10px;" border="0"></a><a title="Tuyau" href="https://drive.google.com/uc?id=18GRmzPVXfG2uwensHDyPVW6BbsxU6Nee"><img style="border: 0; height: 40px; margin: 0px 5px 5px 10px;" src="https://drive.google.com/uc?id=19iH0KdO4iodC6DiNVcViTSOanezKHd6T" border="0"></a></div>
<div class="sous-titre">Pacman</div>
<div class="h30"><a href="https://drive.google.com/uc?id=10i8r6FYx-A-Sx3dH4ZCnTvDOuvaN6ihH" title="Pacman"><img src="https://drive.google.com/uc?id=1sPCg7w2-hP1hgN26MBVO4_aVEsZtqi3u" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1xG-7AXtkzgWO6wSNT_C7wiQjU3xfD9HB" title="Fantôme bleu"><img src="https://drive.google.com/uc?id=1_QpyKZ8uhNwyJM2nrTeQGqb9WOyhKoxI" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=14KB4oN7zo71eE4HPhfKHNKD5GCOuOr88" title="Fantôme orange"><img src="https://drive.google.com/uc?id=10RndyUolg_tfz7lIGYpIatNJ0ADvCpSB" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=13Z9T8oTSh2NU222rYTQyIb_zl7Uc_Mns" title="Fantôme rose"><img src="https://drive.google.com/uc?id=11uaLv5uYeajcuRGt5TSxZV3Ya4GQZIXA" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=11PZSgWIQ3Rwt21JhzD3TQZwAZwQ1nrcg" title="Fantôme rouge"><img src="https://drive.google.com/uc?id=13eorjNAVq-L8WuW-dXloOPQNQE5nJKR8" style="border: 0;" border="0"></a></div>
<div class="sous-titre">Dino run</div>
<div class="h30"><a href="https://drive.google.com/uc?id=1NwCIPzqyTma-WYWK-uepuZhIi9tva1cq" title="Dino"><img src="https://drive.google.com/uc?id=1oRVJfmMF5zUDAuPr-vjr9gT_QABMwAkD" style="border: 0;" border="0"></a><a href="https://drive.google.com/uc?id=1d51mF_39klAxZxjTQOXcIuTEwOD9ut2J" title="Obstacles"><img src="https://drive.google.com/uc?id=1I4AMPf4qAA9cQvfckODl80FprsgOtl2n" style="border: 0;" border="0"></a></div>
</div>

NB : J'aurais pu faire en sorte que vous n'ayez qu'une ligne de code à copier-coller, mais au moins, là, vous pouvez éventuellement modifier ce que vous avez envie de modifier (même en n'y connaissant rien au html, vous voyez bien où se situe le texte d'introduction, par exemple, et vous pouvez parfaitement le changer).

Wii Games Summer 2010 - Mario's Kid Zone, de The Conmunity - Pop Culture Geek

2 thoughts on “Des lutins à télécharger pour scratch

  1. Bonjour,

    Merci pour toutes vos astuces Esidoc. Je viens de tester le code concernant les lutins Scratch mais ils apparaissent les uns en dessous des autres ce qui fait s’étirer l’article (cf https://0910060w.esidoc.fr/rubrique/view/id/37). En effet, j’ai essayé de publier le code en article ce qui me convenait mieux. Toutefois le problème est le même en utilisant « configuration ».

    Est-ce que cela fonctionne sur votre Esidoc ?
    Merci d’avance et belles fêtes de fin d’année !

    Audrey

  2. Bonjour,

    Oui oui ils sont sur mon esidoc et ça fonctionne très bien.
    J’ai passé un peu de temps pour essayer de comprendre et il s’avère que des sauts de lignes intempestifs s’étaient rajoutés tous seuls !!! J’ai changé la présentation et là ça devrait être bon. Je t’invite à réessayer.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *