Continue(s)

Twitter:@dn0t_ GitHub:@ogrew

【週刊p5js】work17 

let w, h;
let arr = [];

function setup() {
    createCanvas(800 ,800);
    noLoop();
    
    hw = width/2;
    hh = height/2;
    imageMode(CENTER);

    for(let i = 0; i < 6; i++) {
        arr[i] = random(100, 300);
    }
}

function draw() {
    background(225,230,236);

    drawingContext.shadowBlur = 10;

    let g = createGraphics(width, height);
    g.background(225,230,236);
    g.translate(200, 550);
    g.erase();
    let dh = 0;
    let dSizeX = 25;
    let dBuffer = 50;
    for(let i = 0; i < 6; i++) {
        let dSizeY = arr[i];
        g.rect(i * (dBuffer + dSizeX), dh, dSizeX, -dSizeY, 10);
    }
    g.noErase();
    g.noStroke();

    g.translate(200, 50);
    g.fill(225,230,236);
    g.ellipseMode(CENTER);
    g.drawingContext.shadowBlur = 10;
    g.drawingContext.shadowOffsetX = 4;
    g.drawingContext.shadowOffsetY = 4;
    g.drawingContext.shadowColor = color("#A3B1C6");
    g.ellipse(50, 0, 50);
    g.ellipse(-50, 0, 50);
    g.drawingContext.shadowOffsetX = -3;
    g.drawingContext.shadowOffsetY = -3;
    g.drawingContext.shadowColor = color("#FFFFFF");
    g.ellipse(50, 0, 50);
    g.ellipse(-50, 0, 50);

    g.textSize(20);
    g.fill(150);
    g.textAlign(CENTER, CENTER);
    g.textStyle(BOLD);
    g.text(">", 50, 0);
    g.text("<", -50, 0);

    push();
    translate(200, 550);
    noStroke();
    fill(254, 128, 26);
    for(let i = 0; i < 6; i++) {
        let dSizeY = random(arr[i] * .1,  arr[i] * .7);
        rect(i * (dBuffer + dSizeX), dh, dSizeX*0.9, -dSizeY, 10);
    }
    pop();

    push();
    translate(hw, hh);
    drawingContext.shadowOffsetX = 4;
    drawingContext.shadowOffsetY = 4;
    drawingContext.shadowColor = color("#A3B1C6");
    image(g, 0, 0);
    drawingContext.shadowOffsetX = -3;
    drawingContext.shadowOffsetY = -3;
    drawingContext.shadowColor = color("#FFFFFF");
    image(g, 0, 0);
    pop();
}
f:id:taiga006:20200614200351j:plain

今週の作品メモ

📌 最近よくSNSなどで見る、巷ではフラットデザインの次に来るとか来ないとか言われている（？）"Neumorphism"というやつを無理やりp5.jsだけでやってみました。
📌 ソースコード読める人ならわかるけどこんなの全然だめです。CSSでおとなしく頑張りましょう。
📌 まあ、そもそもこのデザイン指針自体どうなん？って言われてるみたいですが。
📌 一応詳しい日本語記事があったので載せておきます。
qiita.com

📌 ちょっと頑張ってた事案で、空回りというか周りとの温度感に自分のSAN値が削られてしまって非常に萎えていたんですが、週刊p5.jsに取り組んで少し回復しました。
📌 ありがとう、p5.js！！
📌 自分の代わりに頑張ってくれている人には声をかけていきたいし、自分の立場を考えて発言していきたいですね。
📌 況や、余計ない一言や、生産性のない発言は避けていきたい。

今週の雑談

📌 Notch始めます！実は打倒コロナで始まったNotchのキャンペーンセールに一番乗りくらいでLearnユーザ用ドングルを購入していたのですが、昨日まで届いていませんでした。

📌 何度か本社に問い合わせて、対応してもらった結果ついに手に入りました。
📌 CodeMeterを使ったアカウントのアクティベート化に少し手間がかかりましたが、なんとかSaveできるようになったことを確認しました。
📌 （ちなみにNotchは使うこと自体は無料でもできます、ただファイルの保存ができません。）
📌 （つまり、ぼくは5000円で保存機能を買った、、、ということ？）

📌 PhotoShopの勉強も始めました！
📌 こんなのとか…

📌 こんなのを作ってみました。

📌 デザイナーになるぞ、ってわけではないんですが一応少しは使えるようになっておこうと思って始めました。
📌 まあ、Notchも来たし、無理ないペースでいろんなTutorialだったりをこなしていきたいと思います。

今週のラジオ

📌 佐々木希の顔が覚えられない、という話をしています。