yoppa.org


芸大 – メディアアート・プログラミング I 2023

最終課題へ向けて! – Patatapを作る!

Image result for patatap

この講義「データ構造とアルゴリズムでは」変数と定数、反復、乱数、論理式と条件文、アニメーションとベクトル、配列の操作、関数、そしてオブジェクト指向プログラミングと様々なトピックスを扱ってきました。最終課題はこれらの内容を総動員して、Patatap (https://patatap.com/) のようなインタラクティブなオーディオビジュアル作品をp5.jsで制作します。

Patatapはとてもシンプルなインタラクションで構成された作品です。キーボードを操作すると、それぞれのキーにシンプルなアニメーションが割り振られていて、同時にサンプリングされたサウンドが鳴るようになっています。仕組みはとても単純なのですが、キーボードをリズムにあわせてタイピングすることで音と映像が同期して、まるでVJのパフォーマンスをしているような気分を味わえます。キーボードの組み合わせは無限にあるので、いつまでも飽きることがありません。

今回は、最終課題に向け、p5.jsをつかってPatatapを制作するための方法について解説していきます。

映像資料

スライド資料

本日の課題の提出フォーム

本日の発表用の課題提出フォームです。

(本日の) 課題提出フォーム

最終課題提出フォーム

最終課題で制作した作品は、OpenProcessingにアップロードして下記のフォームからURLを提出してください。

最終課題提出フォーム

サンプルプログラム