連載JWDA通信　10年後のWEB業界でも役立つ情報を届ける
つなぐ、とどける、うごかすクリエイティブ

米田純也（JWDA アワード&イベント担… 2011/6/21(火) 09:00

(31)

(20)

印刷用

コラムサイト企画／制作／デザインインタラクション | インターフェイス | クリエイター | デザイン

マイノリティ・リポートの世界がやってくる

技術の進化にともない、表現の枠も広がっています。クリエイティブを担うクリエイターとして、それらをキャッチアップ、ミックスして新たな可能性を見出すことが必要になっています。今回は、ブラウザの枠を超えたインタラクティブ技術が拡がりをみせるなか、ジェスチャーコントロールの分野に着目し、ハンド・トラッキング機能を用いたメディアアートプロジェクトについてご紹介します。

CASE4. メディアアート
Kinectのハックによるハンド・トラッキング

ポイント

既存メディアの枠組みを乗り越えたインタラクションと芸術的表現の追求。
技術ミックス（技術の枠にもとらわれない。様々な技術を日々追求して追究する）。

それぞれを詳細に解説していきましょう。

手や指の動きに対して操作感を持たせた表現

「マウス・キーボード」の操作から離れ、映画「マイノリティ・リポート」の世界に登場したインターフェイスのように、手や指の動きに対して操作感を持たせた表現をつくりあげることを「動き」の部分ゴールとし、インターフェイスデザインは、エントランスの雰囲気に合うよう、モノクロ・墨の表現を軸におこしていきました。

インターフェイスデザインの参考動画
動体検知の採用

人の動きに合わせたインタラクションを付与するために、Webカメラなどに映る動くものをプログラムで検知する技術、「動体検知」を採用しました。具体的には、指などの細かな部分に対してインタラクションを付与するために、インタラクティブデザインやメディアアート制作のフレームワーク「openFrameworks」で紹介されているものも参考に構築していきました。

動体検知を実現するための基底となる技術として、「OpenCV」というIntel社で開発された画像解析用のC言語ライブラリが採用されています。今回は社内では初の試みとなるので、比較的さくっと制作できるように、ある程度技術情報やリソースが存在する言語（C++）やフレームワーク（openFrameworks）を選定しました。

動体検知を利用すれば、ヒゲもじゃでもファンシーな魔法使いに変身。
http://www.openframeworks.cc/gallery/secret-powers
表現部分はAIR2.0（Flash）に、動体検知部分はopenFrameworksで処理を分岐

開発の前段階の技術検証の段階で、墨の表現をopenFrameworksで再現したものが予想以上に実行速度が低下してしまったためopenFrameworksで実装することをやめ、表現部分はAIR2.0（Flash）に、動体検知部分をopenFrameworksに、と処理を分けることにしました（openFrameworks側で検知した指や拳の座標データをAIRに送り、受け取った座標データを基にインタラクションを加えるようにして連携を取るようにしています）。

こうすることのメリットとして、フレームレートを比較的高く保つことが可能になったことがあります。ですが弊害として、1つのWebカメラを2つのアプリケーションから使うことになるため、それを可能にする仲介的なアプリケーションが必要になり工数が増えてしまいました。

連携部分に関しては、ブログ「blog.alumican.net」の記事を参考にさせていただきました。
完成へ

開発当時は、上述のように技術的な制約があり段階をいくつも経ていないと目指した表現はできなかったのですが、Microsoft社がXbox 360用に開発した、Kinectが発売されてからはこういったインターフェイスの実装がより簡潔にできつつあります。

Kinectは、通常のカメラの他に赤外線センサーを持ったXbox 360用のゲームデバイスとして開発されたものです。赤外線センサーを使うことで、カメラから対象までの距離を測ることができ、その距離の差から対象の輪郭を正確に割り出すことが可能になっています。距離と合わせて処理することで様々なインタラクションを付与することができます。

もとはゲーム機用デバイスのKinectですが、オープンソースのドライバが公開されたことで、世界中のクリエイターが様々なクリエイティブを発表しています。たとえば、Kinectを使ったブラウザインターフェイスや、マイノリティ・レポートに登場するようなインターフェイスへのチャレンジを紹介した動画もありますので、興味のある方はご覧になってみてください。

まとめ：「既存のもの」を超える試みに挑戦しよう！

これまで紹介してきた、PCや既存のメディアを飛び越えたり融合させたりしたインタラクティブな表現というのは、今後どんどん増えていくと思われます。こういった、企業内で先進的な技術やデザインを時代に先んじて研究していくことは企業のブランドを高めていくためにも有効ですし、何より創っていく工程が楽しいのでおすすめです！　現在は次のような作品にも取り組んでいます。