TONER KEBAB WIKI

Cette page est en lecture seule. Vous pouvez afficher le texte source, mais ne pourrez pas le modifier. Contactez votre administrateur si vous pensez qu'il s'agit d'une erreur.
====== Raconte moi un dessin ======



**Porteur de projet :** Aria GIULJ\\
**Projet :** par hasard\\ 
**Cleyet-Merle - Muti **\\
**Date :** mars 2020\\
**Contexte :** cours processing - Pratique Plastique\\
** Lien vers le projet : **


===== Commentaire général - Damien MUTI DESGROUAS =====
Le plan du wiki n'est pas respecté. Vous présentez brièvement le problème en préambule. Vous détaillez ensuite les différentes étapes de votre recherche graphique (de 1 à 4), en proposant de nombreux visuels. L'étape 4 constitue une recherche graphique pour la version numérique de votre projet effectuée sous Processing. A l'étape 5 vous expliquez les intensions de fonctionnement du programme Processing et vous donnez le fichier compressé de ce dernier, mais il ne s'agit pas de la dernière version sur laquelle nous avions travaillé ensemble. Le code présenté n'est quasiment pas commenté. Le programmes est très fortement inspiré de celui donné en cours pour les affiches interactives. Il faut donner le lien sur l'article du Wiki correspondant : [[wiki:tutoriels:affiche-interactive:accueil|Comment créer une affiche interactive ?]]. L'algorithme de votre programme n'est pas présenté. Peut-être pourriez-vous rajouter le code commenté en utilisant les balises permettant d'afficher le code. Il faudrait aussi rajouter des visuels des résultats de votre travail. Il faut donc reprendre le compte rendu et approfondir la recherche numérique. Il faut rajouter aussi votre nom sur la page Wiki.


===== Introduction et présentation du problème - Damien MUTI DESGROUAS =====
Pour le projet "Par hasard" j'ai décidé de travailler sur la relation visuels / musique.
le but étant de créer une boite avec plusieurs mini éditions de visuels, racontant chacun une histoire différente.
===== Etape n1 =====

Recherches sur formats A6 de différentes feuilles, avec différents outils.

===== Etape n2 =====

Selection d'une gamme de couleurs, et d'une série de recherches.\\
{{:wiki:projets:raconte-moi-un-dessin:capture_d_ecran_2020-03-17_a_17.52.04.png|}} \\
{{:wiki:projets:raconte-moi-un-dessin:img_0285.jpg|}} \\

===== Etape n3 =====

Série final visuels en mouvement. \\
{{:wiki:projets:raconte-moi-un-dessin:img_0272.jpg|}} \\
{{:wiki:projets:raconte-moi-un-dessin:img_0276.jpg|}} \\
{{:wiki:projets:raconte-moi-un-dessin:img_0283.jpg|}} \\

===== Les minis éditions =====

Avec toutes mes recherches je vais donc créer des petits livrets de 10 à 12 pages. Ces livrets seront tous rassemblés dans une petite boite en carte au nom du projet.
Chaque livret racontera une histoire avec un réel sens ou pas, ces mots seront écrits par le lecteur. La seule indication au bas de la page sera "verbe" "adjectif" etc. C'est ensuite au lecteur de choisir.
Un livret raconte une histoire, mais en combinants tous les livrets ensemble, une nouvelle histoire se créer.

{{:wiki:projets:raconte-moi-un-dessin:img_0422.jpg?400|}}

-----
===== Etape n4 =====

Sur processing le but et d’associer à chaque touche du clavier un son ainsi qu'un visuel qui sort au hasard. Ainsi lorsque l’on écrit un mot, une phrase, il y’aura un visuel et du son : une véritable histoire se créer.
essaie du codage, en m'inspirant de celui de l'affiche interactive [[wiki:tutoriels:affiche-interactive:accueil|Comment créer une affiche interactive ?]] + plusieurs codes trouvés sur  [[https://www.openprocessing.org/browse/?q=patatap&time=anytime&type=all#/|openprocessing]]

Inspiration du site https://patatap.com/ 

Création des visuels "décomposés" pour processing. J'ai repris les mêmes que pour la versions papiers en gardant l'aspect "texture" travaillé sur photoshop avec différents brush. Ces formes décomposées sont des images affectées aux touches du clavier, lorsque l'on clique dessus on peut recréer ou non ces formes dans leur ensemble, mais là n'est pas le but. Voici un exemple d'une forme décomposée : \\
{{:wiki:projets:raconte-moi-un-dessin:calque_2.png|}}\\
{{:wiki:projets:raconte-moi-un-dessin:calque_3.png|}}\\
{{:wiki:projets:raconte-moi-un-dessin:calque_4.png|}}\\
{{:wiki:projets:raconte-moi-un-dessin:calque_5.png|}}\\
{{:wiki:projets:raconte-moi-un-dessin:calque_6.png|}}\\
{{:wiki:projets:raconte-moi-un-dessin:calque_7.png|}}\\
{{:wiki:projets:raconte-moi-un-dessin:calque_8.png|}}\\


{{ :wiki:projets:raconte-moi-un-dessin:bon2_1.zip |Premier code}}

[[https://drive.google.com/drive/folders/1NG3fIbYnzb8WRC0jls37knc-8Qjep_sQ/|Dernier code]]
<code>
//librairies
import processing.sound.*;

//déclaration des variables
PImage img;
float imX = 0, imY=0; // position initiale de l'image
SoundFile son;
boolean image_active = false;
void setup() {
  size(800, 600);
  noStroke();
  fill(#E3EBF5);
  background(0);
  noCursor();
  // initialisation des variables globales
  img=loadImage ("img/Calque 19.png");
  son = new SoundFile(this, "sounds/26.mp3");
}



void draw() {
  background (0);
  stroke (255);
  // gestion de l'image
  if (image_active) { // si image_active=true alors afficher l'image
    image(img, imX, imY, 200, 200);
  }
}

void keyPressed(){
  //lorsque j'appuie sur la touche A je veux que le son 1 se lance et que l'image 2 apparaisse
  if (key == 'a') { //charger le son 1 et le jouer et charge l'image calanque 2
    gestionSonImage("sounds/1.mp3", "img/Calque 2.png");
  }
  if (key == 'z') {
    gestionSonImage("sounds/2.mp3", "img/Calque 3.png");
  }
  if (key == 'e') {
    gestionSonImage("sounds/3.mp3", "img/Calque 4.png");
  }
  if (key == 'r') {
    gestionSonImage("sounds/4.mp3", "img/Calque 5.png");
  }
  if (key == 't') {
    gestionSonImage("sounds/5.mp3", "img/Calque 6.png");
  }
  if (key == 'y') {
    gestionSonImage("sounds/6.mp3", "img/Calque 7.png");
  }
  if (key == 'u') {
    gestionSonImage("sounds/7.mp3", "img/Calque 8.png");
  }
  if (key == 'i') {
    gestionSonImage("sounds/8.mp3", "img/Calque 9.png");
  }
  if (key == 'o') {
    gestionSonImage("sounds/9.mp3", "img/Calque 10.png");
  }
  if (key == 'p') {
    gestionSonImage("sounds/10.mp3", "img/Calque 11.png");
  }
  if (key == 'q') {
    gestionSonImage("sounds/11.mp3", "img/Calque 12.png");
  }
  if (key == 's') {
    gestionSonImage("sounds/12.mp3", "img/Calque 13.png");
  }
  if (key == 'd') {
    gestionSonImage("sounds/13.mp3", "img/Calque 14.png");
  }
  if (key == 'f') {
    gestionSonImage("sounds/14.mp3", "img/Calque 16 (2).png");
  }
  if (key == 'g') {
    gestionSonImage("sounds/15.mp3", "img/Calque 16.png");
  }
  if (key == 'h') {
    gestionSonImage("sounds/16.mp3", "img/Calque 17.png");
  }
  if (key == 'j') {
    gestionSonImage("sounds/17.mp3", "img/Calque 18.png");
  }
  if (key == 'k') {
    gestionSonImage("sounds/18.mp3", "img/Calque 19.png");
  }
    if (key == 'l') {
    gestionSonImage("sounds/19.mp3", "img/Calque 20.png");
  }
  if (key == 'm') {
    gestionSonImage("sounds/20.mp3", "img/Calque 21.png");
  }
  if (key == 'w') {
    gestionSonImage("sounds/21.mp3", "img/Calque 22.png");
  }
  if (key == 'x') {
    gestionSonImage("sounds/22.mp3", "img/Calque 23.png");
  }
  if (key == 'c') {
    gestionSonImage("sounds/23.mp3", "img/Calque 24.png");
  }
  if (key == 'v') {
    gestionSonImage("sounds/24.mp3", "img/Calque 25.png");
  }
  if (key == 'b') {
    gestionSonImage("sounds/25.mp3", "img/Calque 26 copie.png");
  }
  if (key == 'n') {
    gestionSonImage("sounds/26.mp3", "img/Calque 27.png");
  }
}

////// mes méthodes
void gestionSonImage(String nomDuSon, String nomImage) {
  son = new SoundFile(this, nomDuSon);
  son.play();
  image_active = true; // si image_active = true alors afficher l'image dans le draw()
  // définir une position aléatoire
  imX = random(5, 500); // random sur la position
  imY = random(5, 500); //charger l'image
  img=loadImage (nomImage);
}
</code>

résultat :
{{:wiki:projets:raconte-moi-un-dessin:capture_d_ecran_2020-05-15_a_13.13.10.png|}}
{{:wiki:projets:raconte-moi-un-dessin:capture_d_ecran_2020-05-15_a_13.12.49.png|}}
{{:wiki:projets:raconte-moi-un-dessin:capture_d_ecran_2020-05-15_a_13.11.59.png|}}

----

===Problème !!===

J'aimerais que l'image disparaisse au bout de 5 secondes. Petit + j'aimerais associer plusieurs image à une seule touche du clavier (si possible)

**WIP**   
* Je dois recadrer mes images, elles ne sont pas toutes à la bonne taille, quelques images doivent "devenir" des background
* Pour que la durée de l'image soit plus longue il faut que je joue avec la fonction length
TONER KEBAB WIKI

Outils pour utilisateurs

Outils du site

Outils de la page
