Interface Homme Machine : TP 1

Sciences numériques et technologie

donnees

BBC micro:bit est une carte à microcontrôleur conçue en 2015 au Royaume-Uni pour développer l'apprentissage de l'algorithmique et de la programmation. Pourvu de capteurs et d'actionneurs, ce petit ordinateur possède la dernière technologie qui équipe les appareils modernes : téléphones mobiles, réfrigérateurs, montres intelligentes, alarmes antivol, robots, etc..
Ainsi, il s'apparente à ce que l'on nomme l'Internet des objets : Internet of Things, abrégé IoT

La carte micro:bit dispose des spécificités techniques suivantes :

  • 25 LEDs programmables individuellement
  • 2 boutons programmables
  • Broches de connexion
  • Capteurs de lumière et de température
  • Capteurs de mouvements (accéléromètre et boussole)
  • Communication sans fil, via Radio et Bluetooth
  • Interface USB
Voici la carte électronique micro:bit que nous allons utiliser pour créer des objets embarquant de l'informatique :

Micro:Bit
Carte Micro:Bit

Utilisation de la carte : premier programme

  1. Connecter la carte sur un port USB de l'ordinateur
  2. Lancer le logiciel mu-editor
  3. Lorsque le logiciel est ouvert,cliquer sur Mode , puis sélectionner BBC micro:bit et valider par OK
  4. Saisir le programme en cliquant Nouveau sur puis écrire le code suivant dans la zone de saisie
    # Programme à flasher avec le logiciel Mu en mode "BBC micro:bit"
    from microbit import * # Importe la bibliothèque microbit
    display.show("L'INFORMATIQUE C'EST SUPER")
  5. Avec enregistrer ce programme sous le nom nom_iot_prog1.py
  6. Transférer le programme dans la carte en cliquant sur Flasher
  7. Pendant le transfert, la led jaune au dos de la carte clignote. Le programme s'exécute automatiquement des la fin du transfert.

A vous de tester !

Entraînement 1 :

Créer et transférer un programme nom_iot_prog2.py enregistré dans le même dossier que le précédent avec le code source ci-dessous en respectant bien l’indentation.

# Programme à flasher avec le logiciel Mu en mode "BBC micro:bit"
from microbit import *
while True : # boucle infinie
	#Structure conditionnelle avec 3 choix
	if button_a.is_pressed() :
		display.show(Image.HAPPY)
	elif button_b.is_pressed() :
		display.show(Image.ANGRY)
	else :
		display.show(Image.SAD)
  1. Décrire l’effet du programme sur la carte. Une interaction est-elle possible?
  2. Préciser le rôle de chaque instruction. Identifier capteur et actionneur

La fonction Image.HAPPY affiche l’émoticône joyeux et la fonction Image.SAD affiche l’émoticône triste.

Micro:Bit
Émoticône

Entraînement 2 :

Vous pouvez régler la luminosité des pixels de l'affichage individuellement de 0 (désactivé) à 9 (luminosité maximale).

Micro:Bit
Les LEDs
  1. Tester et modifier le programme suivant pour afficher un carré.
    # Programme à flasher avec le logiciel Mu en mode "BBC micro:bit"
    from microbit import *
    display.set_pixel(0, 0, 9)
    display.set_pixel(1, 1, 9)
  2. Pour simplifier les programmes, il est fréquent de commander les leds en utilisant les boucles 'for' pour éviter les répétitions.

    # Programme à flasher avec le logiciel Mu en mode "BBC micro:bit"
    from microbit import *
    # allumer les leds de la 1ere ligne
    for x in range(5):
        display.set_pixel(x,0,9)

  3. Modifier le programme pour allumer la dernière ligne au lieu de la 1ere
  4. Modifier le programme pour allumer les leds d'une diagonale
  5. Ajouter une commande "display.set_pixel" pour allumer les 2 diagonales

Entraînement 3 : En mouvement

Pour créer un effet chenillard, on allume 2 leds pendant 1/10 s puis on éteint la premiere et on allume la suivante.

# Programme à flasher avec le logiciel Mu en mode "BBC micro:bit"
from microbit import *
while True:
    for x in range(4):
		display.set_pixel(x, 0, 9)
		display.set_pixel(x+1, 0, 9)
		sleep(200) # provoque une pause pendant 200ms
		display.clear()
  1. Ajouter une boucle for pour que la "chenille" poursuive son chemin en descendant la colonne de droite puis tester
  2. Ajouter 2 autres boucles for pour que la chenille tourne sur l'extérieur de la matrice

Entraînement 4 : le chiffre mystère

Le jeu consiste à trouver le chiffre tiré au hasard (compris entre 1 et 5), en appuyant à plusieurs reprises sur le bouton A.
Lorsque le nombre d'appui sur le bouton A correspond au chiffre tiré au hasard, le jeu affiche une émoticône "joyeux", dans le cas contraire "triste".

from microbit import *
import random
while True:
	chiffre = random.randint(1,1)   # affecte à la variable chiffre un nombre aléatoire
	display.scroll("?")   # affiche le caractère"?""
	sleep(1000)  # attends 1 secondes
	if button_a.get_presses() == chiffre: 
		display.show(Image.HAPPY)
		sleep(5000) # attends 5 secondes
  1. A quoi sert l'instruction "while True :"?
  2. Exécuter le programme et tester le bon fonctionnement.
  3. Modifier le programme pour que la variable chiffre soit compris entre 1 et 5.
  4. Modifier le programme pour afficher l’émoticône "triste" lorsque le nombre d'appui est incorrect

La carte micro:bit dispose aussi d'un compas électronique capable de donner l'orientation (ou cap) de la carte par rapport au nord magnétique. Cette orientation est fournie par l'appel de la fonction compass.heading() qui donne le résultat entier en tre 0 et 360.

Micro:Bit Micro:Bit
La boussole

Entraînement 5 : La boussole

  1. Téléverser le code ci-dessous afin de le tester sur la carte réelle. L'instruction "compass.calibrate()" permet de calibrer la boussole, il faut pour cela tourner la carte dans tous les sens et faire déplacer le pixel qui clignote jusqu'à ce que l'écran soit entièrement rempli
    from microbit import *
    
    compass.calibrate()
    while True:
    	cap = compass.heading() # affecte l'angle à la variable cap
    	display.scroll(str(cap)) # affcihe le cap avec une chaine de caractère
    
    .
  2. Repérer le nord de la salle de classe
  3. Le programme ci-dessous affiche une flèche vers le Nord lorsque la valeur du cap indiquée par la boussole est dans le bon intervalle.
    from microbit import *
    
    while True:
    	cap = compass.heading()
    	if 337 <= cap <=359 or 0 <= cap <= 22:
    		display.show(Image.ARROW_N)
    	else:
    		display.clear()
    
  4. Compléter le programme ci-dessus pour qu'une flèche s'affiche lorsque la valeur du cap indiquée par la boussole est dans le bon intervalle avec Image.ARROW_NE, Image.ARROW_E, Image.ARROW_SE, Image.ARROW_S, Image.ARROW_SW, Image.ARROW_W, Image.ARROW_NW.
    Image ARROW_N ARROW_NE ARROW_E ARROW_SE ARROW_S ARROW_SW ARROW_W ARROW_NW
    Angle min 22 67
    Angle max 22 67

Une IHM (Interface Homme Machine)

« Les Interfaces Homme-machine (IHM)définissent les moyens et outils mis en œuvre afin qu'un humain puisse contrôler et communiquer avec une machine ».

Pour cela, nous utiliserons deux programmes : Un sera sur le microcontrôleur et un deuxième sera tournant sur l'ordinateur.

Pour créer l'IHM, nous allons utiliser la bibliothèque Python tkinter qui va nous permettre de construire une fenêtre pour interagir avec la micro:bit. Nous utiliserons également la bibliothèque serial pour gérer les entrées/sorties à travers les ports utilisés par le système.

Entraînement 6 : Afficher la température

Le programme suivant appelé *"PRG1"* affiche la température sur la matrice mais surtout envoie la valeur de la variable "temp" et donc sa température à l'ordinateur via l'instruction print(temp) .

# PRG1 à flasher avec le logiciel Mu en mode "BBC micro:bit"
from microbit import * # Importe la bibliothèque microbit
while True: # Boucle infinie
	temp=temperature() # Initialise la variable temp à la valeur de la température
	display.scroll(temp) # Affiche la température sur le microbit
	print(temp) # Transmet la valeur de la variable à l'ordinateur

Exécuter le programme créant l'IHM ci-dessous (programme "PRG2")

# PRG2 à exécuter avec le logiciel Thonny (cliquer sur "Lancer" F5)
import serial # Importe la bibliothèque serial
from tkinter import * # Importe la bibliothèque tkinter

port = "COM6" #port série à découvrir en ligne de commande avec mode
ser = serial.Serial(port) # Déclaration de la variable ser qui ouvre le port série
ser.baudrate = 115200 # Vitesse de transmission
data = ser.readline() # On lit sur le port série ce qui est envoyé par la micro:b

ma_fenetre = Tk() # On crée une fenêtre qui sert d'interface avec la carte
ma_fenetre.geometry("400x300") # Fixe la taille de la fenêtre
ma_fenetre.title("IHM") # Donne un titre à la fenêtre
affich_temp = Label(ma_fenetre, text=data, font=("arial", 70), fg="green") # Crée le texte
affich_temp.pack() # Positionne ce texte dans notre fenêtre
ma_fenetre.mainloop() # Pour que la fenêtre reste ouverte

Recopier le programme précédent ci-dessus puis modifier les paramètres de la fenêtre IHM : les dimensions de la fenêtre, le titre, la police de caractères, la taille de la police, la couleur de la police, ... Le tester.

Entraînement 7 : Jeu

Transformer la carte micro:Bit en un terrible joystick capable de déplacer un redoutable guerrier sur l’écran et de lui faire tirer des missiles vers les méchants !

# Programme à flasher avec le logiciel Mu en mode "BBC micro:bit"
from microbit import *
display.scroll('Pret')
while True:
	lectx,lecty = accelerometer.get_x(),accelerometer.get_y()
	if button_a.is_pressed():
		bouta=1
	else :
		bouta=0
	print(lectx,",",lecty,",",bouta)
	sleep(100)

Récupérer le fichier python dans l'archive et utiliser le logiciel Thonny pour créer une interface avec le module Tkinter pour afficher le guerrier.

Dans l'archive vous trouverez, le programme python Joystick_PygameMicroBit.py permettant de déplacer et de faire tirer ce guerrier ainsi que les images et sons nécessaires.

Essayez de modifier ce programme pour qu’en appuyant sur le bouton b de la carte, le guerrier déclenche un missile qui parte verticalement vers le bas.