AstroMakey : le jeu interstellaire

Tu peux jouer à ce jeu ici : https://arcade.makecode.com/S05532-90704-14132-08995

Clique sur Blocs ou Javascript pour voir le code au complet!

Simulateur, blocs, Javascript

Suis ce tutoriel pour apprendre à coder ton propre jeu et à créer une installation pour le partager avec d’autres.


Crée ton jeu!

Tu peux utiliser l’outil gratuit Makecode Arcade pour coder ton propre jeu : https://arcade.makecode.com/

Extensions

AstroMakey utilise une extension aux codes standard de Makecode Arcade. Clique sur + Extensions pour ajouter le module suivant :

  • Arcade-background-scroll

Arrière-plan 

Ajoute un bloc « définir image d’arrière-plan » (Scène) dans le bloc en C « Au démarrage ».

Clique sur le carré gris pour ouvrir l’éditeur et dessiner l’espace!

Ajoute un bloc « Scroll background with vx vy » (Scroller) et mets vx à 0 pour que ton arrière-plan se déroule à la verticale.

Bloc : scroll background with vx 0 vy 10

Qu’arriverait-il si vx et vy étaient à 10?

Ton vaisseau spatial 

Ajoute un bloc « définir mySprite à » (Sprite) dans le bloc en C « Au démarrage »

Clique sur le carré gris pour ouvrir l’éditeur et dessiner ton vaisseau spatial!

Bloc : définir mySprite à sprite de type Player

Ajoute ensuite un bloc « déplacer mySprite avec les boutons + » (Contrôleur) pour contrôler ton vaisseau et « définir mySprite rester à l’écran » (Sprite) pour que celui-ci ne puisse pas quitter l’écran de jeu.

Bloc : déplacer mySprite avec les boutons

Ajoute une animation 

Il est possible d’ajouter des animations à ton vaisseau à l’aide d’un bloc « animer mySprite » (Animation).

Mets en boucle à « ON » et ajuste la vitesse de l’animation avec « intervalle ».

Bloc : animer mySprite

Clique sur le carré gris « trames » pour dessiner une simple animation image par image.

Illustration d'un vaisseau spatial

 Attaques 

Ajoute un bloc en C « quand bouton A est appuyé » (Contrôleur).

Insère un bloc « définir projectile à projectile depuis mySprite » (Sprite) dans ce bloc. Clique sur le carré gris pour dessiner ton projectile. Maintenant, lorsque tu appuieras sur A, un projectile sortira de ton vaisseau spatial.

Les chiffres dans vx (vitesse horizontale) et vy (vitesse verticale) détermineront la direction et la vitesse de ton projectile. Essaie différentes combinaisons!

Bloc : quand A est appuyé

Astéroïdes 

Tu peux maintenant créer des astéroïdes (ou un ennemi, si tu préfères) qui peut endommager ton vaisseau spatial et que tu peux détruire avec ton arme.

Pour ajouter du défi, tu veux que les astéroïdes apparaissent régulièrement et à un endroit choisi au hasard.

Ajoute un bloc en C « quand mise à jour du jeu chaque 2000 ms ». Tu peux ajuster la fréquence des mises à jour.

Dans ce bloc, ajoute un « définir projectile 2 à projectile depuis bord » (Sprite). Tu peux renommer projectile 2 à Astéroïde pour clarifier ton code. Ensuite, définis sa vitesse.

Le bloc « définir astéroïde x à choisir aléatoirement » (Sprite) fait apparaître l’astéroïde à un endroit au hasard en haut de ton écran. Et le bloc « définir le type de Astéroïde à Enemy » (Sprite) permet de différencier l’astéroïde de ton arme (qui est aussi un projectile).

Bloc : quand mise à jour du jeu

Maintenant, tu vas déterminer comment ton vaisseau spatial et ton arme interagissent avec l’astéroïde. Tu auras besoin de deux blocs en C « quand sprite de type X chevauche otherSprite de type Y » (Sprite).

Dans le premier, le sprite de type Player (ton vaisseau spatial) chevauche celui de type Enemy (l’astéroïde).

Ajoute un bloc « destroy other sprite » (Sprite) pour faire disparaître l’astéroïde après l’impact. Clique sur le + pour choisir un effet visuel. Ajoute un bloc « modifier la vie de -1 » (Info) pour perdre une vie.

Pour ajouter un peu de drame, tu peux même secouer la caméra avec le bloc « secouer la caméra » (Scène).

Bloc : quand sprite de type Player chevauche otherSprite de type Enemy

Dans le deuxième bloc en C, le sprite de type Projectile (ton arme) chevauche celui de type Enemy (l’astéroïde).

Ajoute un bloc « destroy other sprite » (Sprite) pour faire disparaître l’astéroïde après l’impact. Clique sur le + pour choisir un effet visuel. Ajoute un bloc « modifier le score de 1 » (Info) pour gagner un point.

Bloc : quand sprite de type Projectile chevauche otherSprite de type Enemy

Conditions de victoire et de perte 

Définis le score et le nombre de vies au début du jeu en ajoutant les blocs « définir score à 0 » (Info) et « définir vie à 3 » (Info) dans le bloc en C « Au démarrage »

Ajoute un bloc en C « on score » (Info) et insère un bloc « game over » (Jeu). Sélectionne « victoire » et tu gagneras le jeu quand le nombre de points désirés sera atteint.

Bloc : on score 100

Ajoute un bloc en C « quand vie est à zéro » (Info) et insère un bloc « game over » (Jeu). Sélectionne « perdu » pour perdre quand tu n’auras plus de vies.

Bloc : quand vie est à zéro

Musique 

Dans Arcade, il est possible d’ajouter des effets sonores et de la musique. Tu peux utiliser les mélodies proposées ou en créer des nouvelles!

Pour créer une trame sonore qui joue en continu, insère le bloc « play melody » (Musique) dans un bloc en C « Toujours » (Boucles). Tu peux définir le volume de la musique avec le bloc de ce nom.

J’ai utilisé un bloc conditionnel ou en « si » (logique) pour accélérer la musique lorsqu’il me reste seulement une vie (de 120 bpm à 336 bpm). Le symbole ≥ indique que le nombre de vies est plus grand ou égal à 2.

Bloc :toujours

Essaie d’ajouter des effets sonores aux différents sprites dans ton jeu. Par exemple, ton projectile peut faire un son pew pew en ajoutant le bloc « play sound pew pew » (Musique) dans ton bloc en C « quand bouton A est appuyé ».

Blcok : quand bouton A est appuyé

Contrôle ton jeu avec un MakeyMakey

Matériel :

  • 1 ordinateur (par exemple un Raspberry Pi!)

  • 1 MakeyMakey

  • Un fil mini-USB à USB

  • 6 fils alligator

  • 6 objets conducteurs

Branche le MakeyMakey à l’ordinateur à l’aide du fil mini-USB à USB.

Connecte un fil alligator à chaque bouton utilisé dans le jeu : flèche en haut, flèche en bas, flèche à gauche, flèche à droite et espace. Connecte l’autre bout de chaque fil à un objet conducteur différent. Assure-toi que ces objets ne se touchent pas pour éviter des courts-circuits.

Connecte le sixième à une des prises « ground ». Tu devras tenir l’autre bout de ce fil lorsque tu touches un des objets pour compléter le circuit.

Le paramétrage de base du MakeyMakey suffit pour ce projet, mais si tu dois le changer, tu peux le faire sur la page Remap du site du fournisseur.


Crée un boîtier pour ton jeu

Mesure ton équipement et utilise le site Makercase pour générer un boîtier de la bonne taille. Télécharge le fichier SVG.

Site Makercase

À l’aide d’Illustrator ou d’Inkscape, ajoute des décorations et indique les lignes à couper et celles à graver. Utiliser la découpe au laser pour couper les morceaux et assemble le tout avec de la colle à bois.

Pour plus d’information, consultez les instructions de la machine.


Apprenez-en plus sur le codage!

La page de Makecode inclut de nombreux tutoriels. Il existe aussi de nombreux livres sur le codage disponibles à la Grande Bibliothèque ou en ligne. Abonne-toi à BAnQ pour en profiter!

Suivant
Suivant

Cousez un daruma! (La Hutte)