Les zones du cerveau et leur rôle : affiche interactive

Porteur(s) du projet : Océane Gardet-Pizzo

Date : 14/01/2019

Licence : libre !

Contexte : Cours de Processing avec Damien Muti

Intention

Voulant que mon macro projet de deuxième année s'inscrive dans une logique de vulgarisation médicale, j'ai souhaité que mon affiche interactive me permette dès maintenant de travailler dans ce type de démarche, à travers un support didactique. J'ai choisi de réaliser une affiche qui explique de manière très simplifiée comment se divisent les différentes zones qui composent notre cerveau et le rôle qu'elles jouent. Sur l'affiche, des boutons sont positionnés sur ces mêmes zones et lorsque l'on appuie sur l'un d'entre eux, une vidéo comprenant une animation et un texte explicatif se lance.

J'ai également choisi de proposer un jeu de mémoire. Parmi cinq cercles colorés, trois s'affichent dans un ordre aléatoire et l'utilisateur doit ensuite reconstituer cet ordre en appuyant sur les boutons correspondant (cette partie est en cours de programmation).

Affiche

Animations

Programme

// librairies
import processing.video.*;
// variables globales
Movie vid;
cercle[] cercles; // déclaration du tableau de cercles
IntList selectionCercles; // numéro des cercles sélectionnés parmi l'ensemble {0,1,2,3,4}
int nbCerclesSelectionnes=3; // nb de cercles sélectionnés parmi la liste
// bouton video
boolean video_active = false ;
void setup() {
// paramètres d'affichage
size(displayWidth, displayHeight); // affichage plein écran
// création du tableau
cercles = new cercle[5];
// initialisation du tableau de cercles
int dep =60; // nombre de pixels entre chaque cercle
for (int i = 0; i<5; i++) { // créer cinq cercles
cercles[i] = new cercle(color(#F38196), 900+i*dep, 600, i);
}
// couleur de chaque cercle
cercles[1].c=color(#f0eb65);
cercles[2].c=color(#67bf75);
cercles[3].c=color(#ee3a43);
cercles[4].c=color(#855098);
}
void draw() {
// paramètres d'affichage pendant la lecture des videos
if (video_active) {
image(vid, 0, 0);
} else {
background(255); // fond blanc
// affichage des cinq cercles
for (int i = 0; i<5; i++) {
cercles[i].display();
}
}
lancerJeu(3);
}
void movieEvent(Movie movie) {
vid.read();
}

Classe cercles

class cercle {
color c; // couleur
float xpos; //position x
float ypos; // position y
float d; // diamètre
int i; //indice du cercle
// constructeur
cercle(color tempC, float tempXpos, float tempYpos, int _i) {
c = tempC;
xpos = tempXpos;
ypos = tempYpos;
d = 40;
i = _i;
}
// affichage
void display() {
noStroke () ;
fill (c) ;
ellipse(xpos, ypos, d, d);
}
boolean isSelectionned() { // méthode qui permet de dire si on a cliqué sur un cercle
float dist = sqrt(sq(xpos-mouseX)+sq(xpos-mouseY));// distance entre le centre du cercle et le cuseur de la souris
boolean valeur=false;
if (dist<d/2) {
valeur = true;
}
return valeur;
}
}

Gestion des vidéos

// Diffusion des videos
void keyPressed() {
if (keyCode == UP) { // video 1
if (video_active == false) { // la vidéo 1 ne tourne pas
vid = new Movie(this, "Lobe frontal.mov"); // chargement de la video 1
video_active = true;
vid.loop(); // tant que la condition est respectée, la video tourne en boucle
} else {
vid.stop(); // arret de la video
clear(); // la video disparait
video_active = false;
}
}
if (keyCode == DOWN) { // video 2
if (video_active == false) { // la vidéo 2 ne tourne pas
vid = new Movie(this, "Lobe occipital.mov"); // chargement de la video 2
video_active = true;
vid.loop(); // la video tourne en boucle
} else {
vid.stop(); // arret de la video
clear(); // la video disparait
video_active = false;
}
}
if (keyCode == RIGHT) { // video 3
if (video_active == false) { // la vidéo 3 ne tourne pas
vid = new Movie(this, "Lobe temporal.mov"); // chargement de la video 3
video_active = true;
vid.loop(); // la video tourne en boucle
} else {
vid.stop(); // arret de la video
clear(); // la video disparait
video_active = false;
}
}
if (keyCode == LEFT) { // video 4
if (video_active == false) { // la vidéo 4 ne tourne pas
// chargement de la video 4
vid = new Movie(this, "Cervelet.mov");
video_active = true;
vid.loop(); // la video tourne en boucle
} else {
vid.stop(); // arret de la video
clear(); // la video disparait
video_active = false;
}
}
}

Gestion du jeu (en cours de programmation)

void lancerJeu(int NbCerclesSelectionnes) {
IntList listeTotale = new IntList();
IntList selectionCercles = new IntList(); // numéro des cercles sélectionnés parmis l'ensemble {0,1,2,3,4}
for (int i=0; i<5; i++) {
listeTotale.append(i);
}
// rendre aléatoire la liste
listeTotale.shuffle();
for (int i=0; i<NbCerclesSelectionnes; i++) {
selectionCercles.append(listeTotale.get(i));
}
// afichage des cercles sélectionnés
for (int i=0; i<NbCerclesSelectionnes; i++) {
float x = cercles[selectionCercles.get(i)].xpos;
float y = cercles[selectionCercles.get(i)].ypos + 60;
fill(cercles[selectionCercles.get(i)].c);
float d = cercles[selectionCercles.get(i)].d;
ellipse(x, y, d, d);
}
}