伊藤のポートフォリオ

2023年6月9日 02:27

▣ 自己紹介

こんにちは！
伊藤和樹（いとうかずき）と申します。

都内の大学に通う大学4年生です。
ダンスミュージックが大好きで、作曲を勉強するために入学しましたが、今ではすっかりプログラミングにハマっています。

ここでは私の大学生活で制作してきた作品をいくつか紹介したいと思います。
最後までご覧いただけると幸いです。

▣「Orange」

夏のMusic Cafe 2022にて披露するために制作した。
テンポが遅いダンスミュージックの制作に興味があり、低めのBPMでゆったりとした雰囲気の中にもグルーヴ感を持たせることを意識して制作に取り組んだ。繰り返しのメロディでも飽きないように、リズム感やコードの変化をつけた。

当日はLaunchpadを用いて演奏した。

＞ Ableton Live、Launchpad

▣ フライヤーの製作

夏のMusic Cafe 2022のフライヤーを制作した。
Adobe Photoshopのような単体でポスター制作ができてしまうソフトを持っていなかったため、プログラミングを用いてビジュアルアートを制作した。カラフルに色付けした立方体を球形に配置することで、複雑かつまとまりのあるデザインに仕上げた。

以下がオブジェクトを生成したProcessingのコード

float rotX, rotY, rotZ;
float boxsize;
float posx, posy, posz;

void setup(){
  size(630,891,P3D);
  colorMode(HSB, 360);
  smooth();
  noLoop();
  
}
void draw(){
  background(359);
  translate(width/2, height/2, 500);
  
  for(int i = 0; i < 20; i++){
   boxsity();
  }
  for(int j = 0; j < 10; j++){
    saveFrame("image05"+ j +".jpg");
  }
}

void boxsity(){
  boxsize = 90;
  posx = random(-100, 100);
  posy = random(-100, 100);
  posz = random(-100, 100);
  
  fill(random(150, 300), 250, 359);
  stroke(255);
  strokeWeight(2);
  pushMatrix();
  box(boxsize, boxsize, boxsize);
  popMatrix();
  
  rotX = random(10, 340);
  rotY = random(10, 340);
  rotZ = random(10, 340);
  
  rotateX(radians(rotX));
  rotateY(radians(rotY));
  rotateZ(radians(rotZ));
}

以下が背景を生成したProcessingのコード

int size = 20;
int x = 0;
int y = 0;

void setup(){
  size(630, 891);
  colorMode(HSB, 360);
  smooth();
  stroke(0, 360, 360, 180);
  strokeWeight(0.1);
}

void draw(){
  for(y = -6; y < height; y += size){
    for(x = -3; x < width; x += size){
      fill(180+y/20, 360-y/10, 360-y/10);
      rect(x, y, size, size);
    }
    x = -3;
  }
  noLoop();
  saveFrame("haikei062.jpg");
}

＞ Processing、Fotor Design

▣「Watch Your Step」

コスモス祭2022 コンピュータ音楽ゼミ生有志によるライブコンサートにて披露するため制作した。
私が1年生の時に初めて作った曲を自身でリメイクし、演奏した。ダンスミュージックらしく低音が強めで、楽器のフレーズが噛み合うように意識しながら制作に取り組んだ。

当日はLaunchpadを用いて演奏した。

＞ Ableton Live、Launchpad

▣ インタラクティブアートの制作

卒業制作の試作として作成した。
「叫びの壺」は壺に叫んでも無音になってしまうため、叫んだ分のエネルギーが還元されないのは勿体無いというコンセプトで制作を試みた。壺が開いている間だけ録音し、一度閉じた後に再度開けると録音された音声が再生されるシステムをMaxで作成した。
Max、Processing間はosc通信を用いて情報を送信している。
動画内ではProcessingで描画した壺の開き具合をMaxへと送信しているが、最終的には本物の壺にRaspberryPIを内蔵させ、MaxのRNBOを用いてシステムをRaspberryPIで動作させる予定だ。これにより外部のコンピューターを用いない作品の制作を予定している。

以下が使用したProcessingのコード

import netP5.*;
import oscP5.*;

OscP5 osc;
NetAddress myAddress;

int x = 200;
int y = 400;
float ang = 0;

void setup(){
  size(600, 600);
  colorMode(HSB, 100);
  osc = new OscP5(this, 5000);
  myAddress = new NetAddress("localhost", 5000);
}

void draw(){
  background(0, 0, 90);
  beginShape();
  vertex(100, 600);
  bezierVertex(100, 500, 150, 410, 200, 400);
  vertex(400, 400);
  bezierVertex(450, 410, 500, 500, 500, 600);
  endShape();
  
  if(mousePressed == true){
    ang = atan2(mouseY - y, mouseX -x);
  }
  if(ang > 0){
    ang = 0;
    fill(0, 99, 99);
  }else if(ang <= -1.5){
    ang = -1.5;
    fill(50, 99, 99);
  }else{
    fill(0, 99, 99);
  }
  ellipse(100, 100, 50, 50);
  
  translate(200, 400);
  rotate(ang);
  fill(0, 0, 99);
  ellipse(100, -20, 30, 30);
  rect(0, -10, 200, 10);
  
  OscMessage myMessage = new OscMessage("/tubo");
  myMessage.add(ang);
  osc.send(myMessage, myAddress);
  println(myMessage);
}

＞ Processing、Max8

▣ ビジュアルアートの制作

2022年度の秋学期に行った音楽系ゼミの発表会にて披露するために制作した。
作曲、演奏、映像の分担で映像を担当し、題材がダンスミュージックということもありスペクトラムサイクルを軸にして制作を行った。ドロップで疾走感を感じられるような演出や変化する背景など、単調な映像の中にも飽きないように工夫した。
オーディオインターフェースを接続することで、入力された音声に対してリアルタイムで反応するコードも同時に作成した。

演奏：豊田倫彰　　作曲：伊東尚紀　　映像：伊藤和樹

以下がビジュアルアートを生成したProcessingのコード

import ddf.minim.spi.*;
import ddf.minim.signals.*;
import ddf.minim.*;
import ddf.minim.analysis.*;
import ddf.minim.ugens.*;
import ddf.minim.effects.*;

Minim minim;
AudioPlayer player;
FFT fftL, fftR;

int numh = 400;
int[] x = new int [numh];
int[] y = new int [numh];
float[] dark = new float [numh];
int[] xsp = new int [numh];
int len;
int lenw = 8;
float j;
int count = 0;
int state = 0;

float rad = 120;
float crz = 100;
float br = 2;
color c1 = color(120, 150, 200, 255);
color c2 = color(127, 255, 212, 255);

int num = 100;
int size = 5;
int strw = 1;
Circle[] c = new Circle[num];

void setup(){
  minim = new Minim(this);
  player = minim.loadFile("オーディオファイル.mp3");
  player.play();
  fftL = new FFT(player.bufferSize(), player.sampleRate());
  fftR = new FFT(player.bufferSize(), player.sampleRate());
  
  fullScreen();
  noCursor();
  rectMode(CENTER);
  frameRate(60);
  len = height;
  smooth();
  frameRate(60);
  
  for(int i = 0; i < numh; i++){
    xsp[i] = lenw;
    x[i] = xsp[0] / 2 - width / 2;
    y[i] = len / 2 - height / 2;
    j = map(i, 0, numh, -128, 128);
    dark[i] = 128 - abs(j);
  }
  
  for(int i = 0; i < num; i++){
    c[i] = new Circle(size, strw, random(10, 30));
  }
}

void draw(){
  translate(width/2, height/2);
  background(0);
  
  noStroke();
  for(int i = 0; i < count; i++){
    fill(50, 20 , dark[i], dark[i]);
    rect(x[i], y[i], lenw, len);
    x[i] += xsp[i];
  }
  
  if(count < numh){
    count++;
  }

  for(int i = 0; i < numh; i++){
    if(x[i] > width){
      x[i] = lenw / 2 - width / 2;
      y[i] = len / 2 - height / 2;
      xsp[i] = lenw;
      
    }
  }
  
  noFill();
  if(key == '4'){
    for(int i = 0; i < num; i++){
      crz = 200;
      c[i].radiationMore();
      c[i].red();
      c[i].display();
    }
  }else if(key == '3'){
    for(int i = 0; i < num; i++){
      crz = 200;
      c[i].gather();
      c[i].red();
      c[i].display();
    }
  }else if(key == '2'){
    for(int i = 0; i < num; i++){
      crz = 100;
      c[i].white();
      c[i].radiation();
      c[i].display();
    }
  }else if(key == '1'){
    for(int i = 0; i < num; i++){
      crz = 100;
      c[i].white();
      c[i].fin();
      c[i].display();
    }
  }
  
  fftL.forward(player.left);
  fftR.forward(player.right);
  
  float radious = rad + player.mix.level()*crz;
  
  stroke(lerpColor(c1, c2, map(player.mix.level(), 0, 0.2, 0, 1)));
  strokeWeight(1);
  for(int i = 1; i < fftL.specSize() / 2; i += 2){
    float angle = HALF_PI - map(i, -fftL.specSize() / 2, 0, 0, PI);
    float len = fftL.getBand(i) * 20;
    float lenb = map(len, 0, 400, 0.4, br);
    len = len/lenb;
    line(radious * cos(angle), radious * sin(angle), (radious + len) * cos(angle), (radious + len) * sin(angle));
  }
  for(int i = 1; i < fftL.specSize() / 2; i += 2){
    float angle = HALF_PI + map(i, -fftR.specSize() / 2, 0, 0, PI);
    float len = fftR.getBand(i) * 20;
    float lenb = map(len, 0, 400, 0.4, br);
    len = len/lenb;
    line(radious * cos(angle), radious * sin(angle), (radious + len) * cos(angle), (radious + len) * sin(angle));
  }
}

以下が同時に使用したclass「Circle」のコード

class Circle{
  float x, y, xsp, ysp, sp, xz, yz;
  int size, strw;
  int lowlim = 40;
  
  Circle(int size, int strw, float sp){
    this.size = size;
    this.strw = strw;
    this.sp = sp;
    x = random(-100, 100);
    y = random(-100, 100);
    if(abs(x) < lowlim && abs(y) < lowlim){
      if(abs(x) < abs(y)){
        if(y > 0){
          y = lowlim;
        }else{
          y = -lowlim;
        }
      }else if(abs(x) > abs(y)){
        if(x > 0){
          x = lowlim;
        }else{
          x = -lowlim;
        }
      }
    }
    xz = x;
    yz = y;
    xsp = x;
    ysp = y;
  }
  
  void radiation(){
    x += xsp/sp;
    y += ysp/sp;
    
    if(x < - width/2 || x > width/2){
      x = xz;
      y = yz;
    }
    if(y < - height/2 || y > height/2){
      x = xz;
      y = yz;
    }
  }
  
  void radiationMore(){
    x += 2 * xsp/sp;
    y += 2 * ysp/sp;
    
    if(x < - width/2 || x > width/2){
      x = xz;
      y = yz;
    }
    if(y < - height/2 || y > height/2){
      x = xz;
      y = yz;
    }
  }
  
  void gather(){
    x -= 2 * xsp/sp;
    y -= 2 * ysp/sp;
    
    if(abs(x) < abs(y) && y > 0 && y < 10){
      x = height/2 /yz * xz; 
      y = height/2;
    }else if(abs(x) < abs(y) && y < 0 && y > -10){
      x = -height/2 /yz * xz; 
      y = -height/2;
    }
    if(abs(y) < abs(x) && x > 0 && x < 10){
      x = width/2; 
      y = width/2 /xz * yz;
    }else if(abs(y) < abs(x) && x < 0 && x > -10){
      x = -width/2; 
      y = -width/2 /xz * yz;
    }
  }
  
  void fin(){
    x += xsp/sp;
    y += ysp/sp;
  }
  
  void white(){
    stroke(255, 255, 255, 150);
  }
  
  void red(){
    stroke(sqrt(sq(abs(x)) + sq(abs(y))) - 100, 150, 150, 255);
  }
  
  void display(){
    strokeWeight(strw);
    ellipse(x, y, size, size);
  }
}

＞ Processing

この記事が気に入ったらサポートをしてみませんか？