Construction de la trame
Avant de créer un diaporama sur H5P, une version préparatoire est rédigée sur Word. Ce format se prête mieux aux modifications qu’un diaporama. Ce fichier regroupe toutes les informations associées à chaque photographie qui figureront sur le diaporama final. La bibliographie sur laquelle s’appuient les textes d’accompagnement est donnée à l’annexe 2. L’ordre d’apparition des photographies y est également décidé. Ainsi, lors de la rédaction du diaporama, il suffit de transposer le fichier Word en diapositives, ce qui permet un gain de temps considérable.
Retouche des photographies
□ Objectif
Il a été décidé d’uniformiser le format des photographies en appliquant systématiquement un arrière-plan uni noir. Nous avons choisi le noir car c’est la seule couleur, avec le gris foncé, qui ne modifie pas la perception de la couleur du spécimen par le cerveau. Par exemple, si on utilise un fond de couleur cyan, dont la couleur complémentaire est le rouge, le cerveau va interpréter le rouge de l’organe ou du tissu comme plus saturé qu’il ne l’est réellement (McGavin, 2012).
Selon la photographie, d’autres retouches ont pu être réalisées, telles qu’un éclaircissement des images trop sombres ou un recadrage. Une retouche mineure des couleurs a pu être faite (correction d’une lumière trop jaune par exemple), mais en préservant au maximum la teinte d’origine de l’organe. La couleur fait partie intégrante de la lésion, il est important de ne pas sursaturer ou désaturer une image.
□ Logiciel utilisé
Le logiciel utilisé pour retoucher les photographies est GIMP (GNU Image Manipulation Program). Il s’agit d’un logiciel gratuit, sous licence GNU, qui offre un large éventail d’outils d’édition d’image. Il fonctionne sous la plupart des systèmes d’exploitation et est compatible avec de nombreux langages informatiques (Scheme, Python ou Perl par exemple) (GIMP, 2020). Il s’agit donc d’un outil suffisamment puissant pour notre usage et dont la prise en main est rapide.
□ Réalisation pratique
À l’ouverture de GIMP, il y a trois barres d’outils (Figure 3) :
- Le menu principal, en haut de l’écran, qui contient toutes les actions et les outils proposés par le logiciel ;
- Une barre verticale, à gauche de l’écran, qui permet un accès rapide aux outils de base les plus fréquemment utilisés (sélection de zone, zone de texte ou encore choix de la couleur) ;
- Une barre verticale, à droite de l’écran, qui contient les options de l’outil. Par exemple, avec l’outil « pinceau », les options à disposition sont la taille de la brosse, sa forme, son opacité…
Figure 3 : Capture d’écran - Interface du logiciel GIMP
Pour ouvrir un ou plusieurs fichier sur GIMP, il est possible soit de parcourir les fichiers de l’ordinateur en cliquant sur l’onglet « fichier » puis « ouvrir », soit de cliquer-déposer le fichier directement dans la fenêtre du logiciel.
Il n’existe pas d’outil permettant d’appliquer un fond noir autour d’une zone précise de l’image, il faut le faire manuellement, en peignant l’image. Le plus simple est de procéder en deux étapes. La première étape est un premier passage grossier, qui colore rapidement de larges zones.
Pour cela, il faut commencer par sélectionner la zone à conserver avec l’outil « sélection à main levée », en faisant un contour large et grossier autour de cette zone (Figure 4). Puis dans l’onglet
« sélection », l’option « inverser la sélection » permet de sélectionner l’extérieur de la zone
précédemment sélectionnée. Ensuite, avec l’outil « pinceau » et une brosse de large diamètre, on peut peindre le fond sans risquer de colorer l’organe qui nous intéresse (Figure 5).
Figure 4 : Capture d’écran - Sélection large de la zone d'intérêt avec l'outil "sélection à main levée"
Figure 5 : Capture d’écran - Coloration grossière du fond, après inversion de la sélection
La seconde étape est beaucoup plus précise puisqu’il s’agit de peindre le contour exact de l’organe. On commence par zoomer sur l’image, afin de gagner en précision. Pour cela il suffit de choisir la taille d’affichage de l’image, soit dans l’onglet « affichage » puis « zoom », soit grâce au menu déroulant en bas à gauche de l’image. On modifie ensuite la sélection : dans l’onglet
« sélection », on clique cette fois sur « sélectionner tout ». On reprend l’outil « pinceau » en choisissant cette fois une brosse de petit diamètre, à bords nets ou flous selon la netteté de la photographie et la précision du contour de l’organe. Il suffit ensuite de suivre le contour de l’organe (Figure 6). Une brosse à bords flous donnera un rendu plus naturel dans les zones où le contour de l’organe n’est pas bien net. Une brosse à bords nets sera en revanche plus précise.
Figure 6 : Capture d’écran - Coloration précise du contour de l'organe
Il est parfois nécessaire de rogner l’image, dans les cas où l’organe qui nous intéresse n’est pas bien centré, ou si les bords sont trop larges. Il suffit d’utiliser « l’outil de découpage », situé soit dans l’onglet « image », soit directement dans la barre d’accès rapide à gauche. On sélectionne la taille souhaitée puis un clic à l’intérieur de ce cadre permet de rogner l’image (Figure 7).
Figure 7 : Capture d’écran - Recadrage de l'image
D’autres outils ont été utiles, notamment pour la balance des couleurs. L’onglet « couleurs » comporte plusieurs outils intéressants, dont ceux qui nous ont été le plus utiles sont :
- « Température de couleur » : permet de corriger les images trop jaunes ou trop bleues ; - « Ton sombres-tons clairs » : permet de corriger la luminosité sur seulement les parties claires ou les parties sombres de l’image. Cela permet d’obtenir une meilleure visibilité d’une zone trop sombre (une ombre par exemple), sans éclaircir les zones où la luminosité est correcte ;
- « Luminosité-contraste » : permet d’éclaircir une image trop sombre, tout en conservant un contraste correct.
b. Création d’un diaporama
L’outil H5P est intégré à Moodle. Il n’y a pas besoin de télécharger de logiciel, les diaporamas se créent et se modifient directement sur le site EVE.
Pour créer un nouveau diaporama, il faut commencer par activer le mode édition sur EVE (Figure 8). Ce mode est réservé aux administrateurs du cours, qui sont désignés par la Direction des Services Informatiques (DSI). Il permet d’ajouter du contenu sur la page de cours, en donnant accès aux divers outils de Moodle.
Figure 8 : Capture d’écran - Activation du mode édition sur EVE
Une fois le mode édition activé, des onglets « ajouter une activité ou ressource » apparaît dans toutes les sections de la page. En cliquant dessus, une fenêtre s’ouvre et propose une liste d’activités (ajout d’un test, d’un forum ou encore d’une zone de dépôt de devoirs) et de ressources (ajout d’un fichier, d’une vidéo ou d’un lien par exemple). Dans notre cas, on sélectionne l’option
« H5P » dans la liste des activités (Figure 9).
Figure 9 : Capture d’écran - Ajout d'une nouvelle activité H5P
Une nouvelle page s’ouvre, avec d’abord une zone de texte permettant de saisir une description pour le diaporama si on le souhaite, puis une liste des activités H5P proposées. Il suffit ensuite de sélectionner « course presentation » pour créer le diaporama (Figure 10).
Figure 10 : Capture d’écran - Création d'un nouveau diaporama
c. Création et modification d’une diapositive
L’interface du mode édition des diapositives est minimaliste, avec une barre d’outils en haut de la diapositive proposant des activités ou du contenu à ajouter à la diapositive, et une barre d’outils en bas permettant d’ajouter, dupliquer, supprimer ou réordonner les diapositives (Figure 11).
Figure 11 : Capture d’écran - Interface de l'assistant de création de diaporamas
L’arrière-plan du diaporama
Afin d’uniformiser les diaporamas et par souci d’esthétisme, nous avons décidé de mettre un fond uni noir sur toutes les diapositives, qui s’inscrit dans le prolongement de l’arrière-plan des photographies. Pour cela, il faut cliquer l’onglet « Arrière-plan de diapositive », puis « couleur d’arrière-plan » et enfin sélectionner une zone noire dans la palette de couleurs proposées.
L’outil « texte »
Cliquer sur la première icône de la barre d’outils permet de créer une zone de texte. Cela ouvre un nouveau volet (Figure 12) avec un champ libre où saisir le texte et les différents paramètres qu’on peut modifier. Quelques outils de traitement de texte sont disponibles, mais très limités.
Figure 12 : Capture d’écran - Interface du volet "Texte"
Il est possible de rendre le fond de la zone de texte plus ou moins opaque. Nous avons choisi de le laisser transparent la majorité du temps, donc noir comme l’arrière-plan des diapositives. Pour une bonne visibilité de l’écriture sans toutefois faire mal aux yeux, la couleur d’écriture choisie est un gris dénommé « argent brillant », et non complètement blanc.
Il existe une option « afficher sous forme de bouton ». Lorsqu’elle est activée, le texte n’apparaît pas directement sur la diapositive, il est remplacé par une petite icône bleue (Figure 13).
Le texte apparaît dans une petite fenêtre lorsqu’on clique sur cette icône. Nous avons utilisé cette option pour ajouter des informations non essentielles à la compréhension de l’image. Cela permet d’apporter des compléments d’information sans alourdir la diapositive.
Figure 13 : Capture d’écran - Insertion de texte sous forme de bouton
L’outil « image »
Sur le même principe, l’outil « image » de la barre d’outil permet d’ouvrir un nouveau volet (Figure 14). On peut y charger une image stockée sur l’ordinateur, puis éventuellement la faire pivoter ou la rogner. La position et la taille de l’image se règlent une fois l’image validée, lorsqu’on retourne sur l’affichage de la diapositive. Partant du principe que dans un atlas l’image prime sur le texte, nous avons choisi d’afficher la photographie de la plus grande taille possible.
Figure 14 : Capture d’écran - Interface du volet « Image »
L’option « texte de survol » permet d’afficher un court texte lorsque la souris passe sur l’image. Pour toutes les photographies, nous avons utilisé cette option pour ajouter l’identification du cheval (sexe, race et âge), le motif de consultation le cas échéant, l’origine de la mort (naturelle ou euthanasie) et les conclusions majeures de l’autopsie. Sans être indispensable à la compréhension des cas, nous avons estimé qu’il pouvait être intéressant de connaître ces informations, surtout dans les cas avec des processus pathologiques complexes. Par ailleurs, ce sont des informations à donner lors de la présentation d’un cas clinique, cela peut aider les étudiants à prendre l’habitude de s’intéresser à l’identité et aux commémoratifs de l’animal.
Comme pour l’outil texte, il est possible de cocher l’option « afficher sous forme de bouton », pour n’afficher sur la diapositive qu’une icône (différente de l’icône de texte, voir figure 15) et révéler l’image en cliquant dessus. Nous avons utilisé cette option pour ajouter des photographies complémentaires, montrant le même type de lésion sur un autre cas, la même lésion sous un autre angle ou un autre grossissement, ou une lésion du même cas sur un autre organe lorsqu’un lien de causalité entre les deux lésions existe (par exemple, insertion d’une photographie de bronchopneumonie consécutive à une rhinosinusite dans le diaporama sur les lésions des cavités nasales et des sinus).
Figure 15 : Capture d’écran - Insertion d'une image sous forme de bouton
L’outil « aller à la diapositive »
L’outil « aller à la diapositive », symbolisé par une ancre dans la barre d’outils, permet de passer d’une diapositive à une autre en cliquant sur une zone bien délimitée de la diapositive. Nous l’avons utilisé pour le sommaire, sur la première diapositive de chaque diaporama. En cliquant sur le nom d’une des lésions présentées dans le diaporama, l’utilisateur est emmené directement sur la diapositive associée.
Pour créer ce pont entre deux diapositives, il faut cliquer sur l’onglet « aller à la diapositive » sur la diapositive de départ, ce qui ouvre un nouveau volet (Figure 16). À l’option « aller vers », nous sélectionnons « le numéro de diapositive spécifique » dans le menu déroulant. La case suivante permet de saisir le numéro de diapositive sur laquelle on souhaite se déplacer.
Figure 16 : Capture d’écran - Interface du volet "Aller à la diapositive"
Il existe une option « invisible » : lorsqu’elle est cochée, l’utilisateur n’a aucune indication sur la zone à cliquer. Nous avons choisi de ne pas utiliser cette option par souci de clarté. Ainsi, la zone qui permet d’aller à une autre diapositive est affichée en bleu lorsqu’on passe la souris dessus.
Un inconvénient de cet outil est qu’il ne s’adapte pas aux ajouts et suppressions de diapositives. Si on décide par exemple de supprimer une diapositive, il faut ensuite corriger manuellement le numéro de diapositive pour toutes les suivantes. C’est donc le paramétrage à faire en dernier, lorsque le diaporama est terminé.
Troisième partie : Utilisation, limites et perspectives de l’atlas interactif réalisé
A. Utilisation de l’atlas interactif via Moodle