220120a - OpenProcessing

mySketch
xxxxxxxxxx
 
const w = 720;
let dangos = [];
​
function setup() {
  createCanvas(w, w);
  fps = 24;
  frameRate(fps);
  
  N = 20;
  for(let i=0;i<4;i++){
    dangos[i] = [];
    for(let j=0;j<N+1;j++){
      dangos[i].push(new Dango(width/N*(j-0.5 + 0.5*(i%2)), cal_y(i, j, 0), width/N));
    }
  }
}
​
function draw() {
  background("#C0FEFC");
  
  push();
  fill("#D44000");
  stroke(0, 0);
  ellipse(w*0.8, w*0.05, w*0.3);
  pop();
  
  push();
  fill("#185ADB");
  stroke(0, 0);
  for (let j = 0; j < dangos[0].length; j++) {
    rect(dangos[0][j].pos.x, dangos[0][j].pos.y - dangos[0][j].r*1, w/N, w);
  }
  pop();
​
  push();
  for(let i=0;i<4;i++){
  for (let j = 0; j < dangos[i].length; j++) {
    dangos[i][j].show();
    dangos[i][j].pos.y = cal_y(i, j, frameCount/fps);
    dangos[i][j].angle += 0.1*(0.5 - noise(i, j, frameCount/fps*2));
  }
  }
  pop();
}
​
function cal_y(i, j, t){
  return height/2 + height/24* sin(2*TAU/N*(j + t)) + width/N*3.8*i*0.9
}
​
function Dango(x, y, r) {
  this.pos = {x: x, y: y};
  this.angle = random(-1,1) * PI *0.25;
  this.r = r;
  this.colors = rand_color();
  
  this.show = function() {
    push();
    translate(this.pos.x, this.pos.y);
    rotate(this.angle);
    draw_dango(this.r, this.colors);
    pop();
  };
}
​
function rand_color(){
 let color_pat = [ 
                   ["#ffffff", "#3EDBF0", "#99FEFF"]
                 ];
 color_pat = shuffle( random(color_pat) );
  return color_pat;
}
​
function draw_dango(size, color_pat){
 stroke("#000000");
 strokeWeight(size/18);
 push();
 line(0, -size*1.8, 0, size*2);
​
 push();
 translate(0, 0);
 dango(size, color_pat[0]);
 pop();
​
 push();
 translate(0, -size);
 dango(size, color_pat[1]);
 pop();
​
 push();
 translate(0, size);
 dango(size, color_pat[2]);
 pop();
​
 pop();
}
​
function dango(size, fcolor){
  push();
  translate(0, 0)
  fill(fcolor);
  ellipse(0, 0, size);
  face(size);
  pop();
}
​
function face(size){
  push();
  fill("#000000");
  ellipse(size/8*2, -size/10, size/14);
  ellipse(-size/8, -size/10, size/14);
  fill(0,0);
  arc(size/8, size/20, size/10*1.25, size/10, -PI/2*1.25, PI/2*1.25);
  arc(size/8*0.6, size/16*3.5, size/4, size/10, 0, PI);
  pop();
}