円弧が気持ちいい

はじめに

この記事ではクリエイティブコーディングで扱うランダムの面白さについて書きます。このアドベントカレンダーと紐づいた内容です。

対象.01

sketch.js

//classの部分のみ

class Particle {
  constructor(cn) {
    this.angle = random(2 * PI);
    this.radius = width;
    this.velocity = random(1, 3);

    this.radiusBorder = random([90, 190, 290]);
    this.isPoint = true;

    this.angleAdd = 0;
    this.angleSpeed = this.velocity / 1000;

    this.weight = random(1, 50);

    if (cn == 0) {
      this.c = color(50, random(100, 255), random(100, 255));
    } else if (cn == 1) {
      this.c = color(random(100, 255), 50, random(100, 255));
    } else {
      this.c = color(random(100, 255), random(100, 255), 50);
    }
  }

  move() {
    this.isPoint = this.radius >= this.radiusBorder;
    if (this.isPoint) {
      this.radius -= this.velocity;
    } else {
      this.angleAdd += this.angleSpeed;
    }
  }

  draw() {
    pg.noFill();
    pg.strokeCap(PROJECT);
    pg.strokeWeight(this.weight);
    pg.stroke(this.c);
    if (this.isPoint) {
      pg.point(
        width / 2 + this.radius * cos(this.angle),
        height / 2 + this.radius * sin(this.angle)
      );
    } else {
      //引数が半径ではない
      pg.arc(
        width / 2,
        height / 2,
        this.radius * 2,
        this.radius * 2,
        this.angle - this.angleAdd,
        this.angle + this.angleAdd
      );
    }
  }
}

実行結果

対象.01

sketch.js

//関数の部分のみ、関数名をaにしてたのは驚愕

function a(_x, _y, _r, _sc, _bgc) {
  let n = floor(random(3, 10));
  for (let i = 0; i < n; i++) {
    let c = random(100) < 70 ? _sc : _bgc;
    noFill();
    stroke(c);

    strokeWeight(random(_r / 3));
    strokeCap(SQUARE);
    let sa = random(2 * PI);
    let ea = random(2 * PI);
    arc(_x, _y, _r, _r, sa, ea);
  }
}

実行結果

円弧がなぜ好きか

なぜか好きです。
なんでかわかんなくてわかんないんです。
でも好きです。

だから、円形に繋がってしまっているものよりも繋がっていないものの方が好きです。

おわりに

好きっていう感情が論理的に説明の付くものじゃない気がしました。
だからこそ、言語を介さずに好きな作品をパッと見せることで、伝わるものもあるかなとか。