プログラミングB #10

#10 様々なメディアとその操作(1)オーディオ,タイポグラフィ


高尾俊介(takawo@konan-wu.ac.jp)
甲南女子大学 文学部 メディア表現学科 講師

 

授業の感想を記入してください。

教員からのコメント

sinとcosを使うことによって
滑らかな繰り返しの動きができることがわかったので,
このコードを使って身近にある何かを作ろうと思います!
そのためにもう少しsinとcosについて勉強します...
良いと思います.
三角関数が好きだが、プログラミングないでも便利でさすがだと感動した。
少し複雑になってきたので復習必須になってきたので大変だと思った。
復習頑張ってください🚩
プログラムの動きの種類が増えてきて楽しい。この動き、この図形の変化は何に見えるだろうか、と考えてやると色々な絵やデザインが見えてくる。難しく考えすぎず頭を柔軟に使って、もっとたくさんプログラミングしたい。
そうね,それが良いと思います.難しいときは簡単な例で試してみると良いですよ.
今回はとても楽しかったです。なんかMVに出てきそうなものを書くこともできるので、頑張っていきます。宿題頑張ります
頑張れ頑張れ🚩
三角関数を利用することで往復したり、波のようになったりと様々な動きができることを知れた。三角関数を理解するようにしたい。
お願いします😃
三角関数はすごく苦手意識があったのですが、理解できてよかったです。
しかし、今日習った関数を使った応用のプログラムを思い通りに使いこなせるか不安です。
コンピュータ自体もそうだけど,少しずつでも触ってなれるのが大事😃がんばって
色々と用語が出てきて難しかったです。三角関数は簡単そうに見えて、難しかったのでまた見直したいです。でも、三角関数で自分の好きな動きがつけられそうなので挑戦してみたいです。
頑張ってください😃
パフュームの動画のやつがきれいだなと思いました。
そうですか😃
perfumeのダンスの融合とプロジェクションマッピングは驚いた。sin,cos使うなんて数学やんって思ったけど、覚えて使い方を応用させていくことができたらなと思った。
サインもコサインも,変化する数字を与えると-1から1の範囲で揺れるだけなんで難しくはないです,何にそれをどう割り当てるか,という話.
自分でネットなどで検索してみたときにsinはどういう意味で使っているのだろうと思っていたので、今回意味が分かってすっきりしました。円周運動などいろいろいじれば複雑な図形が作れそうで楽しみです。
プログラムで複雑な動きには必ずsinやcos,またこれまでのノイズなどが使われてます.覚えると良いですよ😃
三角関数楽しくて好きです。円がみょんみょんしててかわいかった。いろんな曲線を取り入れて遊んでみたいです。
お願いします😃
一番最初のプログラムが最初は塗りかと思ったのですが、lineで書かれていて驚きました。sinやcosを面白く使えるように頑張ります。
lineもrotateや透明度を変えるなど工夫するといい感じになるのでおすすめです.
sin,cos難しかったです。
angleにnoise入れたら面白そうだとは思ったんですが、何が変わったかよくわからないままです。x,yの値を色に入れようとすると、translateの影響で途中から色が変わらなくなったりしてちょっと面倒でした。
angleにnoiseを入れていいけど,angleの基本範囲は0〜360で,noiseで生成する値の範囲は0〜1なのでmapするとか掛け算するとか,何か工夫すると良いのかも.
translateやrotateを使って原点中心に図形を回転させていたのが、三角関数のみで簡単にできてしまったので、便利だなと思いつつなんとなく悔しい気もしました。sinとcosしか基本的には使わないとのことですが、グラフの形的にもtanは余りでの繰り返しのあるframeCountと似たようなものという理解で大丈夫でしょうか?
tanは-1〜1の範囲じゃなくて極限(あの世)までいっちゃうんで値として使いづらいんですよね.atan2ってやつのほうが使います✎

sinとcosは慣れるまで時間がかかりそうだけど面白い動きをつくれそうな気がした。randomやframeCountとはちがって自分の思った動きをしてくれそうだと思った。いろいろ工夫しがいがありそうな
ので楽しんで課題に取り組みたいと思う!
まずは値を揺らすのになれたり,動かないものに割り当てて変化させるのをやるといいのかも.sinも掛け算したりすると予期しない動きをするので楽しいはず.色々試してみよう😃

 

外部ファイル(サンプル)のダウンロード






 

外部ファイル(メディアファイル)とは


  • 今までプログラミングの図形描画の機能のみでプログラミングしてきたが,p5.jsでは様々な外部ファイルを扱うことができる.
  • 外部ファイル:音源データや映像データ,画像データなどプログラム以外の方法で作成した「ファイル」になっているもの.
  • プログラムのシーンに合わせて音楽を流したり,マウスやキーボードの操作に音を割り振ったり,楽器のようなものを作成するなどが可能になる.
  • たとえばIllustratorやPhotoshopで作成した画像を読み込んで素材として使うことができる.
  • それぞれのデータ形式に関しては個別の項目で説明.

  • 配置するだけ,再生するだけであれば他のソフトをつかって編集するほうが良い.ではどんな使い方ができるだろうか.授業を通じて考えてみよう.