A) Introduction
Dans le N°49 de MathémaTICE [1], j’ai présenté le prototype d’une suite logicielle combinant quatre outils en ligne (Blockly, Proglab, Xcas et PluriAlgo), en mettant en relief diverses façons de faire cohabiter ces outils.
Dans le N°50, le prototype devient une suite logicielle à part entière nommée Mathém@ALGO (prononcez MathémaALGO), que je mets à disposition sur mes pages professionnelles [2]. Pour ce nouvel article, j’adopterai un point de vue complémentaire, en organisant mon exposé en fonction des langages de programmation : AlgoBox, puis Javascript, puis Python...
De nouvelles fonctionnalités seront également présentées, en particulier :
- la possibilité d’exécuter un programme Javascript faisant des graphiques avec une ou plusieurs tortues.
- la possibilité d’exécuter un programme Javascool, grâce à une adaptation d’un interpréteur de programmes Processing (langage conçu pour faire des animations graphiques).
- la possibilité d’exporter un programme Blockly en Python, puis de le compléter et de l’exécuter.
B) Mathém@ALGO et AlgoBox
Introduction
Comme je l’ai montré dans le N°49, il est facile de passer automatiquement d’un programme Blockly (exemple) à un programme AlgoBox via Javascript (exemple).
Il y a donc une continuité pédagogique naturelle entre la programmation visuelle (au collège) et la programmation textuelle avec AlgoBox (au lycée). Mais comment s’en servir concrètement ? C’est la question à laquelle je vais m’intéresser dans la section B.
Le passage automatique de Blockly à AlgoBox peut être un moyen pédagogique d’aborder la programmation textuelle avec AlgoBox : en effet, on peut envisager d’illustrer chaque notion algorithmique de base avec un programme visuel pour ensuite en obtenir la traduction en AlgoBox.
Mais après cette phase initiale d’apprentissage du langage, y-a-t-il encore un intérêt pratique à passer par la programmation visuelle quand on veut traiter un exercice en AlgoBox ? Ma réponse est « oui dans certaines situations », et j’en donne deux exemples.
Attention (fonctionnement d’AlgoBox dans l’onglet Proglab) : pour que l’environnement Proglab apparaisse dans cet onglet, il faut ensuite débloquer la page web (icône de la barre d’adresses du navigateur) car contenu mixte http/https.
Exemple 1
Je reprends l’exemple de l’introduction, qui porte sur les calculs de pourcentages. Il n’y a a priori aucune raison de demander aux élèves de passer par Blockly pour obtenir un code AlgoBox tel que celui-ci :
Mais si après plusieurs tentatives vous voyez certains élèves échouer parce qu’ils ne savent pas calculer un pourcentage (situation hélas loin d’être rarissime), il me semble opportun de les orienter vers Blockly qui, grâce à son extension Sophus, propose deux blocs permettant de calculer des pourcentages.
Plus généralement, une étape intermédiaire avec Blockly peut être profitable quand il y a des instructions transformant des variables numériques : augmenter une variable, diminuer une variable… En effet, leur équivalent en AlgoBox (ou en pseudo-code) est beaucoup moins intuitif.
Exemple 2
La résolution d’une équation du second degré est un grand classique. Or, il y a 3 cas à examiner et AlgoBox est hélas peu pratique pour gérer les instructions conditionnelles dans cette situation.
Il me semble donc opportun de passer d’abord par la programmation visuelle. Mais Blockly est hélas peu convivial lorsqu’il s’agit d’écrire les expressions calculant le discriminant et les solutions de l’équation. Je suggère donc de n’écrire qu’une partie du programme, par exemple ceci :
Même incomplet, ce programme visuel peut être exporté en Javascript (voir résultat), puis converti en AlgoBox par Proglab (voir résultat). Il ne reste plus qu’à le compléter.
C) Mathém@ALGO et Javascript
Introduction
Proglab gérant aussi le langage Javascript, les exemples traités en AlgoBox dans la section B peuvent être repris. Je m’intéresserai donc à d’autres fonctionnalités de Mathém@ALGO, notamment la possibilité d’exécuter des programmes Javascript multi-tortues ou gérant des animations Processing. Cela se fait à partir du sous-onglet « Exécution » de l’onglet « PluriAlgo » :
Option ProcessingJS
Logiciel de création multimédia, Processing [3] permet de dessiner, réaliser des animations graphiques…
Il est opérationnel sur toute plateforme pouvant faire fonctionner des logiciels conçus en Java. Il en existe une version Javascript, nommée ProcessingJS, qui permet d’exécuter des programmes Processing en ligne avec un navigateur web : je l’ai intégrée dans Mathem@ALGO.
Le sous-onglet Exécution permet donc non seulement d’exécuter des programmes Javascript « classiques », mais aussi de les enrichir avec des primitives spécifiques à Processing :
Pour faciliter la programmation de cet exemple, il est possible de passer d’abord par un programme visuel avec l’extension ProcessingJS de Blockly, puis d’en obtenir la traduction (voir illustration). Je vous invite également à tester le deuxième exemple disponible, qui fait rebondir une boule de billard [4] .
Option tortues
Cette option multi-tortues peut apparaître comme un gadget et c’est peut-être le cas d’ailleurs : je ne sais pas quelles applications pédagogiques elle peut avoir au lycée actuellement, mais de nouveaux enseignements peuvent y être créés dans un futur proche afin d’illustrer l’intérêt de la programmation objet.
Je ne vais donc pas m’intéresser à une hypothétique formation des élèves, mais vais chercher à donner une culture générale dans ce domaine aux enseignants. A l’origine, je n’en n’avais nulle intention, mais ce sont des débats internes au comité de rédaction de MathémaTICE (que je viens d’intégrer) qui m’ont incité à le faire.
- Programmation objet et tortues
Pour ceux qui souhaitent simplement proposer des activités mono ou multi-tortue(s) à leur élèves, je signale que j’ai intégré dans l’onglet Blockly l’extension tortues de Sofus [5].
D) Les autres langages gérés par Mathém@ALGO
Introduction
Quand j’ai publié mon premier article sur Mathém@ALGO dans le N°49, seuls deux langages pouvaient y être exécutés, grâce à l’onglet Proglab : AlgoBox et Javascript. Avec la création du sous-onglet Exécution, deux nouveaux langages sont exécutables en ligne : Python et Javascool. Je consacrerai donc une sous-section à chacun de ces deux langages.
Python
Dans la version en ligne du logiciel PluriAlgo, j’avais intégré un outil (Skulpt) permettant d’exécuter des programmes Python [6] . J’en ai fait de même avec Mathém@ALGO : donc, en cliquant sur le lien « Python » de la page principale du sous-onglet Exécution, vous pourrez exécuter des programmes Python.
Les concepteurs de Blockly ayant eu la bonne idée de prévoir non seulement un traducteur en Javascript, mais aussi en Python, il est possible de passer dans un premier temps par la programmation visuelle (voir exemple et résultat).
Javascool
Dans la section C, j’ai montré que le sous-onglet Execution peut être configuré pour exécuter des programmes Javascript enrichis par des primitives Processing (dessin d’une ellipse par exemple). Dans le programme correspondant, j’ai employé une syntaxe Javascript. Mais il est également possible d’utiliser la syntaxe originelle de Processing, dont ProcessingJS est une adaptation fonctionnant en ligne avec un navigateur web (voir exemple).
La syntaxe est étant proche de celle de Javascool, j’ai procédé à quelques aménagements pour pouvoir exécuter des programmes Javascool, par exemple celui-ci (créé en grande partie avec l’onglet PluriAlgo, voir indication) :
E) Conclusion
La suite logicielle Mathem@ALGO a pour but de faciliter l’enseignement de l’algorithmique, plus particulièrement dans un cadre mathématique où :
- elle permet de programmer [7] des exemples géométriques (avec JSXGraph, DGPad ou ProcessingJS) et de les animer (ProcessingJS).
- elle simplifie l’écriture de programmes dans plusieurs langages mathématiques (Scilab, Xcas et R), grâce à PluriAlgo.
Ma proposition (SésaAlgo) faite à l’association Sésamath dans le N° 49 n’ayant pas abouti, Mathem@ALGO sera hébergée uniquement sur mes pages professionnelles à l’université de Pau.