glitch (alike) for vjs

vade » Blog Archive » Real World Max/MSP/Jitter 1 - Glitch (alike) for VJs

glitchっぽい映像を、jitterで作るチュートリアル。
glitchの特徴はfragmentation, repetition, linearity and complexityだそう。
随分前にブックマークしておいたんだけど、今になってprocessingでやってみようと思った。

まずイメージと、ブロックノイズを組み合わせてるんだけど、ブロックノイズの作り方。
2通り思いつく。

普通にrect()で作る。

Noiser noiser;
int colNumber = 5;
int rowNumber = 5;

void setup() {
  size(200, 200);
  noiser = new Noiser(colNumber, rowNumber);
}

void draw() {
  noiser.drawNoise();
}

class Noiser {
  int col;
  int row;
  public Noiser(int col, int row) {
    this.col = col;
    this.row = row;
  }
  void drawNoise() {
    for(int j=0; j<height; j+=height/row) {
      for(int i=0;i<width;i+=width/col) {
        noStroke();
        fill(random(255),random(255),random(255));
        rect(i, j, width/col, height/row);
      }
    }
  }
}

pixels使う。widthをcolで割った数が整数にならなかったりした時とかに今後の展開感じる。

Noiser noiser;
color[][] colorTable;
int colIndex = 0;
int rowIndex = 0;
int colNumber = 5;
int rowNumber = 5;

void setup() {
  size(200, 200);
  noiser = new Noiser(colNumber, rowNumber);
  colorTable = new color[colNumber][rowNumber];
}

void draw() {
  noiser.drawNoise();
}

class Noiser {
  int col;
  int row;
  public Noiser(int col, int row) {
    this.col = col;
    this.row = row;
  }
  
  void drawNoise() {
    for(int j=0; j<height; j+=height/row) {
      for(int i=0; i<width; i+=width/col) {
        if(colIndex>=col) {
          colIndex = 0;
        }
        if(rowIndex>=row) {
          rowIndex = 0;
        }
        colorTable[colIndex][rowIndex] = color(random(255), random(255), random(255));
        colIndex++;
      }
      rowIndex++;
    }

    loadPixels();
    for(int j=0; j<height; j++) {
      for(int i=0; i<width; i++) {
        int pos = i+j*width;
        if(pos%(width/col)==0) {
          colIndex++;
        }
        if(pos%(width*height/row)==0){
          rowIndex++;
        }
        if(colIndex>=col) {
          colIndex = 0;
        }
        if(rowIndex>=row) {
          rowIndex = 0;
        }
        pixels[pos] = colorTable[colIndex][rowIndex];
      }
    }
    updatePixels();
  }
}

次回、画像と合わせる。