Projet Ampoule
Dans cette page tu trouveras :
Crée ton ampoule en Pixel !
Dans ce projet, tu vas créer une ampoule qui s’allume et s’éteint quand tu cliques sur un bouton.
Tu commenceras par dessiner les deux versions de ton ampoule (éteinte et allumée) avec Piskel, puis tu les utiliseras dans Scratch pour les rendre interactives.
Crée ton ampoule éteinte
Commence par dessiner une ampoule éteinte dans Piskel. Tu peux t’inspirer d’exemples en ligne en tapant sur Google : « ampoule pixel ».
- Essaie de lui donner une forme simple : une base (le culot) en bas, et une partie ronde pour représenter le verre.
- Utilise des couleurs sobres comme le gris, le noir ou le bleu foncé, pour qu’on comprenne bien que l’ampoule est éteinte.
Crée ton ampoule allumée à partir de la première
Quand ton ampoule éteinte est terminée, clique sur « duplicate this frame » pour en faire une copie.
Dans cette nouvelle image, change les couleurs pour montrer que l’ampoule est allumée :
- ajoute du jaune, de l’orange, ou un effet lumineux autour du verre pour créer une impression de lumière.
Exporte tes deux ampoules (format GIF)
Quand tes deux ampoules sont prêtes, tu peux les enregistrer en un seul fichier GIF.
- Clique sur l’icône « Export »
- Vérifie que l’onglet « GIF » est bien sélectionné
- Laisse cochée la case « Loop repeatedly »
- Clique sur le bouton « Download » pour télécharger ton fichier GIF animé
👉 Ce fichier contiendra tes deux images (éteinte et allumée), prêtes à être utilisées dans Scratch.
Place tes éléments
Ajoute tes ampoules dans Scratch
ÉTAPE 1 :
Dans Scratch, clique sur le petit icone (avec une tête de chat, en bas à droite) pour ajouter une image. Cherche « importer un sprite ».
Choisis ton fichier GIF avec les deux ampoules.
Maintenant, ton personnage (sprite) a deux costumes : un pour l’ampoule éteinte, et un pour l’ampoule allumée.
👉 Tu peux aussi enlever le sprite du chat en cliquant sur la poubelle à côté de lui.
ÉTAPE 2 :
Si ton ampoule est trop petite, tu peux changer sa taille pour l’ajuster.
Ensuite, place ton ampoule où tu veux sur la scène (par exemple à droite ou à gauche). Pour ça, clique dessus avec ta souris et fais-la glisser à l’endroit que tu préfères.
ÉTAPE 3 :
- Va dans l’onglet « Costumes » pour vérifier que les deux versions de ton ampoule (allumée et éteinte) sont bien présentes.
- Renomme-les en OFF et ON.
Ajoute un bouton dans Scratch
Maintenant, ajoute un nouveau sprite pour faire un bouton qui permettra d’allumer et éteindre la lumière.
Choisis un sprite qui a deux costumes : un pour le bouton éteint, et un pour le bouton allumé.
Les boutons : Button2 et Button3 sont parfaits pour ça !
Place ton bouton à côté de ton ampoule.
Le Code
Programmer l’ampoule
On va créer un code pour que lorsqu’on clic sur notre bouton l’ampoule s’allume ou s’éteigne comme avec l’interrupteur d’une Maison.
Va sur le sprite de l’ampoule. Ajoute un bloc « quand je reçois message » qui se trouve dans le blocs d’Evenements.
Clic sur la petite flèche à côté de « Message1 » et sélectionne « Nouveau message ».
Puis donne lui un nom et clic sur « OK »
Ensuite, ajoute un bloc « costume suivant » qui se trouve dans les blocs Apparence.
Pour l’instant il ne se passe rien, c’est normal il faut coder le bouton qui va envoyer le message ALLUME.
Programmer le bouton
Sur le sprite du bouton, ajoute un bloc « quand ce sprite est cliqué« . Ensuite, ajoute un bloc « envoyer à tous message » et indique le nom du nouveau message appelé « ALLUME » (Sauf si tu lui a donné un autre nom).
Test ton Projet ! Normalement l’ampoule devrait s’allumer et s’éteindre lorsqu’on clic dessus.
Si tu veux que l’apparence de ton bouton change au clic tu peux rajouter à ton code existant « Costume suivant« .
Démarrer toujours sur l’ampoule éteinte
Va sur le sprite de l’ampoule. Pour que le projet commence toujours avec l’ampoule éteinte, ajoute un bloc « quand drapeau vert est cliqué« , suivi du bloc « basculer sur le costume OFF ».
C’est le moment de vérifier si tout fonctionne. Clique sur le drapeau vert, puis sur le bouton. L’ampoule doit s’allumer et s’éteindre à chaque clic. Si ça ne marche pas, relis bien les étapes ou demande de l’aide.
Bravo ! Tu viens de créer un projet interactif complet avec des dessins faits maison et du code !
Bonus
Si tu as le temps, tu peux aller dans l’onglet « Arrière-plan » et choisir un décor.
Tu peux aussi ajouter un son à ton bouton : va dans l’onglet « Sons » du bouton, choisis-en un, puis ajoute le bloc « jouer le son » dans son code juste après le clic.
