Projet IHM - Tableau numérique interactif

Introduction au sujet

Ce projet est avant tout un projet d'IHM. Vous devrez donc vous focaliser sur cet aspect en priorité puisque l'évaluation de votre travail reposera dessus : respectez les principes ergonomiques listés ci-après, réfléchissez aux interactions possibles, à l'aspect didactique, à l'homogénéité de l'interface, etc. Un fonctionnement parfait de l'application n'est pas demandé.

Le but de ce projet est de permettre l'utilisation d'un tableau numérique interactif dans le cadre des enseignements dispensés en sciences. Des exemples d'utilisation des TNI appliqués à la pédagogie sont disponibles sur le site du ministère de l'éducation national : éduscol.

Il est possible d'utiliser des capteurs infra-rouge à prix très raisonnable pour rendre interactif n'importe quel video-projecteur en détournant l'utilisation d'une manette de jeu Wiimote avec un logiciel comme Python Whiteboard (d'autres solutions existent, par exemple Wiimote Whiteboard). La communication entre la Wiimote et l'ordinateur repose sur le protocole Bluetooth. Un stylet IR a été réalisé pour l'occasion avec la collaboration du département d'électronique.

Cahier des charges

L'objectif de ce projet est de proposé un environnement de présentation de cours en salle banalisé. Pour cela, l'interface doit permettre :

  • de convertir un document PDF (format standard de présentation) en une suite d'images dont la numérotation respecte la chronologie initiale (sous Unix voir pour cela convert du package ImageMagick ou bien l'utilitaire pdftoppm),
  • de parcourir le document en affichant ces images dans l'ordre de numérotation (transparent suivant, précédent) ou en choisissant le transparent à visualiser,
  • d'insérer de nouvelles pages vierges ou munies du quadrillage adéquat (grille, polaire, logarithmique, ...) ; des quadrillages sont disponibles ici : http://incompetech.com/graphpaper/,
  • de choisir un marqueur caractérisé par sa couleur et sa précision voire son épaisseur et d'annoter le document (commentaires, entourer, souligner, ...),
  • d'insérer des images (au format GIF ou PPM) dans une page,
  • d'effacer, de déplacer, de redimensionner et de couper/copier/coller des notes ou des marques précédemment ajoutées,
  • de faire des copies d'écran d'une autre application et de les insérer dans le document,
  • d'annuler la dernière opération,
  • de recharger un document modifié d'une séance à l'autre,
  • d'enregistrer la séance de cours en sauvegardant le document ainsi annoté et de produire un nouveau PDF (qui pourra ainsi être communiqué aux étudiants) ; sous Unix voir pour cela convert ou pdftk.

Aspect technique

Multi-processus

Le lancement de l'utilitaire python-whiteboard peut se faire via l'application principale. Le module Python subprocess et en particulier la fonction Popen() permet une mise en place rapide de cette fonctionnalité.

Le canvas de tkinter

En supposant que le canvas se nomme c :

  • c.find_withtag(current) permet de retrouver l'objet courant,
  • c.coords(id) permet de récupérer les coordonnées définissants l'objet id sous la forme d'une liste, et si l'on fournit un tuple de coordonnées de modifier la géométrie de l'objet,
  • c.move(id, dx, dy) permet de déplacer l'objet "id" relativement à sa position initiale de (dx, dy),
  • c.delete(id) permet d'effacer un objet du canvas.

Par défaut le canvas ne gère que les fichiers images de type gif ou ppm/pgm (on peut utiliser le package ImageMagick et en particulier la commande convert pour pallier à cette limitation). La création d'une pixmap se fait en deux temps :

  1. chargement du fichier image par id_image = PhotoImage(file=nom_fichier),
  2. affichage de l'image par c.create_image(x, y, anchor=pt_ref, image=id_image).

Il y a un grand absent pour le widget canvas : la rotation autour d'un point quelconque d'un objet géométrique. Il faut donc créer cette procédure de toute pièce. L'aspect mathématique est simple : la rotation d'un objet autour d'un point se fait dans le plan par composition de translations et de rotations. Plus précisément, soit p un point défini dans le référentiel de l'objet, le point p' transformé de p est :

p' = T-1 . R . T . p

avec T la translation qui amène le référentiel de l'objet à l'origine, R la rotation et T-1 la translation inverse qui ramène le référentiel à sa position initiale. Le système d'équations paramétriques est :

x' = (x - tx) cos(a) - (y - ty) sin(a) + txy' = (x - tx) sin(a) - (y - ty) cos(a) + ty

avec (tx, ty) les coordonnées du référentiel local et a l'angle de rotation. Attention : les calculs trigonométriques se font en radians (rappel : 1 rad = 57,295779513°).

Principes ergonomiques

Cohérence : style graphique homogène, si l'interface privilégie un certain type de widgets elle doit le faire pour toutes les facettes de l'application, l'affichage et la correction des erreurs doivent toujours être traités de façon proche quelque soit le type d'erreur.

Concision : le choix de l'outil courant, la navigation dans le document, l'ajout d'informations doivent nécessiter le moins d'actions possible.

Retour d'informations : à toute action doit correspondre une réponse visuelle, une aide (si possible contextuelle) doit être mise à disposition.

Structuration des activités : toute action complexe doit être décomposée en suite d'actions simples et intuitives.

Flexibilité : choix du marqueur, du style de transparent vierge et/ou du quadrillage.

Gestion des erreurs : à toute erreur doit être associé un message clair et explicite, des reprises sur erreurs peuvent être mise en place.