6回目のp5.js

!!!ちょっとちかちかします!!!

let r;

function setup() {
  createCanvas(400, 400);
  colorMode(HSB,360,100,100,100);
}

function draw() {
  background(0);
  fill(random(360),100,100,random(10));//これがないとdrawで戻ってきた「A」がfillになってしまう
  rect(0,0,width,height);
  for(let i=0; i<50;i=i+1){
    r=random(50);
    fill(random(360),100,100,random(100));//A
    ellipse(random(width),random(height),r,r);
  }
}

思ってたのと違い、背景までちかちかしてたのでなんでだろうと思ったらdrawで戻ってきたときのfillが背景のrectに入ってたせいだと気が付きました。

function setup() {
  createCanvas(400, 400);
  background(0,0,0);
  colorMode(HSB,360,100,100,100);
  for (let i = 0; i < 100; i = i + 1) {
    if (i % 3 == 0) {
       print(i);
      fill(random(0,90),100,100,random(100));
      text(i,i*3.9,i*4);
    }
  }
}

let akihaba;
let haba;

function setup() {
  createCanvas(400, 400);
  colorMode(HSB, 360, 100, 100, 100);
  background(0, 0, 100);
}

function draw() {
  haba = random(10, 30);
  akihaba = haba - random(2, 10);

  //   for (let x = 0; x < width; x = x + akihaba) {
  //     fill(x % 360, 100, 100, random(100));
  //     rect(x, 0, haba, haba);
  //   }

  //   for (let y = 0; y < height; y = y + akihaba) {
  //     fill(y % 360, 100, 100, random(100));
  //     rect(0, y, haba, haba);
  //   }


  for (let y = 0; y < height; y = y + akihaba) {
    for (let x = 0; x < width; x = x + akihaba) {
      if (random(100) > 50) {
        noStroke();
        rectMode(CENTER);
        fill((x + y) % 360, 100, 100, random(50, 100));
        rect(x, y, haba, haba);
      } else {
        noStroke();
        fill((x + y) % 360, 100, 100, random(50, 100));
        ellipse(x, y, haba, haba);
      }
    }

    fill(random(360), 100, 100);
    stroke(0, 0, 100);
    strokeWeight(5);
    textAlign(CENTER);
    text("RAINBOW", width / 2, height / 2);
  }
}

解像度がどんどん変わるようで面白かった。

function setup() {
  createCanvas(400, 400);
  colorMode(HSB, 360, 100, 100);
  background(250, 100, 80);
}

function draw() {
  noStroke();
  fill(250, 100, 80);
  rectMode(CORNER);
  rect(0, 0, width, height / 4 * 3 - 20);


  for (let hosi = 0; hosi < 50; hosi = hosi + 1) {
    let x = random(width);
    let y = random(height / 4 * 3 - 20);
    textSize(30);
    fill((x + y) % 360, 100, 100);
    text("☆", x, y);
  }

  stroke(0, 0, 0);
  fill(0, 80, 80);
  rectMode(CENTER);
  for (i = 0; i < 9; i = i + 1) {
    rect(15 + i * 30 + width / 6.2, height / 2 - 13, 30, 30);
  }
    noStroke();
  textSize(30);
  textAlign(CENTER);
  fill(0, 0, 100);
  text("プログラミングの森", width / 2, height / 2);

  push();
  translate(width / 5, height / 2 - height / 10);
  textSize(12);
  rotate(radians(-30));
  stroke(0, 0, 0);
  text("締め切りだよ！", 0, 0);
  pop();

  if (mouseIsPressed) {
    textSize(15);
    text("こんにちは、作りに来たんですね？(なにかキーを押す)", width / 2, height / 4 * 3);
  }

  if (keyIsPressed) {
    rectMode(CORNER);
    fill(250, 100, 80);
    rect(0, height / 4 * 3 + 3, width, height);
    fill(0, 0, 100);
    textSize(15);
    text("▼はい", width / 2, height / 4 * 3 + 40);
    text("▽いいえ", width / 2, height / 4 * 3 + 60);
        textSize(10);
    text("締め切りは今週末なんだも...", width / 2 + 100, height / 4 * 3 + 40);
    }
}

大学祭に来てくれた先輩にfabMakerだねって言われ、おいでよfabMakerの森って話になって盛り上がったのでそれを基にしました。タヌキチに（借金の代わりに）締切なんだも…っていうゲームになりそうで、それはそれで追いつめられるゲームになりそう。
最近のp5.jsブログあげるのさぼってたので更新しました。これで今のところ全部上げてます。