Lisibilité/ Dysgraphie

Porteur(s) du projet : Camille Descombes

Date : Mai 2017

Contexte : Cours de programmation

source : http://www.asciitable.com, https://processing.org/reference/rotate_.html, https://processing.org/examples/letters.html

BUT

Le but de mon projet est de vouloir gêner la lisibilité du lecteur. En créant des niveaux de lecture différent. Le programme, duplique, superpose la typographie, pour créer des confusions. Dans le cadre de mon mémoire il permettrait de sensibiliser à la dyslexie, en montrant la gêne qu'un dyslexique peut éprouver quand il lit un texte.

Ce programme part de la librairie typo, que j'ai transformée pour obtenir l'alphabet de la lettre (counter<65) A à (counter=91) Z. Ensuite j'ai pu créer des classes de boutons de niveau différent. Dès le contact de la souris sur le bouton l'alphabet se complexifié.

PHOTO

Code du Programme

//attribut typographie
PFont f;
//attribut du bouton
button ton1;
button ton2;
//attribut boolean pour bouton
boolean overBox = false;
boolean locked = false;
boolean singlePress = false;
void setup() {
size(600, 360); //taille de la zone de travail
//initialisation des boutons
ton1 = new button();
ton2 = new button();
// Creation de la typographie
printArray(PFont.list());
f = createFont("HelveticaLTStd-Light.otf", 24);//aller cherhce la helvetica et la mettre en taille 24
textFont(f);
textAlign(CENTER, CENTER); // texte centré dans la zone de travaille
}
void draw() {
background(0); //fond noir
//dessin du bouton 1 (couleurs et positions)
ton1.setFill(255,255,255); //couleur du bouton
ton1.draw(30,height-80,100,40); // position du bouton
fill(0);
text("Niveau 1", 80, height-60);
//dessin du bouton 2 (couleurs et positions)
ton2.setFill(255,255,255); //couleur du boutton
ton2.draw(200,height-80,100,40); // position du bouton
fill(0);
text("Niveau 2", 250, height-60);
//BOUTON NIVEAU 1
if(ton1.clicked()){ //(voir class bouton)
pushMatrix();
int margin = 10; //marge
translate(margin*4, margin*4);
int gap = 64; //espacement entre lettres
int counter = 65; //début de l'alphabet (ici A majuscule 65 code-ASCII)
for (int y = 0; y < height-gap; y += gap) {
for (int x = 0; x < width-gap; x += gap) {
if (counter < 91) {
char letter = char(counter);
fill(255); //couleur de la typographie
text(letter, x, y);
rotate(PI);
translate(-510,-135);
text(letter, x, y);
counter++;
}}}
popMatrix();
fill(0,255,100,50); //bouton rectangulaire (saturation) rempli de gris
rect(30,height-80,100,40);
}
//BOUTON NIVEAU 2
else if(ton2.clicked()){ //(voir class bouton)
pushMatrix();
int margin = 10;
translate(margin*4, margin*4);
int gap = 64; //espacement entre lettres
int counter = 65; //début de l'alphabet (ici A majuscule 65 code-ASCII)
for (int y = 0; y < height-gap; y += gap) { //suite de l'alphabet qui démarre à 65 (A)et qui fini a 90 (Z)
for (int x = 0; x < width-gap; x += gap) {
if (counter < 91) {
char letter = char(counter);
fill(255); //couleur de la typographie
text(letter, x, y);
rotate(PI);
translate(-510,-135);
text(letter, x, y);
text(letter, x+10, y+10);
counter++;
}}}
popMatrix();
fill(255,150,0,50); //bouton rectangulaire (saturation) rempli de gris
rect(200,height-80,100,40);
}
else{
int margin = 10;
translate(margin*4, margin*4);
int gap = 64; //espacement entre lettres
int counter = 65; //début de l'alphabet (ici A majuscule 65 code-ASCII)
for (int y = 0; y < height-gap; y += gap) {
for (int x = 0; x < width-gap; x += gap) {
if (counter < 91) {
char letter = char(counter);
fill(255); //couleur de la typographie
text(letter, x, y);
// Increment the counter
counter++;
}}}
}
}

Classe bouton

class button{
//couleurs
int Red;
int Gre;
int Blu;
//coordonnées des boutons
int x;
int y;
int si1;
int si2;
//méthode pour remplir les boutons
void setFill(int R, int G, int B){
Red = R;
Gre = G;
Blu = B;
}
//méthode pour dessiner les boutons
void draw(int x1, int y1, int s1, int s2){
x = x1;
y = y1;
si1 = s1;
si2 = s2;
stroke(0);
fill(Red,Gre,Blu);
rect(x1, y1, s1, s2);
}
//États fonction du bouton
boolean clicked(){
if(mouseX > x && mouseX < (x+si1) && mouseY > y && mouseY < (y+si2) ){
overBox = true;
if(!locked) {
return true;
}
}
overBox = false;
return false;
}
}

Référence

Elle réalise une affiche interactives permettant de sensibiliser le public au trouble dysgraphique en venant perturber la lecture du spectateur via une déformation de la typographie. Ces déformations explorent les limites de lisibilité d’un texte. Les affiches réagissent grâce à une kinnect qui détecte la distance du spectateur. Celui-ci doit trouver la bonne distance pour parvenir à la lisibilité de l’écriture.

Sandy Dauneauhttp://sandydauneau.fr/portfolio/dysgraphie/