Daily Creative Coding

元「30 min. Processing」。毎日、Creative Codingします。

三角形でマスキングテープ風スケッチ

/**
 * triangle tapes 
 * 
 * @author aadebdeb
 * @date 2017/02/16
 */

var particles;
var bgColor;
var fillColors;

function setup() {
  createCanvas(windowWidth, windowHeight);
  frameRate(10);
  bgColor = color(254, 247, 242);
  fillColors = [
    color(240, 235, 69, 160),
    color(241, 66, 145, 160),
    color(166, 116, 176, 160),
    color(161, 216, 230, 160)
  ];
  background(bgColor);
  particles = [];
  for (var i = 0; i < 7; i++) {
    particles.push(new Particle());
  }
}

function draw() {

  for (var i = 0; i < particles.length; i++) {
    var particle = particles[i];
    particle.render();
    particle.update();
  }
  
  if (random(1) < 0.5) {
    particles.shift();
    particles.push(new Particle());
  }
  
}

function mousePressed() {
  background(bgColor);
}

function Particle() {
  this.loc = createVector(random(width), random(height));
  var velSize = 20;
  var velAng = random(TWO_PI);
  this.vel = createVector(velSize * cos(velAng), velSize * sin(velAng));
  this.vertices = [];
  this.rot = HALF_PI;
  this.fillColor = fillColors[int(random(fillColors.length))];
}

Particle.prototype = {
  render: function() {
    stroke(255, 20);
    strokeWeight(1);
    fill(this.fillColor);
    if (this.vertices.length < 3) {
      return; 
    }
    beginShape();
    for (var i = 0; i < 3; i++) {
      var v = this.vertices[i];
      vertex(v.x, v.y);
    }
    endShape(CLOSE);
  },
  
  update: function() {
    this.loc.add(this.vel);
    this.vel.rotate(random(-PI / 4, PI / 4));
    this.weight = randomGaussian(20, 5);
    this.vertices.push(p5.Vector.add(this.loc, this.vel.copy().normalize().rotate(this.rot).mult(this.weight)));
    if (this.vertices.length > 3) {
      this.vertices.shift();
    }
    this.rot *= -1;
  }
}
f:id:aa_debdeb:20170214221622j:plain