日本語サイト リファレンスの日本語翻訳 P5.js 日本語リファレンス - Qiita 関数別の説明が細かく載っていてとてもありがたいです。アーティストのレオナさんのサイト だらっと学習帳 日々のコーディングからtipsを載せてくださっています。Katsumi Shibata…

プログラミングをはじめて二か月ほどで感じたこと。 どうにもならないという表現は不適切かもしれないが、入門向けのコンテンツによく挙げられるいくつかの文を覚えた段階ではハイハイをはじめた程度だと思った。 不器用な二足歩行なら基本文を駆使してもで…

画像のような単純な花模様を描く。 花びら部分の曲線はbeginShapeのcurveVertexが使いやすい。 クラスの勉強を兼ねて放り込んでみる。 let theta=0; let split; let num=[3,5,8,13,21]; let hana1; function setup() { createCanvas(400, 400); background(2…

考え方自体はどの言語でも使えるものなのでp5.jsと題しているのはあまり意味ないです。 正三角形を描画するときには ・1辺を基準にする場合 ・中心点を基準にする場合 の二つがあります。 三角関数を理解しているのは前提としてそれぞれの考え方を書いておき…

自分がp5.jsを通してジェネレーティブアートをはじめたきっかけの一つにはすぐに利益を得られる環境を見つけたからだ。 あまりこういう話は好まない人もいるだろうけど、別の誰かにとっては価値のある情報かもしれないので書いておこうと思う。 ユニークなプ…

これまでのプログラミング経験 経験によっても感想が変わってくると思うので、まず自分のプログラミング経験をなぞってみようと思う。 高校の授業でC#を扱っていた。 ワードプレスでCSSを一週間くらいいじった。 Pythonを勉強しようとして環境構築まではした…

p5.jsの便利な図形描画の方法にbeginShapeがある。 多角形や計算では算出できない複雑な図形を書く時には覚えておきたい関数だ。 ただvertexで各点を指定する必要があるのでコードが長くなりやすい。複製をするならなおのことだ。 beginShape(); vertex(10,2…

上のような模様の複製パターンの基本的なコードの書き方を考える function setup() { createCanvas(400, 400); background(220); noStroke(); noLoop(); } function draw() { let posx=0,posy=0; const dia=100; const num=5; //Y列用のループ for(let i=0;i