体験型展示コンテンツを構想するときのヒント

手法メモ2020.12.21

Log. / 体験型展示コンテンツを構想するときのヒント / Ponboks Note

こんにちは、体験型展示クリエイターの本多といいます。
フリーランスとして受託開発をしたり、オリジナルの体験型作品の展示活動をしたりしています。

今回は、普段僕が体験型コンテンツをつくるときの手法やツール、作品案を考えるときの発想法を、
Twitter(@ponboks)に投稿している実験作品とともに紹介します。

体験型インスタレーションやメディアアートの制作に興味ある方は、ぜひヒントにしてみてください!

紹介する実例は、すべてソフトウェアにUnity(3D/2Dデジタルコンテンツ開発ツール)を利用しており、この記事は、Unity #3 Advent Calendar 2020 21日目の記事となっています。

もくじ

考えるときのベースとなる組み合わせ発想法

どんなアイデアも組み合わせ、という話はよく聞きますが、体験型コンテンツを技術から考える場合も特に当てはまると思います。

体験型コンテンツは、絵画や彫刻などの観賞型の作品に対して、「参加型」や「インタラクティブ」なんて呼ばれることも多く(※この記事では、その中でもデジタル技術をつかった体験型コンテンツ制作について取り上げます。)そのほとんどはインプット(体験者の動作)とアウトプット(作品の演出)から成り立っています。
例えば、体を動かすと(インプット)、動かしたとおりに映像上でキャラクターが動く(アウトプット)という体験型コンテンツがありますよね。

体験型展示のインプットとアウトプット

インプットとアウトプットの手法やツールをより多く知っておく、身につけておくことで、組み合わせ次第で無数のインタラクション案を出せるようになります(今回は内緒ですが、僕もたくさんインプット/アウトプットの手法を頭の中にリスト化しています。)

もちろんこの方法がすべてではないですが、ベースとしてこの発想法に慣れておくと、テーマやモチーフを起点に考える時にもアイデアが出やすくなります。

そんなインプット/アウトプットの考え方を踏まえて、事例をもとにアイデアや仕組みを分解して紹介していきます!

1. 印を結ぶ操作で、扇風機を回転させる(加圧センサー、DMX)

印を結んで風遁の術

印を結んで風遁の術

忍者の方が忍術を使うときに行う結ぶ印の動作で、風遁の術に見立てて扇風機を動かしたりプロジェクションで風遁エフェクトを投影した実験作品です。

写真:加圧センサー

写真:加圧センサー

写真:扇風機とDMX調光器

写真:加圧センサーとArduino

5つの加圧センサーを指で抑えるポイントに貼り付け、どのセンサーが反応したかでどの印になっているかを検知しています。加圧センサーからの値はArduinoを通してPCにインプットしています。

扇風機はDMX(舞台照明などに使われる通信手段)をDMXコントローラーとDMX制御の調光器で使って操作。風遁の演出映像と効果音はプロジェクターから出しています。

仕組みの図

インプットとアウトプットを手法とともに分解した図です。この作品は、印を結ぶ動作を加圧センサーで検知(インプット)することを先に思いつき、忍術らしい演出(アウトプット)を手持ちの機材から考えました。インプット/アウトプットに分解して考えられると、アイデアの幅が広がったり、実現できる範囲での最適解を見つけやすくなります。

加圧センサー 参考リンク

DMX機器 参考リンク

2. 指の動きをインプットにする(LeapMotion)

LeapMotionというハンドトラッキングできるセンサーをよく利用しています。指1本1本や手の動きを取得できるので、グーチョキパーの動きや手の位置をプログラミングによって検知できます。

LeapMotion

グー、パーで手袋の顔が変化する

グー、パーで表情の変わる手袋さん

グー、パーで表情の変わる手袋さん

グー、パーで表情の変わる手袋さん

グー、パーの動きを検知して、手袋にプロジェクション投影した表情をアニメーションで変化させる実験作品です。手の位置もLeapMotionで検知しているので、手を動かしても位置を追いかけて表情が投影されます。LeapMotionをインプットにして、映像演出をアウトプットにした例です。

指5本の動きでライトを操作

LeapMotion + ムービングライト

LeapMotion + ムービングライト

LeapMotion + ムービングライト

LeapMotionで指5本の動きをトラッキングし、舞台照明などで用いられるムービングライトを制御した実験作品です。5つのムービングライトがそれぞれの指に対応しており、指を曲げると同じように動きます。ムービングライトは前述したDMX(舞台照明などに使われる通信手段)で制御できます。LeapMotionをインプットにして、ムービングライトをアウトプットにした例です。

インプットに使う機材が同じでも、検知の仕方やアウトプット次第で、色々な体験型コンテンツを考えることができます!

参考リンク

3. ポーズ検知をインプットにする(Kinect)

人物の体の骨格をトラッキングしてポーズ検知ができるKinectをインプットにして、様々な演出をアウトプットした作例を紹介します。

Kinect

ポーズ検知(パタパタ動く)→ 空撮映像を制御

羽ばたく動き+空撮映像

羽ばたく動き+空撮映像

羽ばたく動き+空撮映像

パタパタ羽ばたく動きをすると、空撮映像がのスピードが変化し、鳥のように空を飛んでいるような体験ができる作品例です。Kinectで検知した両手の位置から、羽ばたきのスピードを算出し、UnityでPNGシーケンス(連番画像)にして実装した映像のFPSを制御することで実現しています。

ポーズ検知(にょきにょき動く)→ ニョキニョキ伸びる

ポーズ検知(Kinect)でニョキニョキ

ポーズ検知(Kinect)でニョキニョキ

ポーズ検知(Kinect)でニョキニョキ

にょきにょきと体を動かすことで、とんがった造作がニョキニョキと伸びる作品例です。Kinectで体の動きを検知して、ニョキニョキの造作をモーターで巻き取ったテグスで引っ張り上げることで実現しています。

ポーズ検知(首を傾ける)→ ムービングライトを動かす

一緒に首を傾げてくれるとんがりライト

一緒に首を傾げてくれるとんがりライト

一緒に首を傾げてくれるとんがりライト

Kinectで首を左右に傾けたことを検知し、5つムービングライトを同じように動かした作品例です。
ムービングライトには、レーザーカッターで切り出したMDFパーツと障子紙で作ったとんがり頭を取り付けています(ちなみに僕はTschoolさんという立川にあるファブスペースでレーザーカッターやUVプリンターを利用させていただいています。)

写真:ムービングライトに造作物を取り付ける

写真:レーザーカッターで木製パーツを作成

写真:ムービングライトに造作物を取り付ける

写真:ずらっと並ぶとんがりライト

この作品は、ムービングライトを「方向を変えられる照明」としてではなく、造作を加えることで「光って動く生き物」にしたところもポイントかなと思っています。機材や手法をそのまま使うのではなく、別の形で使う方法はないか模索するのも、ユニークな体験型コンテンツをつくるコツです。

Kinectはポーズ検知以外にも赤外線カメラ映像や深度カメラの映像もインプットにできるので、体験型作品の可能性はまだまだ広いです!

また、僕がいまだに使っているKinect for Windows(V2)は製造中止になってしまったので、新しく購入する方はAzure Kinectになるかと思います。

参考リンク

4. 画面やムービングライトの光で移動するりんご

デジタルを旅するりんご

デジタルを旅するりんご

デジタルを旅するりんご

デジタルを旅するりんご

デジタルを旅するりんご

色々なデジタルメディアをりんごが移動していく実験作品です。

① 深度センサー(RealSense D415)で落下検知
② テレビ画面でりんごをアニメーションに変換
③ ムービングライトで赤い光を動かす
④ プロジェクター映像のアニメーションで赤い光をリンゴに変換
⑤ ノートPC画面でアニメーション
⑥ タイミング合わせて手で持つ

といった流れになっています。深度センサーにRealSense D415を使うのは少し大げさですが、手元にあってすぐ使えたので採用しました。この場合は電子部品系の距離センサーで十分かなと思います。

デジタルを旅するりんご 仕組みの図

複雑なシステム構成なので図解してみました。PC1台で行うこともできるのですが、友人と2人で制作したので2台に分けることにしました。同じネットワークに接続しているため、PC間はUDPという比較的シンプルなデータ通信方式でやり取りができています。

たくさんの機材や手法を扱うことに慣れてくるとこの作例のように複雑な構成もできるようになってくるのですが、考え方のベースは同じです。①がインプットで②〜⑥がアウトプットという考え方です。

参考リンク

5. マイクを使った音量検知をインプットにする

バスケのドリブルにプロジェクター投影でエフェクト演出

バスケのドリブルにプロジェクター投影でエフェクト演出

バウンドする際の音をマイクで検知して、プロジェクターで衝撃がはじけるような演出を床面に投影しています。この作品例では行っていないのですが、ハイパス/ローパス等のフィルタを音に加えれば、バウンドの低音にチューニングした検知もできます。

マイクでの検知は、比較的簡単に導入できるのと、使い方次第でインタラクションの幅を広げられるのでおすすめです!

また、ここではバウンド位置は検知していないのですが、測域センサーを用いればバウンドの位置も検知できそうです。この手のセンシングには北陽電機さんの測域センサーがよく用いられています。

参考リンク

6. 卓上ライトから飛び出す光(Philips Hue)

Philips Hue + 加圧センサー + ディスプレイ

Philips Hue + 加圧センサー + ディスプレイ

卓上ライトを叩くと、画面の中に光が入っていくような様子を楽しめる実験作品です。加圧センサーで入力を検知して、Philips Hueと画面上のアニメーションをコントロールすることで演出しています。

Philips Hue

Philips Hueは、光の色や強さを制御できる電球で、Unityからもコントロールできます。加圧センサーは前述と同様Arduinoを通してPCにインプットしています。

参考リンク

7. クッションを押すと光の粒が飛び出す

光粒が飛び出したり戻ってきたりするクッション

光粒が飛び出したり戻ってきたりするクッション

光粒が飛び出したり戻ってきたりするクッション

クッションのおへそマークを押すと光の粒が飛び出し、離すと戻ってくる実験作品です。クッションを移動しても光粒がその場所に戻ってくるようになっています。

光粒が飛び出すクッション 機材や手法の図解

おへそマークには再帰性反射という入射した光が入射方向に反射する特殊なテープを使用。赤外線カメラ(Kinectを使用)で見ると、再帰性反射部分が極端に明るく映るので、マークを隠したかどうかや、マークの位置をトラッキングできます(なので、実際には再帰性反射テープ部分を隠すだけで反応するようになっています。)

写真:クッションに貼り付けた再帰性反射テープ

写真:天井に取り付けたKinect

光の粒の映像はプロジェクターで床面に投影しています。広角のプロジェクターなので、天高2.3mでも部屋の床全体を覆うくらいの投影ができます!光の軌跡はTrail RendererというUnityの機能を使って簡易的につくっています。

写真:プロジェクター設置

写真:PC画面の様子

他にも色々試しましたが、物理的なフィードバックがあり、叩く動作が光粒が飛び出すに直感的に結びつきやすい、クッションを使うことにしました。この仕組みはなかなか汎用的なので、使い方次第でもっとたくさんの案を出せそうです。

参考リンク

おわりに

普段あまり技術記事を書かないので、今回はがんばってまとめてみました。

Unityって何がつくれるの?を知りたい人はUnityで色々できることが分かるまとめもご覧ください。Unityはゲーム開発ツールというイメージが強いですが、紹介した実例のように色々なデジタルコンテンツをUnityを通して制作できます。

今回紹介した体験型展示の試作は#不思議のプロトタイプというハッシュタグからも見れます。

また、参考リンクにて紹介させてもらった多くの技術解説ページ、ツール、機材にはいつも本当にお世話になっております。ありがとうございます!!

*この記事にはコメント欄を用意していないので、ご指摘や感想がある場合はTwitterまでご連絡いただけると嬉しいです。

NOTE