差分
このページの2つのバージョン間の差分を表示します。
両方とも前のリビジョン 前のリビジョン 次のリビジョン | 前のリビジョン | ||
lecture:design_with_prototyping:p5.js編:14.繰返しの再構成 [2021/03/10 15:18] – ↷ lecture:design_with_prototyping:p5.js編:14.グリッドの再構成 から lecture:design_with_prototyping:p5.js編:14.繰返しの再構成 へページを名称変更しました。 baba | lecture:design_with_prototyping:p5.js編:14.繰返しの再構成 [2021/03/10 18:12] (現在) – [再帰関数で描けるもの] baba | ||
---|---|---|---|
行 1: | 行 1: | ||
- | ====== | + | {{ : |
+ | ====== | ||
+ | 繰返しと言われて皆さんなにを思い浮かべるでしょうか?一般的には同じことを何度もすることを意味しているわけですが、朝昼夜、春夏秋冬、デザイン思考等など、 | ||
+ | 繰返しとは様々なプロセスにおいて一般的に語られるプロトコルであり私達の身の回りにあふれる概念です。このページでは繰返し処理をテーマにいくつかの視覚的な表現に関するコードをスケッチしてみたいと思います。 | ||
+ | |||
+ | ===== Composition | ||
ピエト・モンドリアンの作品の中で最も有名とも言える,Compositionという作品群があります. | ピエト・モンドリアンの作品の中で最も有名とも言える,Compositionという作品群があります. | ||
> | > | ||
行 121: | 行 126: | ||
</ | </ | ||
+ | 以下はこのページのトップにある画像を生成するコードです。上記のサンプルプログラムと見比べてみてもなにか発見があるかもしれません。 | ||
+ | <file js トップの画像を生成するコード.js> | ||
+ | let number = 25; | ||
+ | |||
+ | |||
+ | function setup() { | ||
+ | createCanvas(1280, | ||
+ | background(0); | ||
+ | stroke(121, 84, 56, 150); | ||
+ | strokeWeight(1); | ||
+ | drawBar(width / 2, height - 10, 100, PI / 2, number); | ||
+ | } | ||
+ | |||
+ | function drawBar(x0, y0, length, theta, N) { | ||
+ | |||
+ | if (N > 0) { | ||
+ | let x = x0 + length * cos(theta); | ||
+ | let y = y0 - length * sin(theta); | ||
+ | |||
+ | line(x0, y0, x, y); | ||
+ | |||
+ | if (N < number / 2) { | ||
+ | stroke(49, 226, 22, 150 - 150 * (N / number)); | ||
+ | if (random(0.0, | ||
+ | stroke(49, 226, 22, 20); | ||
+ | drawBar(x, y, length * random(0.6, 1.0), theta + random(PI / 8, PI / 7), N - 1); | ||
+ | } | ||
+ | if (random(0.0, | ||
+ | stroke(49, 226, 22, 20); | ||
+ | drawBar(x, y, length * random(0.6, 1.0), theta - random(PI / 8, PI / 7), N - 1); | ||
+ | } | ||
+ | } | ||
+ | else { | ||
+ | // | ||
+ | |||
+ | if (random(0.0, | ||
+ | stroke(121, 84, 56, 150 * (N / number)); | ||
+ | drawBar(x, y, length * random(0.6, 1.0), theta + random(PI / 8, PI / 7), N - 1); | ||
+ | } | ||
+ | if (random(0.0, | ||
+ | stroke(121, 84, 56, 150 * (N / number)); | ||
+ | drawBar(x, y, length * random(0.6, 1.0), theta - random(PI / 8, PI / 7), N - 1); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | |||
+ | } | ||
+ | |||
+ | } | ||
+ | |||
+ | function keyPressed() { | ||
+ | if (key == ' | ||
+ | save(' | ||
+ | } | ||
+ | } | ||
+ | |||
+ | </ | ||
====== Reference ====== | ====== Reference ====== |