p5.jsを使って色々なグラフィックデザインを作る

p5.jsとは?

p5.jsとは?
ProcessingをJavaScriptに移植したもの。

Processingとは?
JAVAというプログラミング言語をベースにしている。
プログラミングによる視覚的な表現(イメージの生成、アニメーション、インタラクション)の技法をやさしくするために生まれた。

p5.js初心者の勉強方法は?

ドットインストールではp5.jsの動画が無料ですべて公開されている。
p5.js講座 ドットインストール

公式サイトの「Reference」で説明を読みつつ、実際の動きを公式サイトの「Editor」で試してみる。
p5.js 公式サイト

また、複雑な作品は「p5.js ギャラリー」などで検索してみるといろいろ出てくる。
その中でコードを公開しているものを利用させて頂き、パラメータを変更することで実験してみる。
プログラムを分解し、動きを見て、小さいパーツごとに理解をしていく。

円をたくさん重ねる


コードはコチラ

四角が回転する

コードはコチラ

コメント

タイトルとURLをコピーしました