• Porteur(s) du projet : Manon Rizard (DSAA DG1), Damien MUTI (Prof. de Numérique)
• Date : 03/2021
• Contexte : Expérimentations macro-projet
• Fichiers :
• Liens : https://www.generativehut.com/post/using-processing-for-music-visualizationhttps://www.local-guru.net/blog/2019/1/22/processing-sound-visualizer-explained
• Capteurs/Actionneurs :
  • carte Arduino Uno / Seeduino
  • bouton poussoir

Mon intention est de créer un contrôleur midi pour images. Partant du principe que designer graphique et musiciens utilisent des outils communs (l’ordinateur par exemple) mais pour des usages différents.

L’idée est de pouvoir gérer du visuel en interaction avec la musique, grâce à un contrôleur midi constitué de deux slider, deux potentiomètres, et un bouton poussoir. Ce mini boitier sera relié à un programme processing de visualisation sonore et permettra ainsi à l’usager de modifier le visuel selon sa propre interprétation de la musique. Il pourra ainsi accentuer une forme à un moment modifier les couleurs à un autre.. tout cela grâce au contrôleur. Mon but est de transposer un outil largement utilisé dans le domaine de la musique électronique dans le domaine du graphisme, tout en gardant sa forme. Le graphiste peut ainsi apporter son propre « mix » visuel à partir de la musique qu’il écoute.

const int potentiometer = A0; const int potentiometer2 = A1; const int bouton = 8; const int slider = A2;

void setup() {

Serial.begin(9600);
pinMode(8, INPUT);

}

void loop() { Serial.println( analogRead(potentiometer)); delay(500); Serial.println(analogRead(potentiometer2)); delay(500); Serial.println(digitalRead(bouton)); delay(500); Serial.println(analogRead(slider));

}

J'ai trouvé ce programme https://github.com/amygoodchild/spinningtriangles_midicontroller/blob/master/Triangle.pde qui fonctionne avec les touches du clavier que je souhaiterai adapté pour mon contrôleur.

import processing.serial.*; Serial myPort;

import themidibus.*; import javax.sound.midi.MidiMessage; import javax.sound.midi.SysexMessage; import javax.sound.midi.ShortMessage; MidiBus myBus;

Setting up the triangles float widthgap; float heightgap; int cols = 23; int rows = 11; int numOfTriangles; Triangle[] triangles; How many frames from old variable to the next, higher is smoother but less responsive. int animationSpeed = 50; Lowering this leads to fadeytrails. float backgroundOpacity = 100; Serial myPort;

void setup() { printArray(Serial.list()); myPort = new Serial( this, Serial.list()[4], 9600);

size(1920, 1080, P3D);
//fullScreen(P3D);
colorMode(HSB, 100);
background(0);
smooth();

// Set up gap to lay out spacing between the triangles
widthgap = 100;
heightgap = 100;
numOfTriangles = cols*rows;

//MidiBus.list(); // List all available Midi devices on STDOUT. This will show each device's index and name.
//myBus = new MidiBus(this, 0, 0); // Create a new MidiBus object

String portName = Serial.list()[4]; myPort = new Serial(this, portName, 9600);

// Create an array of all the triangles
triangles = new Triangle[numOfTriangles]; 
for (int i=0; i<numOfTriangles; i++) {
  int row = i/cols;
  int col = i%cols;        
  triangles[i] = new Triangle(col, row, i);     
  triangles[i] = new Triangle(col, row, i);
}

} void draw() {

// draw the background huge and far away - if it's at the regular position in the z axis, it cuts into the triangles as they rotate
fill(0, 0, 0, backgroundOpacity);
translate(-width*2, -height*2, -500); 
rect(0, 0, width*5, height*5);
translate(width*2, height*2, 500);   

// Update and draw all the triangles
for (int i=0; i<numOfTriangles; i++) {
  triangles[i].update();
  if (triangles[i].row < rows && triangles[i].col < cols) {
    triangles[i].display();
  }
}

}

void keyPressed() {

if (keyCode == UP) {
  for (int i=0; i<numOfTriangles; i++) {
    triangles[i].newSize+=10;
  }
}

if (keyCode == DOWN) {
  for (int i=0; i<numOfTriangles; i++) {
    triangles[i].newSize-=10;
  }
}

if (keyCode == LEFT) {
  backgroundOpacity-=10;
}

if (keyCode == RIGHT) {
  backgroundOpacity+=10;
}

}

Je me suis beaucoup inspirée de la série de vidéos suivante : https://youtu.be/kESotTqQgm4

vidéos, photos du making of…