Cet petit article de septembre 2014 a été modifié en 2026 pour pouvoir lire les figures - ce qui n’était plus possible. Il a été mis à jour avec des outils plus récents (mode « responsive » des figures) ainsi que des liens récents en fin d’article.

Quand cet article a été écrit, la principale utilisation du logiciel était sur tablette, ou en ligne en web-app. Depuis le logiciel a été développé sur les ordinateurs (version dite « desktop ») dans les trois environnements (Linux, Windows, MacOS). On a laissé quand même l’esprit du texte original qui était assez centré « tablette » même si tout ce qui est dit s’applique aux versions récentes.

1. Le nouveau mode « Consultation »

Ce nouveau mode, même s’il paraît anodin, modifie en profondeur l’expérience utilisateur du logiciel sur tablette tactile.

1.1. Retour sur le fonctionnement de l’interface

DGPad est centré sur les objets géométriques plutôt que sur les outils. Cela signifie en particulier que les outils sont infixés aux objets : on sélectionne un objet géométrique, alors les outils disponibles pour cet objet apparaissent dans une palette contextuelle. Dans ses présentations, Alain Busser a cette très belle image de la programmation objet. Il dit que, quand on chatouille un objet géométrique, il se réveille et nous montre ce que l’on peut faire avec lui. On choisit dans sa palette contextuelle l’outil voulu, et on termine ainsi la construction de l’objet géométrique. Ainsi pour construire une droite on crée - ou sélectionne - un point. Une palette propre au point apparait, on choisit l’outil droite et on termine la droite sur le point matérialisé par le lâcher de la tablette (TouchEnd) qui peut être construit à la volée. Pour construire une parallèle à une droite donnée passant par un point donné, on sélectionne la droite, la palette contextuelle propose des outils, on choisit la parallèle et on termine la construction en créant ou en montrant le point. Ce fonctionnement est spécifique de la tablette mais bien entendu s’adapte complètement à l’usage d’une souris dans la version navigateur.

Cette nouvelle interface peut surprendre a priori, mais elle est suffisamment opérationnelle pour qu’on oublie rapidement le mode préfixé des outils des logiciels de géométrie dynamique sur ordinateur.

1.2. La trop grande sensibilité de l’interface

Cette interface est volontairement très ouverte au sens où on crée facilement des points à la volée dans l’anticipation des constructions sans rupture de l’intention de construire. Elle avait toutefois un inconvénient pratique, à savoir une trop grande sensibilité, justement, au tactile. Les élèves avec lesquels nous avons pu tester l’usage régulier de DGPad sur tablette, en seconde, les enseignants en formation, et l’auteur de ces lignes lui-même pourtant gros utilisateur, avaient une tendance naturelle à créer des points par inadvertance en voulant en sélectionner d’autres ou agir sur des curseurs. Ceci aussi bien sur la tablette directement que dans la manipulation de figures dans des articles comme ceux de MathémaTICE.

D’un point de vue didactique, ces artefacts provoquaient de vraies ruptures d’activités, moins brutales certes que les boîtes à dialogues d’un autre logiciel de géométrie très pratiqué, mais du même ordre quand même. C’était un point paradoxal de cette nouvelle interface : une grande ouverture dans l’engagement direct qui, en elle-même, pouvait provoquer une rupture de ce même engagement direct.

Bien entendu, les utilisateurs de la webApp sur ordinateur ne rencontraient pas cette situation - ou beaucoup moins - c’était essentiellement une problématique tactile.

2.3. La solution avec le mode « consultation »

L’analyse était claire : il fallait pouvoir supprimer cette trop grande sensibilité au tactile, sans compliquer l’interface, avoir un mode sans outil actif, où l’on peut simplement manipuler la figure - déplacer des points, agir sur les curseurs - mais sans créer de points.

L’auteur de DGPad a alors proposé quelque chose d’élémentaire mais qui change complètement « la consultation » des figures sur tablette : il y a désormais un mode où aucun outil n’est actif : ce mode consultation est donc aussi un mode « sans outil ». De plus, c’est désormais le mode par défaut dans toute figure téléchargée sur le web dans une webApp, donc le mode par défaut de toute figure, par exemple dans un article SPIP comme ceux déjà écrits dans MathémaTICE traitant de - ou utilisant - DGPad.

Dans ce mode consultation, comme aucun outil n’est actif, on ne peut ni éditer un objet ni lancer une expression etc. On ne fait que « consulter la figure », c’est-à-dire la manipuler, de manière dynamique.

Pour quitter le mode consultation et reprendre un mode standard il suffit de sélectionner un outil du tableau de bord : le « curseur » (la flèche) qui permet de créer de nouveaux objets mais aussi l’un quelconque des autres outils qui agissent directement sur la figure. Ainsi on peut quitter le mode consultation en entrant directement dans une expression ou dans l’inspecteur d’objet.

1.4. Utilisation en classe : Standard/ Consultation en switch

On peut dire aux élèves qui auraient du mal à manipuler leurs figures dans une séance de géométrie dynamique utilisant DGPad sur tablette qu’ils peuvent momentanément désactiver les outils : il leur suffit de « faire un tap » sur l’outil actuellement sélectionné pour passer en mode consultation : en pratique les deux modes « standard » (un outil actif) et « consultation » (aucun outil actif) fonctionnent comme un interrupteur qui agit sur le tableur de bord (actif/inactif). On peut donc compléter, par exemple une figure 3D déjà partiellement préconstruite, puis passer en mode consultation pour la manipuler et revenir en mode standard pour la corriger si nécessaire ou l’embellir.

Bien entendu, quand on s’aperçoit que l’on ne peux plus éditer une expression ou un objet géométrique, il faut se rappeler qu’on est passé en mode consultation, un oubli assez régulier au début quand on joue à explorer des figures avec paramètres par exemple.

1.5. Le mode consultation et la gestion de l’écran. Spécificité de la 3D.

Il y a deux intérêts à utiliser le mode consultation pour simplement manipuler en 3D :
• c’est un mode plus rapide (et il a été nettement optimisé au point que certaines figures complexes, comme on le verra plus loin, sont facilement consultables maintenant sur tablette) .
• le trièdre se modifie à un seul doigt ce qui est particulièrement confortable, même si le mode à deux doigts fonctionne toujours mais il est moins rapide. Sur ordinateur c’est avec clic-gauche glissé que le trièdre se modifie (qui en consultation est donc plus rapide qu’un « clic-droit glisser » correspondant à la manipulation du trièdre en mode standard).

Commencer par déselectionner le curseur à gauche du tableau de bord : vous êtes alors en mode « consultation ».
Vous pouvez déplacer le trièdre simplement à la souris : il s’agit ici de vérifier que l’équation d’un plan pris par trois points du plan ne dépend pas de ces points

Sur la figure ci-dessus, on notera les points qui servent d’ancres d’expressions pour déplacer plusieurs expressions à la fois . Sera abordé au point 4.

En 2D, comme en 3D bien entendu le zoom se fait avec deux doigts (tablette ou trackpad d’ordinateur). Mais cela ne fonctionne pas dans un site comme MathémaTICE car le zoom s’applique alors sur la page entière, et pas seulement sur l’applet de l’iframe.
En 2D, en mode consultation, la translation de la figure se fait avec un seul doigt sur tablette et par un simple « clic gauche-glisser » sur ordinateur.

On retiendra de ce paragraphe que la manipulation à l’écran - particulièrement en 3D - est simplifiée et plus rapide en mode consultation qu’en mode standard. C’est significatif sur des figures lourdes.

1.6. Conclusion

Après utilisation sur différents figures complexes, on peut témoigner que l’expérience utilisateur est réellement modifiée. Il apparaît alors que ce mode n’est pas un complément d’interface, il est une composante essentielle d’une interface infixée volontairement ouverte à l’anticipation des constructions. Mais pour arriver à cette conclusion très simple, il a fallu quelques expériences en classe pour observer les usages élèves et enseignants et les désagréments de l’interface initiale : selon ce que l’on veut en faire, nous apprenons tous les nouvelles règles de base des interfaces tactiles.

Rien que pour cette évolution, il aurait fallu une nouvelle version de l’application. Mais il y a eu beaucoup d’autres améliorations dans cette mise à jour ...

3. L’inspecteur d’objets

L’inspecteur d’objet a subi plusieurs modifications, certaines dues à l’ajout de fonctionnalités, mais plusieurs simplement ergonomiques.

3.1. La Loupe

C’est encore un retour d’expérience des premières utilisations scolaires qui ont amené à ajouter une loupe - comme celle de Sketchometry. En effet, on a tout de suite vu qu’en cours, utilisant le mode « vidéoprojection », l’enseignant comme les élèves qui prenaient la tablette ne regardaient plus la tablette mais l’écran de projection car ils pouvaient voir à la fois le doigt matérialisé par un disque jaune et le point vers lequel le doigt se dirigeait, ce que l’on ne voit pas sur la tablette car le doigt n’y est plus virtuel. Les élèves - et les enseignants - ont vite demandé à voir eux aussi le point sous le doigt d’où l’idée de faire une loupe comme dans certains logiciels de dessins vectoriels - et comme dans Sketchometry.

3.2. Les propriétés globales de l’inspecteur d’objet

La loupe n’est pas présente en mode consultation, elle est activée par défaut à la création d’une nouvelle figure. On peut alors la désactiver dans la palette par défaut - sélectionnée depuis le tableau de bord - de l’inspecteur d’objet, palette dite des propriétés globales.

Dans cette copie d’écran on voit qu’il y a trois propriétés globale : la présence ou non de la loupe, celle du mode vidéo projecteur et une couleur de fond. Cette option de couleur de fond n’est disponible que sur tablette et ordinateur, elle disparaît sur les smartphones.

On remarque que la loupe en fait n’en n’est pas une, elle ne grossit pas, elle montre juste au dessus de quel objet est le doigt pour pouvoir sélectionner correctement un point par exemple.

3.3. Nouvel item : objet inerte

Une demande des utilisateurs avancés de l’IREM de Toulouse, pour des simulations sophistiquées de leurs tutoriel et activités (lien en fin d’article) : un objet peut ne pas réagir à la sollicitation tactile ou celle de la souris.

4. La palette de comportement

Ci-dessous, la palette actuelle (2020) de DGPad, en particulier avec son icone Blockly mais lors de l’écriture de cet article il s’agissait de présenter l’icone Ancre. Pour Blockly voir les liens en fin d’article.

4.1. Ancrer des expressions

Comme illustré dans la figure des calculs d’équations de plans, l’ancre sert à associer une suite d’expressions à un point pour les déplacer simultanément. Sur cette figure, les coordonnées des 6 points M, N, P et I, J, K sont toutes attachées au même point. On peut aussi rendre inertes ces expressions, elles ne seront donc plus déplaçables que par le point d’ancrage.

Sur un même point on peut ancrer des expressions ou des curseurs comme ici les 4 curseurs coefficient de la situation (le cercle est très sensible aux paramètres a,b, c.

Exemple avec l’interface "figure restreinte dans un iframe

Pour une utilisation régulière par les élèves sans qu’ils puissent modifier la construction proposée ou accéder à des données cachées (ce qui peut court-circuiter une activité en classe), Eric Hakenholz a développé une possibilité de restreindre l’interface pour que l’utilisateur ne fasse plus de fausses manip, ni de manip non souhaitées. En particulier il n’y a plus le tableau de bord.

Dans cette figure, on a une ancre qui permet de déplacer les 4 curseurs en même temps.

La même figure « hors restrictions », avec l’interface complète du logiciel : https://lc.cx/FScal_Leibniz_2D

Le même problème de Leibniz, en 3D, avec sa sphère solution : https://lc.cx/FScal_Leibniz_3D

Dans cette nouvelle figure , l’existence de la sphère est très sensible aux paramètres a, b, c en particulier parce que le rayon de la sphère est donné par la même formule que le rayon du cercle en 2D. En conséquence, agir d’abord sur les points et le coefficient k avant de toucher aux curseurs a, b, c.

4.2 Attacher/détacher un point sur objet - interface d’utilisation

La seconde utilisation de l’ancre est d’attacher un point à un objet, et surtout de le détacher : ainsi on peut explorer une situation dans un cas général et ancrer un point à un objet, puis le dé-ancrer pour tester autre chose ...

L’interface est s(o)ignée : on prend l’ancre que l’on déplace vers l’objet d’ancrage. Un objet ancré (point ou expression) peut être dé-ancré à chaque instant, comme on le voit ci-dessous : l’ancre est donc, lui aussi, un interrupteur.

5. Les listes graphiques

Les listes graphiques sont la dernière nouveauté de cette MAJ. On est donc là dans la programmation des expressions.

Les paragraphes suivants supposent que l’on a pratiqué un peu les « expressions-programmes ». Mais bien entendu ils peuvent se parcourir juste pour la culture de ce qu’il est possible de faire.

Ces programmes pouvaient produire des listes de points. Désormais elles peuvent produire des listes soit de points soient de segments, avec quelques finitions spécifiques à cette réécriture.

5.1. Points ou segments ?

Quand on construit une liste de points, on peut désormais choisir de créer des points ou des segments :

On peut choisir (détaillé plus loin) la taille des points et des segments, et même - si cela a du sens - une opacité (très légère ci-dessus). Par exemple l’illustration sur la loupe est issue de la même figure, mais il y a des points - et pas d’opacité.

On peut directement passer des points aux segments par une simple icone de comportement (celle de droite) :

Et comme le montre cette illustration on peut prendre un point sur objet d’une liste. C’est par exemple ce qui a été fait avec les points aimantés (en fait appartenant) sur les faces des plans de la première figure : ces points sont construits par des listes, une liste par plan et les points M, N, P sont pris comme point sur objet de ces listes. En pratique en 3D, il faut que les points soit d’abord sur objet des faces et ensuite on les aimante sur les listes. Une simple aimantation par les listes (pour le moment) ne fonctionne pas en 3D.

5.2. Ni point ni segment mais une liste

Ce qui est intéressant dans cette version, par rapport à ce qui existe « ailleurs », c’est qu’il n’y a pas de création effective ni de points ni de segment. Pour donner un exemple, le code produit par le logiciel pour la figure précédente est seulement celui-ci :

// Coordinates System :
SetCoords(480.51498960212797,362.45617983785,59.02999218334108);


// Geometry :
ang=Expression("ang","","90","160","138.3","-7.4625622214879135","5.29317671036434");
n=Expression("n","","300","600","483","-3.3968323929189936","5.29317671036434");
E1=Expression("E1","","","","var tab=[];for (var i=1;i<=n;i++){var u=0.2*sqrt(i);var k=i*ang*\u03C0/180; var v=[u*cos(k),u*sin(k)];tab.push(v);};tab","-7.6319676310116185","-4.701742451534255");
List1=List("List1",E1);


// Styles :
STL(ang,"c:#007c00;s:7;sn:true;f:18;p:4;cL:200;cPT:YzojMDA3YzAwO3M6MTA7ZjozMA==");
STL(n,"c:#4f3666;s:6.5;sn:true;f:24;p:4;i:1;cL:200;cPT:YzojNzgwMDEzO3M6MTA7ZjozMDtpOjE=");
STL(E1,"c:#17502b;s:7;f:15;p:4;cL:200;cPT:YzojNzgwMDEzO3M6MTA7ZjozMA==");
STL(List1,"c:#ea15e4;s:0;f:30;p:0;sg:0.6");
SetCoordsStyle("isAxis:false;isGrid:true;isOx:true;isOy:true;isLockOx:false;isLockOy:false;centerZoom:false;color:#111111;fontSize:18;axisWidth:1;gridWidth:0.1");
SetGeneralStyle("background-color:#FFFFFF");

Autrement dit il n’y a que 4 variables, l’angle, le nombre de point, l’expression qui décrit la liste, et la liste elle-même. Son apparence est gérée par le style de la liste. Les 600 points possibles et 599 segments n’existent qu’en interne, ce qui rend les figures beaucoup plus fluides.

Par ailleurs, la taille de la liste produite par l’expression peut être variable, et donc la liste produite elle aussi. Autrement dit ces listes peuvent avoir une taille dynamique.

Dans cette figure, vous pouvez vous entrainer à modifier le style de la liste : par exemple mettre des gros points et aucun segment.

5.3. NaN pour briser les listes

Un autre raffinement des listes ayant des segments est la possibilité de briser un segment, par exemple pour changer de ligne ou de colonne. On peut donc faire des dizaines de listes en une seule fois. Par contre, dans ce cas, elles seront toutes gérées de la même façon, même taille, même couleur. Pour cela, il suffit de mettre NaN dans les coordonnées d’un point.

Voici par exemple un ruban de Moebius à k demi-tours réalisé avec deux listes, ce qui permet de mettre deux couleurs : on peut faire varier k mais aussi le nombres de segments horizontalement et verticalement. Sur tablette on déplace le ruban à un doigt, sur ordinateur avec un trackpad aussi sinon avec un« clic-gauche glisser »

Le code des expressions pour les lignes horizontales et verticales sont les suivants. On repèrera l’utilisation de NaN :

// Les lignes horizontales
//
var moebius=[];var pt=2*nbtours-1;for(var kt=0;kt<=p;kt++){var t=-1+kt*pas1;var ts2=t/2;for(var kv=0;kv<=n;kv++){var v=kv*pas2;var b2=(1+ts2*cos(pt*v/2));var kx=b2*cos(v);var ky=b2*sin(v);var kz=ts2*sin(pt*v/2);moebius.push([kx,vy*ky,h*kz])};moebius.push([NaN, NaN, NaN])};moebius

//
// Les lignes verticales
//
var moebvert=[];var pt=2*nbtours-1;for(var kv=1;kv<=n;kv++){var v=kv*pas2;var bmin=(1-cos(pt*v/2)/2);var bmax=(1+cos(pt*v/2)/2);var kx1=bmin*cos(v);var ky1=bmin*sin(v);var kz1=-sin(pt*v/2)/2;var kx2=bmax*cos(v);var ky2=bmax*sin(v);var kz2=sin(pt*v/2)/2;moebvert.push([kx1,vy*ky1,h*kz1],[kx2,vy*ky2,h*kz2],[NaN,NaN,NaN])};moebvert

5.4. Inspecteur de liste

Si on sélectionne une liste graphique par l’inspecteur d’objets, on peut jouer sur deux paramètres : la taille des points et l’épaisseur des segments.

Chacun des deux « taille » et « segment » peuvent être réglés en dixièmes de pixel en dessous de 1 pixel. Chacun des deux peut être nul ... mais, bien-sûr, pas les deux simultanément. On peut y mettre de l’opacité.

Exemple avec l’algorithme GingerBreadMan (GGBM) dont la condition initiale (point A) est aimantée par tous les points représentés par une croix. Vous pouvez modifier le style en choisissant l’icone « roue » dans le tableau de bord.

Voici une illustration d’une version du GGBM nettement plus sophistiquée, mais un peu grande pour s’afficher avec tout l’interface du logiciel dans le squelette de SPIP :

Manipuler cette figure en ligne https://lc.cx/GGBM_Ade_Blibre (Ade pour A sur la grille des demi-entiers)

Quelques infos sur le logiciel

DGPad est webApp, c’est-à-dire une utilisation dans un navigateur. C’est l’utilisation à privilégier dans un cadre scolaire sans tablette.

Depuis 2020, DGPad est aussi une

application « desktop » disponible pour les trois environnements Linux, Windows et MacOS.

Une première vidéo

de 15 min, par l’auteur du logiciel, présentant les premières fonctionnalité

Une deuxième vidéo, sur la programmation dans les expressions (7 min), réservée, selon l’auteur, aux « power users ».

On peut consulter ce document, très complet, datant de 2023 donc avec le blockly de DGPad) : https://lc.cx/DGPad_IRES_Toulouse qui comprend aussi de nombreuses activités de collège.

Dans MathémaTICE, voici des articles plus récents sur DGPad :

Tout d’abord
• sur le Blockly de DGPad (40 figures) puis
• sur la tortue de DGPad (170 figures) deux mises à jours majeures de DGPad (2016) avant les versions desktop.

Mais aussi ces articles
• sur les spirolatères, avec une partie « mise en œuvre en collège » (mémoire M2 CAPES Maths) et les « spirolatères dynamiques » pour les enseignants avec une belle utilisation des listes,
• sur le temps dans Scratch et DGPad
• ou encore, ce surprenant prolongement d’une question de base en Scratch en classe de 5°.

Toujours avec DGPad, depuis 2022 l’auteur de cet article alimente régulièrement un site sur les géométries non euclidiennes (plus de 700 figures début 2026).
Cet article de présentation, dans MathémaTICE, y est consacré.