Présentation de MathABlocs

fig 01b interface

MathABlocs est un logiciel de programmation par blocs (comme Scratch), axé sur les mathématiques et présentant des fonctionnalités évoluées de Géométrie Dynamique (comme DGPad et CaRMetal).

(L'idée est de proposer une sorte d'hybride ayant un pied dans chaque monde.)

Pour tester MathABlocs (utiliser de préférence Chrome ou Firefox comme navigateur web) : lancer MathABlocs

Plan

Introduction

Première partie : généralités

Deuxième partie : fonctionnalités avancées en géométrie dynamique

A) Géométrie de la tortue : illustration avec des pentagrammes et un pavage effet 3D

1) Le pentagramme

2) Pavage effet 3D avec ou sans les couleurs dynamiques (curseurs)

3) Cinématique et escape game

B) Enregistreur de macros et programmation par blocs : illustration avec des fractales


Introduction

Si on devait résumer la philosophie de MathABlocs, on pourrait dire que le logiciel s’efforce de concilier les points de vue (et certaines fonctionnalités) de Scratch, DGPad et CaRMetal.

  • La tortue de MathABlocs est ultra-dynamique comme celle de DGPad, et mutante (elle crée des segments et des points qui peuvent être utilisés ultérieurement dans une construction) comme celle de CaRMetal. Cette tortue permet de colorier l’intérieur d’un tracé (ou d’une figure) à la manière de DGPad ou/et à la manière de CaRMetal.
  • On peut utiliser des curseurs dynamiques.
  • MathABlocs a un dispositif de type ExecuteMacro (transformation d’une macro géométrique en script) comme CaRMetal (ce dispositif manque cruellement à DGPad).
  • MathABlocs construit des figures dynamiques DGPad. Ces figures peuvent bénéficier des exports DGPad. En utilisant MathABlocs on se familiarise avec certains concepts de DGPad.

La première partie de l’article présente quelques généralités.
La seconde partie de l’article illustre quelques fonctionnalités évoluées de MathABlocs en géométrie dynamique. L’originalité ne résidera pas dans les figures construites (fractales, pentagrammes et pavages), mais dans la façon de les obtenir en combinant programmation par blocs et outils géométriques (provenant de DGPad).

Première partie : généralités

Cette partie n'est pas la plus innovante, mais elle permet de comprendre certaines bases du logiciel.

MathABlocs est un logiciel libre. C’est une application web qui peut être utilisée sans aucune installation.

MathABlocs permet de programmer des algorithmes simples. Il intègre des blocs Sofus qui apparaissent dans la palette Variables. Ces blocs facilitent la programmation des débutants (voir les programmes de calcul).

Parmi les exemples disponibles dans le menu « Démos », il y en a un avec des rangées de pions ronds ou carrés alternés (l’exemple peut dans un premier temps être simplifié en ne mettant que des disques de même couleur ou en les remplaçant par des points).

n01 interfaceb
n02 interfaceb
Le programme par blocs peut être exécuté directement (bouton « Exécuter ») ou traduit en pseudo-code exécutable par CaRMetal (bouton « Editeur »). Si on clique sur le bouton « Editeur », l’éditeur de blocs est remplacé par un éditeur textuel, le choix étant réversible (bouton « Blockly (retour à) »).

n03 interfaceb

On peut ensuite :

  • soit transférer la traduction en pseudo-code ainsi obtenue (par copier-coller) dans CaRMetal pour l’exécuter (ou pour l'utiliser dans un texte qui respecte la syntaxe des scripts du Baccalauréat).
  • soit modifier la traduction dans l’éditeur textuel de MathABlocs et l’exécuter en restant dans MathABlocs (bouton « Exécuter » de l’éditeur).

Une autre caractéristique importante du pseudo-code exécutable de CaRMetal est qu’il permet de programmer une "tortue" (= un script en géométrie de la tortue). MathABlocs ne permet pas l’exécution de ce type particulier de script CaRMetal . Mais MathABlocs permet de créer et d’exécuter des programmes avec tortues selon une syntaxe (de blocs) similaire à celle de DGPad. Plusieurs exemples sont étudiés dans la partie « Géométrie de la tortue » de cet article.

NB : MathABlocs n’aime ni les accents ni les espaces. Il est fortement conseillé de ne pas les utiliser dans les noms de variables, de procédures et de fichiers.

Un fichier MathABlocs peut être enregistré au format txt (bouton Sauver). On peut ensuite l’ouvrir (bouton Ouvrir). La procédure d’enregistrement est typique des applications web (l’enregistrement se fait automatiquement dans le dossier Téléchargements).


On peut noter la présence dans les palettes Géométrie : éléments et Géométrie : construction d'un bloc "sabot" qui permet d'utiliser un bloc de type  retour de fonction comme un bloc de type  instruction (lancement d'une procédure).
Cela permet de diviser par 2 le nombre de blocs nécessaires.

sabot


Et si on parlait micromonde?

Comment apprend-on ? Selon Jean Piaget, chacun construit ses connaissances par un processus de reconceptualisation d’expériences vécues. L’expérimentation est un élément essentiel qui ancre les savoirs.

Ce mouvement de pensée a inspiré des informaticiens comme Seymour Papert et Marvin Minsky, qui se sont attachés à développer des environnements informatiques suscitant une « pédagogie active » dans laquelle l’élève est acteur de ses apprentissages et construit ses savoirs dans des situations de recherche. L’élève est placé en situation d’autonomie, et selon l’expression de Papert, l’ordinateur devient un « outil pour penser avec ».

Les environnements informatiques conçus selon ces principes sont qualifiés de micromondes. Le premier de ces micromondes a été le langage Logo. Le plus en vogue actuellement est le logiciel Scratch. En géométrie dynamique, Cabri Géomètre a la réputation d’être un micromonde. On pourrait en dire tout autant de GeoGebra et de CaRMetal.

Pour être un micromonde, un logiciel doit avoir un certain nombre de caractéristiques :

  • Il doit être facile à apprendre et facile à utiliser.
  • Il doit être interactif (l’apprenant peut contrôler la conséquence de ses actions)
  • Il doit être extensible (l’apprenant a la possibilité d’enrichir le langage de base) : dans Scratch, c’est la création de blocs personnalisés, en géométrie dynamique c’est la création de macros.

MathABlocs est un micromonde qui combine l’extensibilité par macros (de type géométrie dynamique) et l’extensibilité par blocs personnalisés (de type Scratch).


 Deuxième partie : fonctionnalités avancées en géométrie dynamique

L’originalité de cette partie consacrée à la géométrie dynamique ne réside pas dans les figures construites (pentagramme et fractales), mais dans la façon de les obtenir en combinant programmation par blocs et outils géométriques (provenant de DGPad).

A) Géométrie de la tortue : illustration avec des pentagrammes et un pavage effet 3D


Vue d'ensemble

turtle 02

Tout comme la tortue de DGPad, dont MathABlocs exploite l'implémentation, la tortue de MathABlocs est associée à un point, qu'il faut créer préalablement. Cette tortue a une vitesse infinie (on ne visualise pas les étapes).

La tortue de MathABlocs est une tortue dynamique « mutante » (dont les points et les segments créés sont des objets de l’espace dynamique de DGPad). L'instruction "Avancer" renvoie le nom du point créé. Cette fonctionnalité que possède la tortue de CaRMetal a été ajoutée dans MathABlocs à la tortue de DGPad.

1) Le pentagramme

article MathABlocs n 01

Pour illustrer l’intérêt pratique de ce caractère « mutant », nous allons construire la figure de gauche avec la tortue, puis changer la couleur du pentagone interne en jaune (figure de droite) en utilisant des outils géométriques de DGPad.


Utilisation de la tortue

Le script est le suivant :

n pentagramme

Il crée d’abord un pentagone externe (de fond bleu), puis le recouvre par un pentagramme (de fond rouge). Au niveau de l’espace dynamique, divers objets sont construits : les points et les segments du pentagone externe, ainsi que les segments du pentagramme. Par contre, le pentagone interne est une vue de l’esprit : on le voit à l’écran, mais ses points ne sont pas (encore) des objets de l’espace dynamique de DGPad.


Utilisation d'outils DGPad

Comme les segments du pentagramme sont des objets de l’espace dynamique de DGPad, on peut créer les points du pentagone interne comme points d’intersection par manipulation directe : il suffit de cliquer sur les intersections.

article MathABlocs n 02

On crée ensuite le polygone dans l’interface DGPad, et on le colorie en jaune :

article MathABlocs n 03

On peut ensuite masquer les points avec l'outil gomme.

article MathABlocs n 01 html 98f954860d148e23


Remarque : comme dans CaRMetal, l'instruction Avancer renvoie le nom du point créé. On peut masquer les points créés par la tortue dés leur création dans le script en remplaçant :

n avancer

par

n avancer 2


2) Pavage effet 3D avec ou sans les couleurs dynamiques (curseurs)

Voir les deux variantes dans la palette Démo.

pavage

Cet exemple présente plusieurs fonctionnalités innovantes. On articule la géométrie repérée (pour placer les points) avec la géométrie de la tortue (pour construire le motif du pavage).

n pavage script b

On laisse DGPad nommer le point créé, et on récupère son nom, que l'on met dans la variable A.

n pavage figb

 

On peut masquer les points créés par la tortue et ceux créés par l'instruction "Point" dans le script avec le bloc "cacher l'objet" (voir l'exemple en ligne dans la palette Démos) :

n avancer 2

n2 masquerP

n2 pavage

3) Cinématique et escape game

Voir les trois variantes dans la palette Démo.

La fusée :

 fusee fig

fusee script

Le script pour un escape game :

escape fig

escape script

Remarque : dans deux des variantes en ligne, on a masqué les points comme expliqué précédemment.

Remarque 2 : Cet exemple peut être utilisé comme cadenas numérique (suivi d'une animation) dans un escape game

miracle b

B) Enregistreur de macros et programmation par blocs : illustration avec des fractales

Vue d'ensemble

koch

Un flocon de Koch est constitué de trois courbes de Koch, une courbe de Koch étant une courbe fractale qui peut être obtenue en itérant la transformation d’un segment en une ligne brisée. Plus précisément, on part d’un segment [P1P2] et on le transforme en une ligne brisée de 4 morceaux, puis on réapplique la transformation à chacun des 4 segments de la ligne brisée…

fig 04 Koch 01 b

Le principe en a été illustré avec CaRMetal, dans un article intitulé « Construire une figure par récursivité avec CaRMetal » .

  • grâce à l’enregistreur de macros, les manipulations permettant d’obtenir la ligne brisée sont enregistrées dans une macro-commande (c’est à dire plus ou moins un sous-programme) paramétrée par les deux points initiaux.
  • la macro-commande est utilisée dans le programme récursif CaRMetal construisant le flocon de Koch, allégeant ainsi sa programmation.

Nous allons adopter une démarche similaire dans MathABlocs :

  • l’enregistreur de macros de CaRMetal est remplacé par celui de DGPad;
  • la macro ainsi créée est transformée par MathABlocs en un sous-programme par blocs paramétré par les deux points initiaux (bouton « Macros » de l’éditeur Blockly);
  • le sous-programme est utilisée dans le programme récursif par blocs construisant le flocon de Koch.

Les manipulations à effectuer dans DGPad pour construire la macro transformant le segment initial en une ligne brisée sont détaillées dans le prochain paragraphe. Mais il n’est pas nécessaire d’en faire une lecture détaillée pour comprendre l’utilisation qui en est ensuite faite dans les programmes par blocs construisant la courbe, puis le flocon de Koch.


Réalisation de la macro transformant un segment en une ligne brisée

Pour couper en trois le segment [P1P2], le plus rapide est de le faire en créant les points à partir de formules de géométrie affine entrées directement avec l’outil « Expression » de DGPad:

article MathABlocs n 05

Une autre option consiste à utiliser la propriété de Thalès :
-* on crée un point dépendant de P1 et de P2 en dehors du segment [P1P2], par exemple en complétant un triangle équilatéral, puis on appliquant deux symétries centrales pour obtenir 4 points régulièrement espacés
-* on projette les deux points intermédiaires selon des parallèles

article MathABlocs n 02

On peut obtenir le troisième point de la ligne brisée en complétant un triangle équilatéral.

article MathABlocs n 01 html 8f3c97191cd7431b

On peut alors créer la macro dans DGPad.

article MathABlocs n 01 html 4116309505e43d56


Utilisation de la macro : premier exemple

On peut ensuite « faire basculer » la macro (que l’on a nommée Koch) dans l’interface Blockly en cliquant sur le bouton « Macros ».

n macro 01

On dispose alors d’une fonction (paramétrée par les deux points initiaux) qui a pour effet d’exécuter la macro et de retourner (sous la forme d’une liste) les trois points finaux de la macro.

Voici un exemple d’utilisation où la macro est appliquée deux fois :

n macro 10

La macro Koch est appliquée une première fois aux points A et B. Les 3 points ainsi construits sont récupérés dans une liste nommée t_Finaux : ils seront donc accessibles avec des indices (t_Finaux[0], t_Finaux[1] et t_Finaux[2]).

La numérotation dans la liste de points finaux dépend de la façon dont la macro a été définie. Ici, on peut constater avec la seconde application de la macro que t_Finaux[0] correspond au point de la ligne brisée la plus proche du point A. Et si la trace obtenue n’avait pas correspondu à cette attente, il aurait suffi d’essayer t_Finaux[1] et t_Finaux[2].


Courbe de Koch

Le programme final peut être téléchargé et testé en ligne (voir p-j).

En voici une copie d’écran que nous allons commenter :

n macro 11

On part d’un segment [P1P2] et on le transforme en une ligne brisée de 4 morceaux, puis on réapplique la transformation à chacun des 4 segments de la ligne brisée par récursivité :
-* n est la profondeur de la récursivité.
-* si n vaut 0, on ne décompose pas le segment, sinon on le décompose en une ligne brisée avec la fonction macro_Koch.
-* les points de la ligne brisée sont récupérés dans une variable locale nommée «local_tFinaux» : il est indispensable que le nom de la variable démarre par «local» pour que cette variable soit une variable locale lors de la traduction en Javascript, sinon ce serait une variable globale et la figure finale serait alors erronée à cause de la récursivité.
-* le sous-programme «segment_koch» est appliqué récursivement à chacun des 4 segments de la ligne brisée : pour qu'il fonctionne, il faut vérifier dans quel ordre les points intermédiaires de la ligne brisée ont été sauvegardés dans la variable locale et adapter si nécessaire les indices (local_tFinaux[0], local_tFinaux[1] et local_tFinaux[2]) par rapport à la copie d'écran.

On masque les points par script comme expliqué précédemment.

n2 Koch


Flocon de Koch

Pour obtenir un flocon de von Koch, on commence par construire une macro P3equi qui a pour initiaux deux points A, B et pour final le point C qui complète le triangle équilatéral ABC (dans le sens trigonométrique).

article MathABlocs n 01 html cd5d819788e001c1

On clique sur le bouton Macros pour générer une fonction qui permet d’exécuter la macro par script. On applique ensuite cette fonction pour obtenir un triangle équilatéral, aux côtés duquel on appliquera la fonction segment_Koch.

n macro 12

Voici le résultat final, après avoir modifié l'apparence des points comme expliqué précédemment (voir bloc «Courbe de Koch») :

n2 flocon Koch

 
Remarque : en utilisant le dispositif de conversion d'une macro en bloc, on peut créer des palettes personnalisées d'outils (de blocs), ce qui permet en particulier de lancer des défis du genre « construction à la règle et au compas ».

Pièces jointes :

courbe_Koch.txt [fichier MathABlocs]