Apprendre la programmation aux enfants avec le langage Logo
C’est un constat décevant, mais il existe aujourd’hui très peu de ressources facilement accessibles pour permettre aux ados et pré-ados d’apprendre la programmation informatique par eux-même ! Paradoxalement, on trouvait beaucoup plus de littérature grand public dans les années 80 sur ce sujet, à la grande époque des premiers pas de la micro-informatique et de l’ubiquité du langage BASIC. En cherchant un peu sur le net, on peut quand même retrouver un outil de choix conçu à l’époque pour familiariser les enfants avec l’algorithmique de façon ludique : le langage Logo. Voici un petit guide de mise en route à l’aide de ressources libres et gratuites.
Petit historique du Logo
Ce langage de programmation a été mis au point à la fin des années soixante au MIT par Seymour Papert, un passionné d’intelligence artificielle et de pédagogie. Célèbre pour sa “tortue” que les enfants peuvent guider pour dessiner avec quelques instructions simples, c’est pourtant un langage complet et très sérieux, de la même famille que le langage LISP, très utilisé en intelligence artificielle, et qui est à la base de quelques-uns des utilitaires les plus utilisés du monde UNIX. C’est dans les années 80, avec l’arrivée des micro-ordinateurs “ludo-éducatifs” bon marché dans les écoles et collèges, que le langage Logo a connu son apogée dans l’enseignement scolaire. Il a peu-à-peu disparu complètement des écrans dans l’enseignement français, alors que la formation des élèves était de plus en plus orientée vers un usage pratique des outils bureautiques professionnels (cf la préparation au B2I, actuellement très orientée vers l’utilisation d’outils propriétaires Microsoft…), au détriment de l’apprentissage des rudiments de la programmation.
Le langage Logo a pourtant continué à être développé activement, et il en existe aujourd’hui toutes sortes de versions, dont de nombreuses disponibles gratuitement sous forme de logiciel libre sous licence GPL, adaptés à tous les environnements courants (GNU/Linux, Mac, Windows). Nous nous concentrerons ici sur l’utilisation de la version développée et maintenue par l’Université de Californie à Berkeley : le Berkeley Logo, alias UCBLogo. Elle est disponible librement en téléchargement pour toutes les plates-formes courantes, et peut être facilement configurée pour traduire le vocabulaire du langage en français.
Découverte en ligne du Logo
Avant même de passer à l’installation en local d’un environnement Logo, on peut découvrir immédiatement en quelques clics la programmation de la fameuse “tortue graphique” Logo depuis un navigateur connecté au web, sans rien installer, en cliquant simplement sur ce lien.
Ce petit démonstrateur écrit en Javascript n’implémente qu’une toute petite partie du langage Logo, entièrement dédiée au pilotage de la tortue, mais c’est suffisant pour faire nos premiers pas.
On découvre un écran divisé en deux parties : à gauche, un grand carré constitue la zone d’évolution de la “tortue”, représentée au centre par un petit cercle vert, le petit segment de ligne droite représentant sa “tête” qui permet de déterminer son orientation. Au début de la session, la tortue est placée au centre de la zone, sa “tête” orientée à droite (en général dans les autres versions de Logo, la tortue démarre en étant orientée vers le haut).
La partie gauche de l’écran contient la zone de programmation, qui se fait “ligne par ligne”. On tape les commandes dans le champ de saisie en haut à droite, et l’historique des commandes vient s’afficher dans la zone de texte située juste en-dessous.
Premiers pas avec la tortue Logo
La page d’aide de cette tortue Logo nous rappelle les principales commandes disponibles. Nous pouvons commencer par faire avancer la tortue de cent “pas” (correspondant à des pixels à l’écran) en tapant simplement la commande :
AVANCE 100 |
ou encore, en abrégé :
AV 100 |
(utiliser la touche entrée ou le bouton “OK” pour valider chaque commande successive)
Puis nous pouvons faire “tourner” la tortue vers la gauche en lui demandant de pivoter selon un angle de 90 degrés :
TOURNEGAUCHE 90 |
ou en abrégé :
TG 90 |
Si nous avançons à nouveau de 100 pas, la tortue aura tracé deux segments de droite se rejoignant à angle droit :
AV 100 |
Les autres commandes de déplacement courantes à expérimenter son respectivement :
TD angle |
pour
TOURNEDROITE angle |
et
RE pas |
pour
RECULE pas |
Pour les commandes de rotation, l’angle est à indiquer en degrés. Si vous n’êtes pas familier avec les angles trigonométriques, vous pouvez utiliser un rapporteur. Ou simplement vous souvenir que l’angle droit fait 90°, le demi-tour 180° et le tour complet 360°, et diviser vos angles à partir de là. Pour effacer l’écran et ramener la tortue au centre, nous utiliserons la commande :
VE |
pour “Vide Ecran”.
Programmer une première procédure
Au départ, la tortue ne sait pas faire grand chose. Nous allons donc lui “apprendre” à exécuter des actions plus évoluées. C’est ce que l’on appelle programmer une procédure. Comme nous allons le voir, rien de plus facile, ludique et intuitif que la programmation dans ces conditions.
Nous allons apprendre à la tortue à dessiner un carré.
Tout d’abord, vérifions que la tortue ne sait pas encore faire de carré. Tapez la commande “CARRE” suivi du bouton “OK” ou de la touche “entrée”. Vous obtenez un message d’erreur :
“Error: Commande inconnue: carre”
Nous allons donc pouvoir apprendre cette nouvelle “commande” à la tortue. Pour cela, entrer la série d’instructions suivantes :
POUR CARRE AV 100 TD 90 AV 100 TD 90 AV 100 TD 90 AV 100 FIN |
Voilà, nous venons d’apprendre à la tortue à tracer un carré, c’est à dire à tracer quatre segments de droite de 100 pixels reliés par des angles droits. Vérifiez le en lançant la procédure CARRE :
Taper préalablement “VE“, valider (pour effacer l’écran) puis tapez “CARRE” suivi du bouton “OK” ou de la touche entrée. Cette fois, plus de message d’erreur, la tortue a bien “appris” à tracer un carré. Remarquons au passage (c’est important pour la suite), que la tortue est maintenant orienté avec la “tête” vers le haut. Autrement dit, à la fin du carré, elle termine dans une position orientée à 90° vers la gauche (angle droit) par rapport à sa position de départ.
Si nous tapons à nouveau “CARRE“, nous allons donc lui faire dessiner un autre carré superposé au premier, du fait de cette nouvelle position de départ.
Utiliser notre procédure dans un programme
Les nouvelles commandes apprises à la tortue peuvent elle-même être réutilisées comme “blocs de base” pour construire des commandes plus évoluées. Par exemple, nous allons maintenant apprendre à la tortue à dessiner une fenêtre, basée sur la procédure “CARRE” que nous venons de lui apprendre.
Entrons la suite d’instruction suivante :
POUR FENETRE VE CARRE CARRE CARRE CARRE FIN |
Essayons notre nouveau programme en tapant “FENETRE” et en validant.
Ce programme efface l’écran (VE), puis trace 4 carrés successifs. Comme la tortue a pivoté de 90 degrés vers la gauche à la fin de chaque carré (comme vu ci-dessus), nous avons donc maintenant à l’écran une jolie fenêtre composée de 4 carrés. C’est notre premier programme !
Soyons paresseux, utilisons les boucles de répétition
Dans les deux exemples ci-dessus, nous avons construit nos procédures en multipliant des instructions élémentaires répétitives. Ce n’est pas une façon très “économe” de programmer. Les programmeurs ont horreur de la répétition : ils préfèrent s’économiser en utilisant une commande de répétition automatique plutôt que de retaper plusieurs fois les mêmes instructions.
Voici comment nous pouvons réécrire notre procédure “CARRE” en utilisant une “boucle” de répétition :
POUR CARRE REPETE 4 [ AV 100 TD 90 ] FIN |
Notez que cette façon de définir le carré est beaucoup plus courte et pratique. En programmation on appelle cela “l’élégance”. Essayez-là :
CARRE |
Elle fonctionne tout aussi bien que notre premier essai. Par contre, en lançant à nouveau le programme “FENETRE“, nous nous rendons compte que notre réécriture de la procédure CARRE a eu une conséquence supplémentaire, indésirable : on appelle cela un “effet de bord”. En effet, si l’on relit attentivement le code de la procédure CARRE, on s’apperçoit qu’à la fin de la séquence d’instruction, la tortue tourne une dernière fois de 90 degrés vers la droite (TD 90).
Cette rotation “en trop” explique que dans le programme “FENETRE“, nous avons maintenant un retour de la tortue à sa position de départ avant chaque tracé de carré. Comme les quatre tracés de carrés sont maintenant superposés, le résultat final ne ressemble plus du tout à une fenêtre !
Nous allons donc corriger le programme “FENETRE“, et en profiter au passage pour le simplifier lui-aussi en utilisant une boucle de répétition :
POUR FENETRE
REPETE 4 [
CARRE
TG 90
]
FIN |
Voilà qui est assurément plus simple. Ce que nous venons de faire avec le code de nos instructions pour la tortue, en le rendant plus simple, plus pratique et plus lisible, et en supprimant les répétitions s’appelle une “refactorisation”, qui rend notre code plus “élégant”. C’est un des processus les plus important dans la pratique de la programmation moderne !
Puisque nous sommes dans le vocabulaire, précisions au passage que la fonction de répétition automatique s’appelle un “structure de contrôle”. Nous en verrons d’autres par la suite.
C’est tout pour ces premiers pas.
Dans la suite de cet article, nous apprendrons notamment à utiliser les valeurs variables pour paramétrer nos procédures, puis nous verrons comment installer un environnement logo plus complet sur un poste de travail, afin de pouvoir expérimenter librement avec toutes les fonctionnalités de ce langage, et notamment la récursion, qui nous permettra en quelques lignes de code d’apprendre à notre chère tortue à dessiner minutieusement, au choix, des arbres ou des broccolis !
Un dernier exemple pour la route !
POUR ROSACE
VE
REPETE 36 [
CARRE
TD 20
]
FIN |
ROSACE |
A suivre…