1225

Twitter:@dn0t_ GitHub:@ogrew

【週刊p5js】work19

f:id:taiga006:20200705000011j:plain

function setup() {
    createCanvas(900, 900, WEBGL);    
    noLoop();
    smooth();
    pixelDensity(3);
    ortho();
    background(35);
}

function draw() {
    let rx = random(0, 45);
    let ry = random(0, 45);
    let rz = random(0, 45);
    
    let c1 = random(100, 200);
    let c2 = random(100, 200);
    let c3 = random(150, 250);
    
    ambientLight(100);  

    let margin = 0;
    let rangeX = width - margin * 2;
    let rangeY = height - margin * 2;

    let size = 30;

    let cntX = floor(rangeX/size);
    let cntY = floor(rangeY/size);

    for(let i = 0; i <= cntX; i++) {
        x = -rangeX/2 + i * size;
        for(let j = 0; j <= cntY; j++) {   
            y = -rangeY/2 + j * size;   
                        
            push();
            translate(x, y, 0);

            let p = 0;
            let r = random();
            if(r < 0.25) {
                p += size;
            } else if(r < 0.5) {
                p -= size;
            } else {
                p = 0;
            }

            let c = random();
            let flag = false;
            if(c < 0.025) {
                noStroke();

                directionalLight(c1, c2, c3,   0.25,   0.25, 0); // left
                directionalLight(c2, c3, c1,   -0.55,   0.35, 0);
                directionalLight(c3, c1, c2,   -0.45,  -0.15, -0.3);

                flag = true;
            
                // ambientMaterial("#FF2E63");
                // ambientMaterial("#b8d00a");
                // ambientMaterial("#2BDE73");
                ambientMaterial("#FF9933");
            } else if (c < 0.05) {
                noStroke();

                directionalLight(c2, c3, c1,   0.25,   0.25, 0); // left
                directionalLight(c3, c1, c2,   -0.55,   0.35, 0);
                directionalLight(c1, c2, c3,   -0.45,  -0.15, -0.3);

                flag = true;
            
                // ambientMaterial("#08D9D6");
                // ambientMaterial("#f67504");
                // ambientMaterial("#00A0FF");
                ambientMaterial("#333366");
            } else {
                stroke(175);
                noFill();
            }

            rotateX(rx);
            rotateY(ry);
            rotateZ(rz);

            if(random() < 0.6 || i == 0 || j == 0 || i == cntX || j == cntY) {
                if(random() < 0.8) {
                    box(size);
                } else {
                    let v = ceil(random(1,12));
                    if(random() < 0.5 && flag == true) {
                        sphere(size * 0.8);
                    } else {
                        box(size, size * v, size);                        
                    }
                }
            }
            pop();
        }
    }
}

今週の作品メモ

📌 p5jsのWEBGLモードでOrthographic projection(正投影図)できたんですね!!!!!という感動で作りました。
p5js.org 📌 サクッと作った作品ですが、結局配色に悩んで1時間位消費しました…。沼だ…。
📌 このwireframeが折り重なることで幾何学模様ができる感じ面白いことを見つけました。

今週の雑談

📌 全国の劇場で期間限定でジブリ作品が上映しているとのことで、上映4作品の内、見たことがなかった「ゲド戦記」を見てきたんですがとても良かったです。

📌 ドングルを購入したので、いよいよNotchをはじめました。わからないことだらけですが、楽しいです。

📌 永井一正さんの作るポスターが好きで購入しました。非常に満足しています。これをp5jsなどでカバーできたらいいなあ。

今週のラジオ

📌 これから編集します…。

【週刊p5js】work18

f:id:taiga006:20200628135628j:plain

let max = 400;
let scale = 0.001;
let cd;

let xmin, xmax;
let ymin, ymax;
let cx, cy;

let size;

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

    smooth();
    noStroke();
    noLoop();

    background("#FAFAFA");
    cd = color("#222222");
    rectMode(CENTER);
}

function grain() {
    fill("#E6E8EC");
    noStroke();
    for(let i = 0; i < 20000; i++) {
        ellipse(random(width), random(height), 2, 2);
    }
}

function draw() {
    xmin = random(0.1, 0.4);
    xmax = 1.0 - xmin;
    ymin = random(0.1, 0.4);
    ymax = 1.0 - ymin;
    cx = random(20.05, 30.05);
    cy = random(10.05, 40.05);

    size = 30;

    grain();

    for(let x = xmin; x <= xmax; x += 0.03) {
        for(let y = ymin; y <= ymax; y += 0.03) {
            let xp = x;
            let yp = y;
            for(let cnt = 0; cnt < max; ++cnt) {
                xp += scale * cos(TWO_PI * noise(xp, yp) * cx);
                yp += scale * sin(TWO_PI * noise(yp, xp) * cy);


                let ratio = map(cnt, 0, max, 0.0, 1.0);
                strokeWeight(sin(PI * ratio) * 10);
                let hue = map(ratio, 0.0, 1.0, 180, 360);
                let cd = color(hue, 40, 90);
                cd.setAlpha(cos(PI * ratio * noise(ratio)) * 10);
                stroke(cd);
                point(xp * width, yp * height);
            }
        }
    }

    noFill();
    strokeWeight(2);
    stroke("#222222");
    rect(width / 2 , height / 2, width * 0.8, height *0.8);
    fill("#222222");
    rect(width * 0.1, height * 0.1, size, size);
    rect(width * 0.9, height * 0.1, size, size);
    rect(width * 0.9, height * 0.9, size, size);
    rect(width * 0.1, height * 0.9, size, size);
}

今週の作品メモ

📌 今週は、@deconbatch先生のnoteを参考にVector Fieldの扱いを勉強しました。
note.com 📌 英語だけど@deconbatchさんの過去作品とその解説が書かれているブログも最高です。(私が特に好きなやつ)
www.deconbatch.com

今週の雑談

📌 Citrus in the rain の6月の新曲リリックビデオを制作しました。
www.youtube.com 📌 Blenderでちまちまと制作していたミニチュアの部屋を舞台に女の子の思い出の部屋、そこからの旅立ちを表現しています。
📌 ひさしぶりにTouchDesignerをいじりました。

📌 少し目を話していた好きにまた面白そうなTutorialが増えていやがる…(TDSWのも含めて。)

今週のラジオ

📌 赤い公園のTHE PARKと、波よ聞いてくれの最終回と、漫画「ダブル」と、野木亜紀子と、「SUNNY 強い気持ち・強い愛」の三浦春馬が好きという話をしました!!