Outils pour utilisateurs

Outils du site


wiki:projets:processing-dsaa1-2017:lisa-guillermin

MELANGE

  Porteur(s) du projet : Lisa Guillermin
  Date : Mai 2017
  Contexte : cours de “Culture & pratiques techniques”
  Source : OpenProcessing

BUT

Je travail autour de la relation que nous avons avec les images qui nous entourent dans l'espace public. Nous sommes sans cesse confrontés à un nombre incalculable d'images qui s’entremêlent et se perdent dans la multitude. J'ai donc cherché un programme pouvant nous mettre en confrontation avec ce phénomène. Le programme développé par Tomasz Sulej (generateme.blog@gmail.com, http://generateme.tumblr.com, Licence: http://unlicense.org/) se rapproche de celui développé par le Studio HELMO. Leur travail Stratigraphie, suit une logique d’empilement de couches, de stratification. L’accumulation de sens, de plans, et d’encres produit au final un « feuilleté» dense. Ceci retranscrit l'équivocité du monde, un monde sur un plan, dans lequel on ne distingue plus les formes ni l’enjeu. Des images porteuses de sens au départ, qui se perdent dans la multitude.

TRAVAIL D'HELMO

IMAGES UTILISEES

CODE (avec problèmes)

Les classes (3) sont intégrées au code. Il n'est encore pas fini d'être commenté.

Usage: * Appuyer sur espace pour sauvegarder * Cliquer pour changer les paramètres de manière aléatoire Configurer le nom de fichier de la cible String filename = «test»; Nom de l’image de base String fileext = «.jpg»; Son format String foldername = «./»; nom du dossier Mélange de la couleur et du canal int mode = BLEND_VALUE; BLEND_VALUE ou BLEND_COLOR Si on veut faire varier la valeur, il faut définir ce que l’on veut faire varier int VALUE_FOR_BLEND = HUE; On fait ceci seulement si on veut faire varier la valeur des images green() blue() alpha() hue() saturation() » Vert () bleu () alpha () teinte () saturation ()

nombre aléatoire de source utilisé boolean random_source = false; Initialisation de la variable boolean utilisée pour les tests conditionnels

int max_display_size = 1000; Taille de la fenêtre de visualisation (quelle que soit la taille de l’image) boolean do_blend = false; Fusionner l’image après le processus int blend_mode = OVERLAY; Type de mélange > Mélange une région de pixels d’une image à une autre (ou en elle-même à nouveau) avec un support de canal alpha complet. »https://processing.org/reference/blend_.html

                          //Il existe un choix des modes suivants pour mélanger les pixels source (A) avec ceux de pixels dans l’image de destination (B):
                          // BLEND, ADD, ADD, SUBTRACT, DARKEST, LIGHTEST, DIFFERENCE, EXCLUSION, MULTIPLY, SCREEN, OVERLAY, HARD_LIGHT - SCREEN, MULTIPLY, SOFT_LIGHT, DODGE, BURN

Configurer l’ensemble des images sources utiliser les noms de dossier des variables ci-dessous pour construire l’ensemble exemple: mes images ont des noms: bl1000.jpg, bl1001.jpg etc … et sont situés dans le dossier ‘bl /’ J’ai 6 d’entre elles avec un préfixe constant: «bl / bl100» (pattern_prefix) alors chaque fichier a un chiffre de séquence de 0 à 5 (pattern_init et pattern_length) avec les chiffres ‘pattern_size’ pour la séquence (ici: un chiffre) à la fin ‘file_ext’ est ajouté ci-dessous le réglage produit six noms: bl / bl1000.jpg, bl / bl1001.jpg, bl / bl1002.jpg, bl / bl1003.jpg, bl / bl1004.jpg, bl / bl1005.jpg »final static» et le mot-clé utilisé pour définir une variable comme une «variable de classe» et une méthode comme «méthode de classe». Lorsqu’une variable est déclarée avec le mot-clé statique, toutes les instances de cette classe partagent la même variable. Lorsqu’une classe est définie avec le mot-clé statique, ses méthodes peuvent être utilisées sans créer une instance de la classe. final static String pattern_prefix = «bl/bl100»; final static String file_ext = «.jpg»; Format final static int pattern_init = 0; Numéro de départ final static int pattern_length = 6; Nombre d’images qui composent l’ensemble, ne pas en utiliser plus de 10. final static int pattern_size = 1; Nombre de chiffre final static int BLEND_COLOR = 0; final static int BLEND_VALUE = 1; Initialisation de la classe Mémoire tampon du travail : PGraphics PGraphics buffer;

Initialisation de la classe PImage PImage img; String sessionid; Variable chaine de caractères, permet de stocker du texte, nom de la variable

PImage[] sset = new PImage[pattern_length]; Création d’un nouvelle objet Image correspondant à une des images définit avec un chiffre dans patern_length void setup() { Initialisation de la Méthode Void Setup afin de déclarer les fonctions valables tout au long du programme.

sessionid = hex((int)random(0xffff), 4); //hex permet de convertir un nombre entier en  une chaine
                                         // contenant la notation hexadécimale équivalente. Ici, cela correspond à une apparition aléatoire) CHANGER LE 4 NE CHANGE RIEN ???
img = loadImage(foldername+filename+fileext); //chargement de l’image (nom du dossier, nom du fichier, extension du fichier)
img.loadPixels();                        // La classe PImage contient des champs pour la largeur et la hauteur de l’image, ainsi qu’un tableau appelé pixels [] qui contient les valeurs pour chaque pixel dans l’image. 
                                         //Cette méthode permet d’accéder facilement aux pixels de l’image et au canal alpha et à simplifier le processus de composition.
                                         //Avant d’utiliser le tableau pixels [], il faut avoir utiliser la méthode loadPixels () sur l’image pour que les données de pixels soient correctement chargées.
buffer = createGraphics(img.width, img.height); //Une fois que la class a été créée, il suffit de mettre «create» pour stocker de nouvelles infos.
buffer.loadPixels();
// Calcul de la taille de la fenêtre
float ratio = (float)img.width/(float)img.height;// Calcul du ratio largeur sur hauteur de l’image (w et h = n’importe quel nombre sur IR)
int neww, newh;                                  // nouvelles variables de type entier : neww (= nouvelle largeur) et newh (= nouvelle hauteur)
if (ratio < 1.0) {
  neww = (int)(max_display_size * ratio); // Nouvelle largeur = max_display_size (= 1000 = Taille de la fenêtre de visualisation)
                                          // multipliée par la largeur de l’image (lorsque la largeur divisée par la hauteur est strictement inférieur à 0) pour que l’image s’adapte à la taille de la fenêtre
  newh = max_display_size;                // Pareil avec la hauteur de l’image
} else {
  neww = max_display_size;                // Alors la nouvelle largeur de l’image est égal à la largeur de la fenêtre
  newh = (int)(max_display_size / ratio); // et la nouvelle heuteur et un nom entier correspondant à la taille de la fenêtre divisé par le ratio
}
size(neww, newh);                          // Donne la nouvelle taille
for (int i=0; i<pattern_length; i++) {     // Lorsque i=0 (conditions initiales), avec i strictement inférieur au nombre d’images qui composent l’ensemble (=6 images) (condition d’arrêt)
                                           // alors i s’incrémente de 1 (condition d’incrémentation)
  String suf = nf(i+pattern_init, pattern_size);  // nf : Fonction utilitaire pour le formatage des nombres en chaînes. Car chaque fichier a un chiffre de séquence de 0 à 5 (pattern_init et pattern_length)
                                                  // avec les chiffres ‘pattern_size’ pour la séquence
                                                 
  String fname = pattern_prefix + suf + file_ext;
  sset[i] = loadImage(fname);                     // Chargement d’une autre image avec fname qui signifie qu’il faut charger
                                                  // une image avec le préfixe «bl / bl100» + suf (le numéro de l’image précédent (ex : 1 ) dans un dossier extérieur (en .jpg)
  sset[i].loadPixels();                           // L’incrémentation permet donc, en additionnant les différents paramètres d’une image 
                                                  //en utilisant les chiffres caractérisant leur noms, de créer les nouvelles variables
  printArray(fname + « loaded»);                  // Une image s’ajoute à la première, println ()(avant) et mtn printArray () permet d’écrire des données de tableau dans la console.
}
processImage();           // Traitement de l’image?

}

void draw() {

// Remplir pour un traitement itératif, c’est à dire qui se répète. 
// Void Draw est une méthode permettant d’afficher les sous-fonctions, c’est une boucle d’affichage appelée 30fois/seconde.
//Elle permet de modifier le contenu de la fenêtre d’affichage à chaque apparition pour creer l’animation. 

}

void mouseClicked() {

random_source = true;     // A chaque clic, une image apparait de manière aléatoire. Bouléen vrai.
                          // Les événements de souris (et de clavier) ne fonctionnent que lorsqu’un programme a Draw(). Sans avoir dessiné, le code ne s’exécute qu’une seule fois puis arrête d’écouter les événements.                      

mode = random(1)<0.5?BLEND_COLOR:BLEND_VALUE; CREER D’AVANTAGE D’ALEATOIRE en définissant mode mais qu’est-ce que 0.5? if(mode == BLEND_VALUE) VALUE_FOR_BLEND = (int)random(6); Si mode est égale au mélange de la valeur, alors il se créer de l’aléatoire en mélangeant une autre image

                                                         // Ici : (6) renvoie des valeurs entre 0 et 6 (commençant à zéro, et jusqu’à, mais pas inclus, 6).
                                                         //(int) permet de retranscrire un nbr aléatoire à virgule en nombre entier.
do_blend = random(1)<0.1;                                // TOUJOURS PAS COMPRIS LE NBR A VIRGULE
blend_mode = blends[(int)random(blends.length)];         // Mélange aléatoire des images
processImage();

}

PVector getVector(color c) { Classe PVecteur utilisée pour décrire une position, une vitesse ou une accélération. Ici, la couleur. Le Pvecteur permet de créer des décalages de bits.

PVector v = new PVector();
v.x = (c >> 16) &0xff; //0x défini une couleur hexadécimale en RGB et ff signifie qu’elle est codée sur 1 (255/255) 
                       // x sur 16 bits
v.y = (c >> 8) &0xff;  // y sur 8
v.z = c &0xff;         // z sur 4
return v;

}

void processImage() { Initialisation d’une nouvelle variable (qui n’est pas reconnue?) qui renvoie au processus de l’image int[] idx = new int[pattern_length]; déclaration de la variable changement d’image (de 0 à 5) (dx = déplacement)

for (int i=0; i<pattern_length; i++) idx[i] = i; // Pour i=0, avec i strictement inférieur à pattern_length, c’est à dire 6 si pattern_length = (bl100)5(.jpg)
                                                 // On incrément i de 1, ce qui créé une nouvelle image, ou idx retourne à l’état initial i
                                                 //Condition vrai
int nidx = pattern_length;                       //Ces lignes permettent de créer de l’aléatoire dans l’affichage des images, mais également de faire en sorte 
                                                 // qu’il y en ai plusieurs qui s’affichent
if (random_source) {                             // Test conditionnel validé lorsque l’on clique, mais Si validée, alors
  nidx = (int)random(2, pattern_length+1);       // il y a au moins deux images qui s’affichent + pattern + 1 ?? ...
  for (int i=0; i<pattern_length-1; i++) {       // Lorsque i=0, avec i strictement inférieur au nombre d’images qui composent l’ensemble (=6 images) -1 
                                                 // alors i s’incrémente de 1
    int ri = (int)random(i+1, pattern_length);   // Comprends pas, mais certainement une petite technique pour combiner plusieurs images et creer de l’aléatoire dans l’apparition des images.
    int tmp = idx[i];
    idx[i] = idx[ri];
    idx[ri] = tmp;
  }
}
println(«Using « + nidx + « images.»);           //Une nouvelle image s’ajoute à la place
for (int x=0; x<img.width; x++) {                //Boucle double!! : Pour x=0 avec x stritement inferieur à la largeur de l’image alors x s’incrémente de 1
                                                 
  for (int y=0; y<img.height; y++) {             //Et si pour y=0 avec y strictement inf à la hauteur alors y s’incrémente de 1
    int p = y*img.width+x;
    color c = img.pixels[p];
    PVector cv = getVector(c);
    float cval = getChannel(c,VALUE_FOR_BLEND);
    float currd = 1.0e10;
    color currc = c;
    for (int i=0; i<nidx; i++) {
      PImage _img = sset[idx[i]];
      int _x = (int)map(x, 0, img.width-1, 0, _img.width-1);
      int _y = (int)map(y, 0, img.height-1, 0, _img.height-1);
      int _p = _y * _img.width + _x;
      color _c = _img.pixels[_p];
      float d = currd;
      if (mode == BLEND_COLOR) {
        d = cv.dist(getVector(_c));
      } else {
        d = abs(cval - getChannel(_c,VALUE_FOR_BLEND));
      }
      if (d<currd) {
        currd = d;
        currc = _c;
      }
    }
    buffer.pixels[p] = currc;
  }
}
// Fin du code
buffer.updatePixels();
if (do_blend)
  buffer.blend(img, 0, 0, img.width, img.height, 0, 0, buffer.width, buffer.height, blend_mode);
image(buffer, 0, 0, width, height);

}

void keyPressed() {

// SPACE to save
if (keyCode == 32) {
  String fn = foldername + filename + «/res_» + sessionid + hex((int)random(0xffff), 4)+»_»+filename+fileext;
  buffer.save(fn);
  println(«Image «+ fn + « saved»);
}

}

final static int[] blends = { ADD, SUBTRACT, DARKEST, LIGHTEST, DIFFERENCE, EXCLUSION, MULTIPLY, SCREEN, OVERLAY, HARD_LIGHT, SOFT_LIGHT, DODGE, BURN }; ALL Channels, Nxxx stand for negative (255-value) channels to work with final static int RED = 0; final static int GREEN = 1; final static int BLUE = 2; final static int HUE = 3; final static int SATURATION = 4; final static int BRIGHTNESS = 5; final static int NRED = 6; final static int NGREEN = 7; final static int NBLUE = 8; final static int NHUE = 9; final static int NSATURATION = 10; final static int NBRIGHTNESS = 11; float getChannel(color c, int channel) { int ch = channel>5?channel-6:channel; float cc; switch(ch) { case RED: cc = red©; break; case GREEN: cc = green©; break; case BLUE: cc = blue©; break; case HUE: cc = hue©; break; case SATURATION: cc = saturation©; break; default: cc= brightness©; break; } return channel>5?255-cc:cc; } ===== RENDU =====

wiki/projets/processing-dsaa1-2017/lisa-guillermin.txt · Dernière modification: 2017/05/15 01:51 (modification externe)