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

2021.01.18
スポンサーリンク

p5.jsとは？

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

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

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

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

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

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

円をたくさん重ねる


⇒コードはコチラ

四角が回転する

⇒コードはコチラ

p5.js
p5.js
スポンサーリンク
nonbiri-3
のんびりブログ

コメント

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