Palette

ritocoのクリエイティブコーディング記録

【 p5.js 】Whimsical Gradations.

f:id:ritocopalette:20211204115937p:plainf:id:ritocopalette:20211204115947p:plain



code( p5.js )

let num = 15; let angle = 1.0;

function setup() {
    createCanvas(500, 500, P2D);
    colorMode(HSB, 360, 100, 100, 100);
    drawingContext.shadowBlur = windowWidth*0.08; //0.08-1.2
   noLoop();
}

function draw() {
   background(255);
   marble();
}

function marble() {
 angle += 0.1;
    for (let i = 1; i <= num; i++) {
        let x = sin(angle * i) * (min(width, height));
        let y = cos(angle * i) * (min(width, height) / 2.5);
        let size = sin(angle) * i * random(90,10);
        let h = map(i, random(num), num, 1, 10);
        fill(120, 10, 0);
        push();
     

    // shape Color
    let col1 =["#79CBCE", "#D1ECEC"];
    let gd1 = random(col1);
    drawingContext.shadowColor = gd1;

    // shape Position
        blendMode(DIFFERENCE);
        translate(sin(angle * 2) * x + width / 2, tan(angle) * y + height / 2);
        rotate(angle * num);

    // shape Draw
        strokeWeight(10000);
        stroke(h, 10, 100);
        
        ellipse(0, 0, random(20), 2000);

        bezier(30, size + sin(y),
        0,0,
        size * sin(140 * angle),
        size * sin(angle),
        cos(120 * angle), size * cos(100 * angle),
        size,
        sin(220 * angle), 80, sin(130 * angle))

        pop();
    }
    blendMode(BLEND);
}




openProcessing

openprocessing.org



License

クリエイティブ・コモンズ・ライセンス


memo / comment

なぜこうなるのかわからない。だがそれがいい
let num と drawingContext.shadowBlur の値を触ると、いろんな見え方をして面白いです。
shape Colorは適当に入れてます。
印刷すると綺麗かもしれないです。