クリエイティブコーディング(p5.js)入門(高尾俊介)第4回

以下の講義を進めていきます。

【2020後期】プログラミングB – Takawo Shunsuke | 高尾俊介

今回は第4回目。

授業の狙い
プログラミングは現代社会のさまざまな場で使われています.「プログラミング」は便利で役に立つアプリを作るためだけのものではありません.

風景を観て絵を描いたり,印象的な出来事を詩で詠うことと同じように,表現のための道具としてプログラミングを捉える「クリエイティブコーディング」と呼ばれる分野は近年新しい表現の手法として注目されています.これはプログラミングを専門家(プログラマ)だけのものではなく,私たちのような創造的生活者へとひらくものです.

この授業ではJavaScriptで動作するクリエイティブコーディング環境p5.jsでウェブ上で動作するインタラクティブなコンテンツ制作の基礎を学びます.

 

以下は講義の内容と実施事項。
第4回の講義のリンクはこちら。

 

今回の授業内容は、以下の2点。

  1. 変数
  2. 条件分岐と真偽値

 

1)変数の使い方ー宣言と代入

お手本のコードを使って、赤い丸を増やしてみる。
以下が作成した画像。変数に足し算、引き算をする。

f:id:techtack:20211001150518p:plain

 

2)代入を使ったアニメーション

①円が動くプログラム
②速度を変数にする
③衝突判定をつくる
の手順を踏んでアニメーションを作成した。

ここで、画面にあたって速度が変わることをどうやって表現するかというと、
「円がある範囲に来た場合、速度に−1をかける」ことで表現できそう。
ということで、それを反映して、プログラムを書いた結果。

f:id:techtack:20211001152331g:plain

moving_ball - OpenProcessing

以上になります。引き続きやっていきます!