lecture:design_with_prototyping:p5.js編:12.動画の再構成

差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

両方とも前のリビジョン 前のリビジョン
次のリビジョン
前のリビジョン
lecture:design_with_prototyping:p5.js編:12.動画の再構成 [2021/05/18 13:23] – [各画素の取得] babalecture:design_with_prototyping:p5.js編:12.動画の再構成 [2021/05/19 08:56] (現在) – [技術小話(canvasで描いた内容を動画で保存する)] baba
行 229: 行 229:
 </WRAP> </WRAP>
  
 +
 +===== 技術小話(canvasで描いた内容を動画で保存する) =====
 +作ったエフェクトを課題等で動画形式に変換して提出する場合,chromeブラウザで動作させているのであれば,webm形式で保存するのが簡単です.以下のページにtemplateがあります.
 +  * [[p5js:tips:canvasの動画保存|canvasを動画で保存する]]
 +
 +ただし上記ファイルは p5canvasRecording.jsという別ファイルを読み込んでいるので,一旦作ってしまった課題ファイルとガッチャンコするのは初学者の場合は少し大変かなとおもいました.そこで,このページの課題を動画形式にで保存するための雛形も合わせて準備しておきました.「自作エフェクトを動画で提出しなきゃ」という場合は以下のtemplateを利用してください.
 +  * https://editor.p5js.org/tetsuakibaba/sketches/BzKOpCCqr
 +
 +テンプレートを利用して保存した動画ファイルの例を以下に示します.現時点(2021年5月19日)ではGoogleの独自形式なため,FirefoxやSafariでは再生できないことにご注意ください.このページをChromeブラウザで開いている場合に以下の動画を閲覧できます.
 +{{ :lecture:design_with_prototyping:p5.js編:newvid_3_.webm |}}
 ====== 作品ギャラリー ====== ====== 作品ギャラリー ======
-{{gallery>lecture:design_with_prototyping:03.動画の再構成?04.png&220x220&3&lightbox }}+課題提出物を一部抜粋してご紹介します. 
  
  • /home/users/2/lolipop.jp-4404d470cd64c603/web/ws/data/attic/lecture/design_with_prototyping/p5.js編/12.動画の再構成.1621311829.txt.gz
  • 最終更新: 2021/05/18 13:23
  • by baba