これは vvvv Advent Calendar 2015 の17日目の記事です。
こんにちは。高橋と申します。 3年ほど前からvvvvを愛用しており、最近になってvvvv関連のイベントにもちらちらと顔を出させていただいております。
さて、僕は現在、明治大学の博士課程に在学しており、研究室での技術共有や授業の一環として「vvvv勉強会」を何度か行いました。
今回は、その内容について、ざっくりと書きたいと思います。
ご意見ご感想は以下からお願いします。
Twitter: @kaede_tone
Email: ee97064(at)gmail.com
vvvv勉強会＠大学
まず、これまでの勉強会の内容について。
-
2014年06月 研究室にて
参加者10名程度。90分。
vvvvの導入からはじめ、実際に手を動かしてもらったりもしました。
-
2015年04月 研究室のゼミにて
写真はとっていませんでした。
参加者20名程度。30分。
詳細な説明よりも、こんなことできるよ自慢が中心。
-
2015年12月 学部3年生の授業にて
参加者20名程度。15分（授業の都合により）
授業内容が音楽系の内容であったため、音に反応する作例、Puredataとの連携について紹介。
と、まだまだ回数は少ないですが。
映像に関する話が中心ですが、研究のためのプロトタイピングツールとして優秀だと思うので、そういったお話も絡めています。（そもそも映像関係にはあまり詳しくないので…）
勉強会資料
そんな勉強会で利用している資料についてまとめてみたいと思います。
毎回、少しずつアップデートしたり、時間に合わせて調整したりしていますが、大まかな内容は「vvvvvook」に準じています。（毎度お世話になっています）
スライド
僕は、PowerPointがないと落ち着いて喋れないので、毎回がっつり用意しています。
メインに使用している「入門スライド」は、基本操作から主要ノードの説明、パッチ作成実践、応用（マウス、キーボード、音、カメラ、各種デバイスとの連携、WebAPIの利用）などなど。大体60枚ぐらいになっています。
時間があるときは順番に説明していきますが、最近は事前配布にしてしまっています。
権利上怪しいスライドもあるので、こんな感じでイメージが伝われば…
いつか公開したいなぁ～と思っています。
こだわり
よくやるのは、スライド背景にvvvvで作成した画像を使用して、「こんなことができますよー」というパターンです。
例えば、こんな感じのものを画像として書き出して、かなり薄めにしてスライド背景として利用しています。プレゼンの流れの中で、パッチ例と利用例を同時に紹介できるため、お気に入りの手法です。
また、vvvvでプレゼンソフトも作っているので、これを利用したりもできそうです。機会があったら記事にしたいなぁ、と思っています。プレゼンの中にサンプルパッチが仕込まれている、みたいなことができたら面白そうですよね。
（今のところは安定性を優先してPowerPointで）
そして、アニメーションなど、動きの説明をするスライドはすべて動画を挿入しています。
プレゼンと並行してパッチを開いたり閉じたり…と繰り返すのは非常にテンポが悪いので、意外と重要なところだと思います。動画はすべて自動再生にしており、スライドを開くと勝手に動いてくれます。
Gyazoなどでひたすらmp4化すると比較的楽に作れます。
マウス操作の説明
エディタの操作方法がビジュアルプログラミング言語の最初の難所、のように思います。
とはいえ、一つずつ説明する余裕がないのが正直なところなので、以下のようなスライドを作っていたりします。
実際には、ここからさらによく使うものを抜粋して説明。
あとは、マウスの挙動を見やすくするためのプラグインを書いてみたり…
ちょっと頑張ってみたりも。物は試しでマウスの可視化．とても適当なC#のコードで実現されていますが，一応vvvv内で完結してるのでマウス以外の情報を流し込めたりもしそうです．（Formを特定色透過させています） #vvvv_jp pic.twitter.com/NRXL1fnEru
— Haruki Takahashi (@kaede_tone) June 2, 2015
しかし、こういった補助ツールはうまく使えている気がしません。勉強会専用にrootパッチに組み込んでしまおうかなぁとか思っていますが、Windows標準の拡大鏡などでちょっと見やすくしてあげる、ぐらいで事足りている気もします。これはどうなのかなぁと思いますが，拡大鏡みたいなものも． #vvvv_jp pic.twitter.com/fZOpQezRUq
— Haruki Takahashi (@kaede_tone) June 2, 2015
最近では、詳細な操作説明を諦めて、開発環境としての魅力をアピールしまくるほうが良いのかなぁ、とも思っています。言語自体にいかに興味を持ってくれるか、が重要ですよね。
サンプルパッチ
僕が気分転換に作ったパッチや、シンプルな構造でいい感じの映像が作れているものをサンプルとして配布しています。Tips的なものですかね。これらに関してはそこまで深く説明していません。
例えば、こんな感じのものを。
Github: Example
また、特にvvvvの利用目的が想定されている場合は、それに合わせたサンプルを作ったりもします。
FFTやBeatDetectorを利用したもの（といっても、簡単にTransformに流しただけですが）や、ほかのアーティストさんが作ったものの再現などなど…
気分転換に作ったものが教材になるのは面白いですよね。見やすいパッチを作ろう、という気にも少しだけなります。
おわりに
以上のような感じで、布教活動まがいの取り組みをしています。実際に利用者が増えているかは微妙なところですが…
最後に、よくある受け売り話でもひとつ。
研究活動においても、プロトタイピングは非常に重要な作業です。
面白くて、斬新なアイディアは、頭の中ではたくさん浮かぶものですが、実際に作って動かしてみると全然印象が違うものです。（「外在化」などと呼んだりもしますね）
また、現代人はみんな多忙ですから、もやもやっとしたアイディアを伝えても聴き入ってくれません。それよりも、動いているところを見せ、実際に体験してもらう、といったアピールが何倍も効率的です。
ゲームのチュートリアルなどで、実際に操作をしながら説明を行っていく、という仕組みになっているものがありますが、イメージはそれに近いのかもしれません。（余談ですが、こういったチュートリアルデザインも、しっかりとした研究分野として確立しています）
この「動かせるもの」を作り上げるためには、プログラミングを避けて通れないと思うわけですが、その点、vvvvの生産性はダントツだと思っています。活用しない手はないです。
なにか面白いことを思いついたら、とりあえずvvvvを起動する。そして、[Renderer]とか[Group]あたりのノードを作りながらぼんやりと考える、そんなペースで過ごしています。
これが染みついてくると、ある種のノリ突っ込み的な感じでプロトタイピングができるようになってきます。「○○があったら面白よね～」と言われたら、「そうですね～、××もあったら良いですね～」などと返しながら、適当に実装してしまえば良いのです。数十分もあれば、なんちゃってデモが見せられるようになり、「できました！」と偉ぶることができます。あら素敵。
そんなこんなで、この機会にvvvvはいかがでしょうか？
僕の中ではすっかりメインの環境になっていますが、スケッチ感覚でいじる的な位置付けでも十分活躍すると思います。
という雑な宣伝で締めたいと思います。