Scratch : tutoriel Spacewar

Étiquettes

, , ,

Spacewar

Spacewar ! (Ou plutôt Spassoire, comme diraient mes petits sixièmes…) Le premier jeu vidéo de l’histoire de l’informatique ! Spacewar a inspiré nombre de jeux et constitue une référence ultime, tant par son principe que par l’ordinateur mythique sur lequel il a été développé, le PDP-1 dont vous pouvez découvrir l’écran via l’image d’illustration.

J’ai plusieurs fois travaillé sur Spacewar avec des groupes d’enfants d’âges différents. C’est un jeu assez simple à développer en Scratch, tout au moins dans une version remixée et simplifiée que je vous propose dans ce tutoriel, dédicacé à mon amie Elaine avec qui j’aurais le plaisir prochainement d’animer un atelier autour de ce jeu. Pour info, c’est un atelier qui peut en fonction des enfants prendre une à deux séances d’1h30. On peut le coupler avec une initiation à la Makey Makey pour créer ensuite la manette du jeu.

Le principe est simple : un vaisseau au centre de l’écran qui s’oriente en fonction de la souris, des astéroïdes qui parcourent l’écran et qu’il va falloir éviter en les désintégrant.

Commençons par le décor. Ne supprimez pas le chat et en lieu et place du fond blanc, utilisons un arrière-plan noir, que l’on peut très facilement réaliser dans l’interface de dessin à l’aide de l’outil « pot de peinture ».

fond

A l’époque, les concepteurs de Spacewar avait créé un petit programme qui reproduisait fidèlement la voûte étoilée en décor. Nous ne serons pas aussi pointilleux mais que serait l’espace sans ses étoiles ? Notre astuce va constituer à cacher le chat et à lui faire dessiner au hasard 50 points blancs au démarrage du jeu. Cela reste cependant optionnel et vous pouvez passer cette étape pour intégrer directement le vaisseau spatial.

Je n’utilise pas les limites extrêmes de l’écran de Scratch (-240 et 240 pour X, -180 et 180 pour Y), histoire de ne pas avoir d’étoiles contre le bord de l’écran, ce qui est assez disgracieux. De même, la taille du stylo est portée à 2 sinon les étoiles paraissent très petites. On peut aussi faire varier la taille pour donner une impression de profondeur mais, pour aujourd’hui, je fais simple.

etoiles

Passons maintenant au vaisseau. Dans la bibliothèque des lutins, choisissons « spaceship ».

spaceship

Attention ! Pour que notre jeu fonctionne correctement, il va falloir l’orienter à droite, c’est-à-dire tourner la fusée vers la droite, ce qui est l’orientation naturelle des lutins de Scratch. Pour cela, je convertis l’image en bitmap (en bas à droite), utilise l’outil « sélectionner » et tourne le lutin grâce à la poignée à droite.

spaceship2

Ajoutons maintenant le code relativement simple pour ce personnage qui ne fait que tourner en s’orientant vers la souris.

spaceship-code

Les ennemis, les ennemis, les ennemis ! Dans la bibliothèque des lutins, choisissons « rocks ».

Le comportement de ce lutin est automatique : il avance sans cesse et se multiplie lorsqu’il rebondit sur les bords. On utilise pour cela la fonction « clone ». Lorsqu’il rebondit, on utilise un angle aléatoire entre 160 et 200 degrés, de manière à ce qu’il fasse demi-tour mais en le faisant dévier sinon notre lutin suivrait sans cesse la même trajectoire.

rocks-code

Ajoutons un autre test dans la boucle de manière à ce que lorsque « rocks » touche « spaceship » la partie soit perdue.

rocks-code2

Comme vous pouvez le constater, nous avons un léger bug. Pour éviter que l’astéroïde ne touche notre vaisseau dès le départ du jeu, ajoutons un peu d’aléatoire. Il se peut aussi parfois que votre astéroïde rebondisse un peu trop sur les bords. Dans ce cas, vous pouvez modifier l’angle par une valeur entre 180 et 220 ou plus.

rocks-code3

Pour que le clone ne reste pas inactif, il faut dupliquer le comportement du lutin de la manière suivante. Attention à bien supprimer la fonction « créer un clone de moi-même » sinon gare à la multiplication sauvage. En quelques secondes, ce sont des dizaines de clones qui vont envahir l’écran.

clonerocks

Il reste un sérieux problème : notre vaisseau ne peut pas se défendre. C’est le moment de lui dessiner un missile. Pour cela, je dessine nouveau lutin en forme de balle que je n’oublie pas de centrer.

ball

Ce lutin va avoir un comportement relativement simple aussi. Il est placé au centre, là où se trouve notre vaisseau. Lorsque l’on appuie sur la touche « espace », il apparaît, s’oriente vers la souris, avance droit devant lui jusqu’à ce qu’il touche le bord ou un astéroïde pour enfin disparaître (mais ce ne sera pas sans conséquences pour l’astéroïde😉 ).

Commençons par lui donner quelques paramètres de départ. La taille peut varier en fonction de votre dessin.

bullet1

Ajoutons les instructions pour le tir. Vous pouvez modifier la vitesse de tir en changeant le 10 par une valeur plus importante (plus facile) ou plus lente (plus dur !).

bullet2

Revenons maintenant à nos astéroïdes dont je ne donne pas cher de la peau lorsqu’ils rencontreront nos missiles. Il va falloir ajouter une boucle dans le code de manière à ce que l’astéroïde disparaisse lorsqu’il est touché. On peut choisir deux modes de jeu : le premier, le plus classique, est de terminer le jeu lorsqu’il n’y a plus d’astéroïde ; le second est infini et ne se terminera qu’à la mort de notre vaisseau. Personnellement je choisis le second. Notre astéroïde-mère va simplement être renvoyé ailleurs au hasard comme au début du code, tandis que les astéroïdes-clones seront purement et simplement supprimés.

Modifions le code de notre astéroïde-mère pour qu’il réagisse au nouveau lutin (que j’ai renommé « bullet »).

rocks-code4

Modifions ensuite le code de l’astéroïde-clone.

rocks-clone-code

Ca va déjà mieux et notre vaisseau est prêt à défendre la galaxie. Mais il manque encore un élément. Comment sait-on en effet qu’on est « the best of the best » et que l’on a fait un super score ? En créant un score… Allons dans la partie « données » et créons une variable nommée naturellement « Score ». Restons sur l’astéroïde « rocks » et ajoutons ce petit bout de code pour que le score soit bien à zéro au début du jeu (pas de tricheries !😉 ).

Score1

Enfin, ajoutons sur le code de l’astéroïde-mère une instruction pour faire évoluer le score. Chaque fois que notre astéroïde avance, on ajoute un point au score.

Score2

Que reste-t-il à faire ? Jouer ! Retrouvez l’ensemble du code sur Scratch : https://scratch.mit.edu/projects/105041653/

Numérique et prévention : interdire ou éduquer ?

Rouet

Lors d’une table ronde organisée ce mercredi par les Milkshakers à Bordeaux durant la semaine digitale, j’étais invité à témoigner de mon usage du numérique auprès des enfants. Enfance et numérique, tel était le thème de la discussion et bien évidemment s’est posée la question de la prévention. Comme le rappelait si bien Lorraine Reinsberger des Milkshakers, l’approche frontale a peu de sens et est loin d’être suivie d’efficacité. Enfance et numérique, c’est avant tout leur donner les outils pour comprendre le monde numérique et l’aborder de manière positive et raisonnée. Certes, l’addiction et les comportements à risques existent et je ne me poserai pas dans un monde de bisounours. Mais l’interdit est à mon sens la pire des méthodes.

En 1996, je faisais partie des fondateurs de l’association lilloise Spiritek agissant dans le domaine de la prévention de la toxicomanie en milieu festif. L’objectif était double : d’une part, combattre les comportements à risques, informer les usagers et les engager dans une démarche de réduction, voire de suppression de la consommation ; d’autre part, défendre la culture de la musique électronique sous toutes ses formes et plus particulièrement le milieu des rave parties dont nous étions pour la plupart tous issus. Bruit, musique faite par des ordinateurs, musique de drogués, illégale, poussant à la violence… La musique techno et les raves étaient taxées de tous les noms et nombre de complications nous étaient régulièrement servies par divers censeurs sous des prétextes fallacieux. Nous n’avons certes jamais nié les problèmes que pouvaient rencontrer le milieu mais il était particulièrement rageant de voir que tous les maux de la société et de la jeunesse étaient parfois concentrés sur les raves. Certes, il y avait de la drogue mais pas plus que dans les clubs par exemple ou dans d’autres lieux festifs. Pour organiser les soirées de manière légale, les embûches étaient nombreuses voire insurmontables et il ne fallait pas s’étonner que nous finissions par ne plus demander d’autorisations ou par inventer des stratagèmes pour franchir les obstacles. J’ai bien du organiser quatre ou cinq fois à l’époque mes fiançailles virtuelles avec une amie pour obtenir simplement une salle des fêtes où nous organisions alors une soirée techno digne de ce nom.😉

Bref, les interdits étaient là et nous nous en foutions complètement. Spiritek fut par contre la réponse que nous avions trouvée pour montrer aux autorités que cette communauté n’était pas un ramassis de drogués mais bel et bien constituée de nombre de gens responsables, cultivés et ayant juste envie de faire la fête comme il l’entendait. « Il y a les clubs pour cela », nous répondait l’Etat. Mais, quand vous ne trouvez nulle part la musique et l’atmosphère que vous aimez, vous êtes bien forcés d’organiser vos propres événements.

Le discours de Spiritek n’a jamais été un discours fait d’interdits mais beaucoup plus novateur que cela. Il s’agissait d’informer, d’alerter et d’éduquer pour orienter vers des comportements responsables. Nous aurions pu brandir des immenses panneaux clamant « la drogue, c’est le mal » ; les usagers auraient quand même consommé les produits. Autant alors que notre action porte plus sur un accompagnement et une réduction des risques afin que tout se passe dans les meilleures conditions. Les salles de shoot qui vont ouvrir en région parisienne en sont un très bon exemple.

L’interdit n’est jamais bon et incite même à le dépasser. Force est de constater que, quand on évoque « enfance et numérique », on prône plus souvent l’interdit qu’une réelle éducation des usagers. Et pourtant…

Prenons un petit exemple sur la base d’une histoire bien connue. La Belle au Bois Dormant, ça vous dit quelque chose ? Sinon, petite piqûre de rappel :

À l’occasion du baptême de la princesse, le roi et la reine organisent une fête somptueuse, invitant famille, amis et sept fées marraines (ou trois fées selon les versions) bienveillantes de l’enfant. Chacune d’elles offre un don à la princesse : beauté, grâce, etc. Brusquement une vieille fée, qui n’a pas été invitée, se présente et lance à la princesse un charme mortel : la princesse se piquera le doigt sur le fuseau d’un rouet et en mourra. Heureusement, une des jeunes fées marraines qui s’était cachée pour parler en dernier atténue la malédiction : « Au lieu d’en mourir, elle tombera seulement dans un profond sommeil qui durera 100 ans, au terme desquels le fils d’un roi viendra la réveiller ».

Pour protéger sa fille, le roi fait immédiatement interdire de filer au fuseau ou d’avoir un fuseau sous peine de mort. Pourtant, vers ses quinze ans, dans une partie reculée du château, la princesse découvre une vieille fileuse qui ne connait pas l’interdiction. Elle se pique aussitôt au fuseau et s’endort, en même temps que tous les habitants du château. Au cours des ans, celui-ci est recouvert de végétation. Il n’est redécouvert qu’après 100 ans, lorsqu’un fils de roi y pénètre et réveille la princesse. (Source : Wikipédia)

Bref, remettons dans le contexte actuel. La sorcière n’est pas invitée au baptême. Vexée, elle lâche un méchant virus sur le système en prévenant qu’un de ces quatre, la princesse va installer sans y faire attention un malware au travers par exemple d’un jeu vidéo en flash, d’une extension du navigateur ou d’une énième barre des tâches dans Internet Explorer. Le roi passe un coup de fil à la Corée du Nord et à la Chine, blinde son système, établit des procédures de surveillance et édicte des lois inefficaces sur le long terme et surtout liberticides. (Bizarrement, j’ai l’impression que cela fait écho à des tas de choses, cette version…) La princesse, en surfant sur Royaumebook, finit par sympathiser avec le profil de Bogoss59 « parce qu’il est trop craquant »,  et qui, peu de temps après, lui demande de lui envoyer de l’argent car il est coincé en Côte d’Ivoire avec sa mère malade. La princesse s’exécute. Il la remercie en lui envoyant un gif animé de Nyancat et un plugin génial pour son rouet connecté (ou brodeuse numérique) dans un mail tout plein d’images trop choupi de chatons. Pas de bol… Derrière Bogoss59 se cache la vieille sorcière et le plugin génial n’est pas un plugin génial mais une copie améliorée de Stuxnet avec une pincée de Locky. Bref, c’est le gros b…, pardon, la panique dans tout le royaume.

(Et ça pourrait être pire si elle avait rencontré Bogoss59 mais je n’ai pas l’intention de faire dans le gore…)

Passons maintenant à la version que je préfère (et que je préconise).

Je vous épargne le rappel des faits : baptême, sorcière pas contente « tu vas voir ton système comment je vais te le flinguer ! », blindage sécuritaire des serveurs mais… Une fois la princesse en âge de comprendre un peu l’informatique, le roi lui offre son premier ordinateur (sous Linux Mint !😉 ), lui donne quelques manuels et entame son éducation par un vibrant « ma fille, faut qu’on cause ». La princesse apprend à programmer avec Scratch, passe ensuite au Python, fait ses dictées en LaTeX, développe son site avec HTML5 tout en tâtant un peu de Ruby. En parcourant les forums dédiés, la princesse apprend énormément de choses sur la sécurité, les faux profils et le fonctionnement des malwares. Dans un fablab, elle découvre la broderie numérique qui devient sa passion qu’elle complète avec la programmation d’un Lilypad, l’équivalent d’un Arduino mais dédié au textile. Lorsque Bogoss59 entre en contact avec elle, elle fait immédiatement une recherche d’images et se rend compte de la supercherie. Elle n’en continue pas moins à converser avec lui, histoire de le traquer sur les réseaux, lorsque, poussé dans ses retranchements, l’histoire de la Côte d’Ivoire ayant magistralement foiré, la princesse ayant proposé de payer en bitcoins, bogoss59 lui envoie le plugin génial qu’elle n’exécute pas mais étudie dans une sandbox, toute contente d’avoir récupéré une copie de Stuxnet à peu de frais (copie qu’elle va pouvoir refiler aux services de contre-espionnage de son père). Dans tous les cas, même sans toutes ces connaissances, la princesse a lu le manuel de sa brodeuse numérique et elle se rend bien compte que le plugin ne peut pas fonctionner.

La morale ? Éduquer ou interdire😉 ?

Tranches de vie : la ducasse de quartier

Ducasse

Cours de géographie prospective au collège Albert Samain de Roubaix, on imagine ou plutôt les élèves imaginent la ville de demain. Roubaix en 2030, 2040, voire 2050. Quels changements ? Quelle vision du futur ? Ils cherchent une définition de la smart city, la ville intelligente, et rivalisent d’imagination pour faire de leur ville la plus belle ville qui soit.

Soudain Laetitia (le prénom a été modifié) a une question, une question importante. Laetitia est arrivée il y a peu de temps au collège et on vient tous les deux un peu du même coin. On partage un certain vocabulaire local. C’est pour cela que Laetitia me demande comment on écrit « ducasse ». À Lille, on parle de « foire aux manèges ». C’est plus select, plus en rapport avec ce quasi-parc d’attractions qui s’installe une fois l’an au moment de la braderie. Des centaines de mètres d’allées, plusieurs dizaines de manèges… Une vraie foire

La ducasse, pour les non-nordistes au sens large (Pas-de-Calais compris), c’est en patois la fête de la Dédicace, la fête du Saint patron de la paroisse, l’occasion depuis des siècles de s’amuser. Pendant la ducasse, on va sur les chevaux de bois ou dans la chenille, on tire à la carabine et on se gave de nougat, de guimauves, de gaufres et de croustillons (et de frites de chez <pub inside>Maxime Frites</pub inside>😉 ). La ducasse aujourd’hui, c’est celle du quartier ou juste deux-trois manèges et un stand de confiseries sur la place du village. La ducasse, c’est sacré… Et Laetitia voulait savoir s’il y avait une ducasse à Roubaix.

Mais pourquoi chercher une ducasse ? Pour s’amuser uniquement ? Non, comme elle l’exprimait bien du haut de ses 11 ans, c’est un moment de fête pour la ville, pour le quartier. Les gens s’y retrouvent. C’est un espace un peu à part où les lumières, la musique, les bruits des machines et les boniments sont omniprésents. C’est un moment à part qui participe au vivre-ensemble. Voila pourquoi Laetitia cherchait une ducasse…😉

(Il y en a ! On les attend maintenant avec impatience.)