Introduction

Prête à plonger dans l’univers passionnant de la programmation ?

Tout au long de cet atelier, tu vas pouvoir imaginer, coder et donner vie à tes idées grâce à un objet génial : la carte micro:bit !

Tu pourras aussi découvrir Lily, une jeune fille curieuse d’en apprendre plus, et Timy, son animal de compagnie, qui t’aideront à travers ton aventure et des découvertes !

Qu’est-ce qu’un micro:bit ?

C’est l’équivalent d’un mini ordinateur de la taille d’une carte à jouer, et comme un ordinateur, on va pouvoir écrire des programmes dessus !

Tu vas pouvoir afficher des choses à l’écran et contrôler ton micro:bit à l’aide des boutons.

Il existe plein d’autres manières d’utiliser la carte programmable, que tu vas découvrir tout au long du stage !

Analysons un programme

Un programme c’est simplement une série de d’instructions, de choses à faire.

Si les micro:bit parlaient français, voici à quoi ressemblerait un programme :

1
2
3
4

Affiche un point au centre
Affiche "Bonjour !"
Si j'appuie sur le bouton A :
    Affiche un coeur

Malheureusement, les cartes micro:bit ne comprennent que le Python. Le but de ce stage est donc de voir comment écrire nos commandes en utilisant le langage Python.

Comme premier exemple, analysons ce programme :

    

    




1
2
3


# Indique qu'on va écrire des commandes pour le microbit
from microbit import *
 





4


display.set_pixel(0, 2, 9)





5


sleep(500)





 6
 7
 8
 9
10
11
12


display.set_pixel(1, 2, 9)
sleep(500)
display.set_pixel(2, 2, 9)
sleep(500)
display.set_pixel(3, 2, 9)
sleep(500)
display.set_pixel(4, 2, 9)




    

Essaye d’envoyer ce programme sur ton micro:bit ! Pour cela, rends-toi sur le site https://python.microbit.org , supprime le texte déjà écrit et copie-colle celui de l’exemple.

Tu peux ensuite appuyer sur le bouton violet en bas à gauche “Send to micro:bit”, et suivre les commandes.

Une fois envoyé, tu devrais voir une barre de chargement s’afficher sur ton micro:bit.

Afficher des informations

Dans l’exemple de la partie précédente, on utilisait des commandes différentes pour chaque action.

Dans cette partie, on va voir les fonctions qui commencent par display.. Elles correspondent aux fonctions qui servent à afficher quelque chose à l’écran.

Allumer des LED

Comme tu as pu le remarquer, au centre du micro:bit se trouvent 25 petit carrés lumineux. Ils sont appelés LED (ou pixels).

La première méthode pour afficher quelque chose consiste à choisir une LED sur l’écran et l’allumer.

Pour cela, on utilise la fonction display.set_pixel(colonne, ligne, intensite), où :

• colonne représente le numéro de la colonne de la LED à allumer (un nombre de 0 à 4)
• ligne représente le numéro de la ligne de la LED à allumer (un nombre de 0 à 4)
• intensite représente la luminosité de la LED qu’on va allumer (un nombre de 0 à 9).

En programmation, on compte toujours à partir de 0. Sur le micro:bit, c’est pareil : la première colonne correspond à la colonne 0 ; de même pour les lignes.

Voici un schéma pour le visualiser :

Si on voulait écrire un programme qui allume la même LED que sur le schéma ci-dessus, voici ce qu’il faudrait écrire :

1
2
3
4
5
6

# Indique qu'on va écrire des commandes pour le microbit
from microbit import *

# Allume la LED de la 4ème colonne et 2ème ligne à une intensité de 9
# car on commence à compter à partir de 0
display.set_pixel(4, 2, 9)

À toi de jouer !

Pour savoir si tu as bien compris cette partie, dessine nous un cœur !

Ça devrait ressembler à quelque chose comme ça :

Tout éteindre

Comme tu peux le voir, une fois les LED allumées, elles ne s’éteignent jamais. Tant que le micro:bit reste branché, les LED resteront allumées.

Pour éteindre 1 LED, tu peux mettre l’intensité dans la fonction set_pixel à 0.

Pour éteindre toutes les LED d’un coup, tu peux utiliser la fonction clear :

1
2
3
4
5
6
7
8

# Indique qu'on va écrire des commandes pour le microbit
from microbit import *

# Éteint le pixel au milieu du micro:bit
display.set_pixel(2, 2, 0)

# Éteint toutes les LED
display.clear()

Les images

Pour afficher des images et des symboles déjà existants, on utilisera cette fonction : display.show(Image.NOM_IMAGE), où NOM_IMAGE est le nom anglais d’une image pré-enregistrée. Tu peux trouver la liste des images pré-enregistrées ici .

Voici à quoi ressemblent les images HEART et HAPPY :

1
2
3
4
5

# Indique qu'on va écrire des commandes pour le micro:bit
from microbit import *

# Affiche l'image HEART
display.show(Image.HEART)

Ça va trop vite…

Si l’on souhaite afficher une première image, puis une autre, sur le micro:bit, il suffit de mettre les 2 lignes à la suite :

1
2
3
4
5
6
7

# Indique qu'on va écrire des commandes pour le microbit
from microbit import *

# Affiche l'image HEART
display.show(Image.HEART)
# Affiche l'image HAPPY
display.show(Image.HAPPY)

Sauf que l’exécution de ces 2 lignes est beaucoup trop rapide ! Le micro:bit affiche la 1ere image en 1 milliseconde, puis la deuxième. Ce qui est pas suffisant pour qu’on puisse nous-même apercevoir l’image.

Tu peux dire au micro:bit d’attendre un certain temps avec la commande sleep(TEMPS), avec TEMPS un nombre de millisecondes.

1
2
3
4
5

# Indique qu'on va écrire des commandes pour le microbit
from microbit import *

# Attends 2 secondes
sleep(2000)

Et le texte ?

Pour afficher du texte à l’écran, on utilise la fonction display.scroll(message), où message est le texte que tu veux afficher.

1
2
3
4

# Indique qu'on va écrire des commandes pour le microbit
from microbit import *

display.scroll("Les stages Girls Can Code! c'est trop bien !")

Le code ci-dessus devrait afficher “Les stages Girls Can Code! c’est trop bien !” sur ton micro:bit. N’hésite pas à lui envoyer pour voir ce que ça donne !

1
2

display.scroll()   # Ceci est une commande
"display.scroll()" # Ceci est du texte

Le défi de Lily

Lily veut écrire un programme pour son propre micro:bit.

Elle a besoin d’afficher une barre de chargement sur la ligne du milieu (en allumant les LED de la 3ème ligne une par une), puis d’écrire le message "Bonjour Prologin !" suivi d’un smiley qui sourit.

Mais elle ne sait pas comment l’écrire, et aimerait que quelqu’un l’aide.

Une mémoire de poisson rouge

Un ordinateur, ça ne retient rien. Du moins, pas tant qu’on ne lui demande pas de le faire.

Pour ça, on utilise ce qui s’appelle une variable.

Une variable, c’est comme une boîte. Son nom, c’est l’étiquette qui permet de la reconnaître, et on met ce qu’on veut dedans.

Créer une variable

Voici comment on crée une variable :

1

ma_variable = 10

Lorsqu’on écrit ma_variable = 10, voici ce qui se passe dans l’ordinateur :

Il crée une nouvelle boîte

Il ajoute l’étiquette ma_variable dessus

Il met 10 dans la boîte

Utiliser une variable

Pour utiliser une variable, il suffit d’écrire son nom comme ceci : ma_variable.

Vu que ce n’est pas du texte (il n’y a pas de guillemets), le micro:bit va regarder s’il a une boîte avec la bonne étiquette. Si c’est le cas, il va utiliser ce qu’on a stocké dedans.

Voici un petit exemple pour illustrer :

    

    




1


ma_variable = 10





2


display.scroll(ma_variable)




    

Modifier le contenu de la boîte

Pour mettre à jour une variable, il suffit d’en créer une autre du même nom.

L’ancienne boîte est automatiquement supprimée.

    

    




1


nombre = 10





2


nombre = 1 + 1




    

Quoi stocker ?

Dans une variable, on peut stocker n’importe quelle information que l’on veut.

En programmation, nous avons souvent 3 types de variables : les nombres, les chaînes de caractères et les booléens.

Les nombres

Les nombres en Python peuvent être entiers ou décimaux. Comme tout nombre qui existe, on peut faire des opérations dessus :

1
2
3
4
5
6

1 + 1  # addition
1 - 1  # soustraction
1 * 1  # multiplication
1 / 1  # division
1 // 1 # division entière
1 % 1  # reste de la division entière

Un petit rappel sur les divisions entières ?

Une division entière, c’est une division posée sur papier. On s’arrête dès qu’on ne peut plus soustraire :

Ici, on a donc 17 // 5 = 3, et 17 % 5 = 2

N’hésite pas à appeler un.e orga pour t’expliquer si tu n’as pas compris !

    

    



1


a = 1




2


b = 2




3


print(a + b)



    

1
2

nombre_total_croissants = 42
prix_croissant = 1.2 # le prix d'un croissant

Du texte, toujours plus de texte

Comme on l’a vu plus tôt, les chaînes de caractères sont reconnaissables car elles sont entre guillemets.

Mais on peut aussi les mettre à la suite :

1

"Bon" + "jour" # donne "Bonjour"

Toute variable qui stocke du texte (c’est à dire une chaîne de caractères) peut être utilisée comme du texte.

    

    




1


a = "GC"




2


b = "C!"




3


print(a + b)




    

Transformation !

1

10 + "2" # erreur

On peut transformer l’un en nombre, avec int :

1

10 + int("2")

ou l’autre en chaîne de caractères, avec str :

1

str(10) + "2"

Bien sûr, la même chose s’applique lorsque les valeurs sont stockées dans des variables.

1
2
3
4

variable = 42             # contient le nombre 42
type(variable)            # Affiche `<class 'int'>` car c'est un entier
variable2 = str(variable) # contient le texte "42"
type(variable2)            # Affiche `<class 'str'>` car c'est un entier

1
2

variable = "42"           # contient le texte "42"
variable2 = int(variable) # contient le nombre 42

J’affirme !

Un booléen, c’est soit True (vrai), soit False (faux). Ça permet de donner l’état d’une affirmation. Par exemple :

    

    




1


c_est_vrai = 1 < 2





2


c_est_faux = 1 > 2




    

Voici tous les symboles permettant de faire des opérations de comparaison :

Ça et ça ou ça et pas ça

Il existe 3 opérateurs qui nous permettent de faire des affirmations plus précises :

1

"a" < "b" and 30 / 4 > 6 or 9 % 4 == 1

Comment utiliser les boutons du micro:bit ?

Comme tu peux le voir, il y a deux boutons physiques sur le micro:bit : le bouton A (1) et le bouton B (2). Il existe également un bouton tactile (3) au niveau du logo au-dessus de l’écran.

Nombre d’appuis

Pour utiliser les boutons A et B, tu peux respectivement utiliser la fonction button_a.get_presses() et button_b.get_presses().

Ces fonctions renvoient le nombre d’appuis sur le bouton depuis la dernière fois qu’elles ont été appelées.

Par exemple, ce code va afficher le nombre de fois que le bouton A a été appuyé au cours des 5 premières secondes du programme :

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20

# Importe les fonctions pour le micro:bit
from microbit import *

# Compte à rebours
display.set_pixel(0, 2, 9)
sleep(1000)
display.set_pixel(1, 2, 9)
sleep(1000)
display.set_pixel(2, 2, 9)
sleep(1000)
display.set_pixel(3, 2, 9)
sleep(1000)
display.set_pixel(4, 2, 9)
sleep(1000)

# Récupère le nombre d'appuis sur le bouton A
a = button_a.get_presses()

# Affiche le nombre d'appuis sur le bouton A
display.scroll("Total : " + str(a))

Un exemple un peu plus complexe

À toi de jouer ! Que fais le programme d’après toi ? Essaye de le lancer sur ton micro:bit !

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

# Importe les fonctions pour le micro:bit
from microbit import *

# Compte à rebours
display.set_pixel(0, 2, 9)
sleep(1000)
display.set_pixel(1, 2, 9)
sleep(1000)
display.set_pixel(2, 2, 9)
sleep(1000)
display.set_pixel(3, 2, 9)
sleep(1000)
display.set_pixel(4, 2, 9)
sleep(1000)

# Récupère le nombre d'appuis sur le bouton A
a = button_a.get_presses()

# Affiche le nombre d'appuis sur le bouton A
display.scroll("Total : " + str(a))

# Que se passe-t-il ici ?
display.scroll("Ici ?" + str(a))

# Que se passe-t-il ici ?
a = button_a.get_presses()
display.scroll("Et ici ?" + str(a))

Si tu ne comprends pas ce qu’il se passe n’hésites surtout pas à demander aux organisateurs !

Et si…

En programmation, tu voudras parfois qu’un certain bout de code s’effectue seulement si une condition est vraie, ou effectuer un autre bout de code si cette dernière n’est pas vraie.

Commençons d’abord par regarder des exemples que tu pourrais rencontrer dans la vie courante de l’utilisation des condititons.

Utilisation d’une condition

Utilisation d’une condition avec une action si elle n’est pas vérifiée

Utilisation de plusieurs conditions chaînées

Avant de continuer…

Avant d’attaquer la suite, il est primordial de comprendre ce qu’est l’indentation. Elle permet de définir des blocs dans notre code.

L’indentation correspond au nombre d’espaces au début d’une ligne et avant une instruction. Dans l’exemple de code ci-dessous, la première ligne a un niveau d’indentation de 0 tandis que la deuxième ligne à un niveau d’indentation de 1 qu’on représente par 4 espaces.

1
2
3

display.scroll("Coucou") # Ligne qui n'est pas indentée
if True:
    display.show(Image.HAPPY) # Ligne qui est indentée 1 fois

Garder l’indentation permet de faire plusieurs instructions dans le même bloc.

Pour créer ces blocs, nous allons utiliser la touche tabulation du clavier. Elle permet de rajouter 4 espaces en 1 touche. Elle devrait ressembler à ça :

Revenons à nos conditions

Pour rendre nos programmes intelligents, nous allons leur dire de faire certaines instructions, uniquement dans certains cas, du même genre que : “S’il pleut, je prends un parapluie” ; je prends le parapluie s’il pleut uniquement, pas besoin de l’avoir s’il fait beau.

En Python, on va poser ce type de questions grâce aux instructions if, elif et else.

L’instruction if (si 🇫🇷), que l’on fait suivre d’une condition que l’on veut tester.
Elle permet d’exécuter un morceau de code que lorsqu’une condition est vraie.

Pour écrire une condition, la syntaxe est : if condition: suivi d’un bloc de code indenté. Le bloc de code en question sera alors exécuté uniquement si condition est vraie (True).

Essaye d’exécuter ce code en cliquant sur le bouton Run !

Un if peut être accompagné d’un else (sinon 🇫🇷) qui exécute un bloc de code uniquement si la condition du if est fausse.

Enfin, il y a aussi le elif qui est la contraction du else et du if. Il n’est exécuté que si sa condition est vraie et que les conditions précédentes sont fausses.

Voici un petit exemple pour illustrer :

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13

# Importe les fonctions pour le micro:bit
from microbit import *

x = 0

if x < 30:
    display.scroll("Pomme")
elif x < 50:
    display.scroll("Poire")
elif x < 80:
    display.scroll("Banane")
else:
    display.scroll("Orange")

Si jamais tu as une question ou s’il y a quelque chose que tu n’as pas compris, n’hésite pas à demander aux organisateurs et organisatrices.

Ça fait beaucoup de lignes

Tu sais maintenant comment créer des programmes assez complexes. Pour répéter une action et t’éviter de copier-coller des bouts de code, il existe en Python ce que l’on appelle des boucles.

Il existe deux types de boucles : les boucles for et les boucles while.

Tant que

La boucle while (tant que 🇫🇷) est une boucle dont le bloc de code est répété tant qu’une condition est vérifiée (d’où son nom). On l’écrit while condition:. On peut trouver des examples dans la vie courante :

Illustrons cette boucle à travers un exemple de code :

    

    




1
2


from microbit import *
 





3


while button_a.get_presses() == 0:





4
5
6


    # Ce qui suit va être répété tant que le button A n'a pas été appuyé
    display.show(Image.ANGRY)
 





7


display.scroll("Tu es sortie !")




    

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

# Importe les fonctions pour le micro:bit
from microbit import *

while True:
    # Vérifie si le bouton A a été appuyé
    if button_a.get_presses() > 0:
        display.show(Image.HAPPY)

    # Vérifie si le bouton B a été appuyé
    if button_b.get_presses() > 0:
        display.show(Image.ANGRY)

Pour un certain nombre de fois

La boucle for est un peu différente de la boucle while, car elle permet de répéter un bloc de code un nombre fini de fois. Ce nombre de répétitions doit être connu pour pouvoir utiliser ce type de boucle.

Les boucles simples

Le nombre dans les parenthèses de range indique le nombre de répétitions, ici la boucle répète 3 fois le bloc de code en-dessous.

1
2
3

for i in range(3):
    # Affiche "Test."
    print("Test.")

La variable de la boucle for

La variable i indique le numéro de la répétition, en partant de 0, la boucle fera 5 répétitions.

i étant une variable, tu peux changer son nom si tu as envie :

Voici un petit schéma pour bien différencier les différents blocs de code :

À toi de jouer !

Cette fois-ci, Lily veut impressionner ses amis en écrivant son programme en 4 lignes maximum ! Elle veut que sa carte affiche une diagonale (comme sur l’image ci-dessous) pixel par pixel en partant du coin haut-gauche avec une pause de 500ms entre chaque pixel qui s’allume.

Une variable score

Comme dans un jeu vidéo, on peut combiner les variables avec les boucles, pour calculer des scores, ou tout autre donnée dont on a besoin toute la partie.

Pour faire ça, on crée une variable avant la boucle, et on met à jour sa valeur, dans la boucle. Par exemple :

À toi de jouer !

Lily te demande d’afficher le nombre total de pixels situés à gauche de la diagonale à la fin du programme.

Tu peux reprendre ton programme précédent en utilisant une variable total qui va compter au fil de la boucle le nombre de pixels situés à gauche du pixel que tu as allumé.

Projet

Il est maintenant temps de mettre en pratique tout ce que tu as appris au cours de ce TP avec un petit projet. Rien de compliqué, je te rassure, et puis si tu as des questions, les organisateurs et organisatrices sont là pour ça !

But

Lily est dans la panade… Elle aurait besoin de deux dés à 6 faces pour jouer au Monopoly avec ses amis, mais elle les a oubliés, et tout ce qu’elle a à sa disposition est un micro:bit…

Lily te demande alors de lui faire un programme qui simule un lancé de deux dés et affiche la valeur des deux dés lorsque l’un des boutons (A ou B) est appuyé.

Cependant, comme Lily ne veut pas que ses amis pensent qu’elle a simplement oublié les vrais dés, elle voudrait donc y ajouter quelques fonctionnalités :

• Elle voudrait que si le lancé est un double (les 2 dés sont les mêmes), un smiley content s’affiche juste après les chiffres :

• Par contre, elle voudrait que si deux doubles sont faits d’affilée, un smiley pas content s’affiche à la place du smiley content :

• Elle voudrait enfin que le smiley disparaisse 2 secondes après être apparu

On te conseille vivement de faire ce projet étape par étape. Tu peux commencer par coder le lancer des deux dés, et lorsque cela fonctionne, ajouter les différentes demandes de Lily les unes après les autres.

De plus, n’hésite pas à poser des questions si tu es bloquée, les orgas seront très contents de t’aider !

Conclusion

Voili voilou, je crois que mon rôle touche à sa fin. Si quelque chose ne te semble pas clair, pose la question aux orgas ! Tu peux nous faire part de tes remarques pour améliorer ce TP et le rendre encore plus clair.

Mais ce n’est pas parce que ce TP est terminé que tu es lachée dans la nature pour autant. Il te reste encore plein de trucs à découvrir, que ce soit en Python ou bien en rapport au micro:bit. Tu as de nombreux autres TPs qui sont disponibles. Ils se présentent plutôt sous la forme de petits projets centrés sur l’utilisation d’un composant en particulier du micro:bit. Tu peux ainsi apprendre à utiliser pleinement le micro:bit pour ensuite créer tes propres projets !

Nous t’invitons donc à choisir les projets qui t’intéressent et avancer à ton rythme !