本ブログの前身である「QTVR Diary」は、世界でも類を見ないパノラマ関連情報専門ブログとして、リソースの少ない日本だけでなく海外からも注目を浴び、国内外のメーカーからの情報やソリューションサンプルの提供を受け、パノラマ業界の専門情報をどこよりも早くお届けしていました。

今後ますます増え続けるパノラマのニーズに対応すべく、多くの方々にパノラマを楽しんで頂けるよう、様々な情報を今まで以上に発信してまいります。本ブログも引き続き、ご期待ください!


今話題のジェスチャーコントローラー「Leap Motion」についてのパノラマVRに関する考察

皆さん、今、ガジェットマニアの間で話題騒然の「Leap Motion」ってご存知ですか?


Leap Motion
http://www.leapmotion.com/

価格:10,500円(日本への送料を含む)

購入はオフィシャルサイトから。
BUY - Leap Motion
https://store.leapmotion.com/

世界最高水準の数学理論に基づいた(※参照)、1/100mmの動きまでをも認識できる、脅威の超近接ジェスチャーコントローラー入力デバイスです。
2012年5月21日に予約受付が開始されるや否や世界中から注文が殺到したのですが、それからずっと音沙汰もなく、2013年に入っていきなり幾つかのプロモーションビデオがYouTubeにアップされてから、そのポテンシャルにド肝を抜かれました。

このデバイスの対抗馬は、間違いなく、マイクロソフトの「Kinect」です。

Kinect for Windows | Voice, Movement & Gesture Recognition Technology
http://www.microsoft.com/en-us/kinectforwindows/

Xbox360のオプションコントローラーとして、身体の動きを認識してゲームを制御するデバイスとして登場しましたが、2011年6月にWindows版がリリースされ、2013年初頭には何と商用ライセンスが可能なバージョンも発売され、様々な業界での利用に期待感が高まりました。

そんなタイミングの中にあって、当初のLeapMotionは5月21日に発売とされていたのが、技術的問題により遅れ、7月22日の一般発売となり、最近では様々なメディアで紹介され、また多くの開発者やアーティストによってデモ映像が公開されています。

触れずに操作:「Leap Motion Controller」の可能性を考えた (1/3) - ITmedia PC USER
手のジェスチャーでPC操作「Leap Motion Controller」レビュー - CNET Japan
空中ジェスチャー操作で未来を先取り Leap Motion Controllerを試してみた
空中ジェスチャーで操作するLeap Motionがすごい![AppBank Store 新宿] - たのしいiPhone! AppBank
PCに手をかざすだけで操作できる「Leap Motion Controller」 - WSJ.com

Leap Motionで操作できるPhoneGap(Cordova)アプリ : アシアルブログ
ソフトとハードの交差点:Leap Motionのサンプルプログラムを色々描いた。 - livedoor Blog(ブログ)
Leap Motionでのタッチ操作はどう開発するのか? - Build Insider
LEAP Motion の実装を解説 & おっぱいプリン作ったった ( ゚∀゚)o彡゜ | 芸人プログラマのネタ帳
Mobile and Design BLOG: LEAP MOTION + openFrameworksでアプリケーション開発
念力スカートめくり機/Leap Motion + node.js + Arduinoでサーボモーター駆動 - ばかおもちゃ製作所



さて、ボクらパノラマ屋にとって、LeapMotionと付き合う時に、一番手っ取り早く手に入れられるソリューションは、何と「Google Earth」でした。LeapMotionが当初リリースされるといわれた2013年5月に合わせて、GoogleEarthがバージョンアップされていて、最初からLeapMotionの動作をサポートしています。従って、LeapMotionが手元に来て基本ソフトウェアをインストールしたら、すぐにLeapMotionの素晴らしいナビゲーションを体験できるのです。

これ、オフィシャルのデモPV。一見して誰もがみんな「こんな簡単に出来るんなら、やってみようかな!」と思わせる映像ですけど、正直、こんなサクサク動いてくれません。何せ、LeapMotionってとっても敏感なんです。その過敏な反応が、最初に動かしたときの戸惑いを生みます。

そこで、GoogleEarthの環境設定を触ってみましょう。
「環境設定」画面から「ナビゲーション」タブを開いて下さい。

その上のスライダー2つ「ジャンプ速度」と「マウスホイール速度」の両方を左端まで持っていって、一番遅くして下さい。

こうすることで、ちょっと手を動かしたらギュワンギュワン動くナビゲーションが、かなり遅くなってくれて、扱いやすくなる筈です。これ以上は遅くならないので、このスピードで頑張ってみましょう。

また指をまっすぐにするんじゃなくて、手を丸める感じの方が、ナチュラルな動きになると思います。特に急降下は手首を向こう側にクルっと返す感じで動かすので、この丸めた手の通りの動作になりますし、これが基本ポジションだと思って下さい。

あと左右の旋回は手首を左右に返すと出来るんですが、右手でやってる場合、左回り(時計と逆回り)はスムーズに動いても、右回り(時計回り)は関節が邪魔して上手く回りません。なので、肘を内側に寄せる感じで回す感じになります。ココは慣れが必要です。

ズームイン/ズームアウトは、LeapMotionと手を近づけたり離したりすることで実現できます。

止める場合は、手を握ってグーのまま!それで止まります。
但しそこから手を開くや否や、非ぬ方向に飛んでいってしまうので、注意が必要です。これを解消する方法は...ボク自身もまだ見つけていません。誰か、教えて下さい。

とまぁ、GoogleEarthのフライスルーが上手に出来れば、LeapMotionによる"空間ジェスチャー"の感覚は、なんとなく把握出来るんじゃないかなと思います。ぜひチャレンジしてみて下さい。


さて、GoogleEarthが来たら、「ストリートビュー」も外せませんね。ストリートビューは元々が疑似的な実写ウォークスルーデータを持っているようなものなので、GoogleEarthのようなフライスルーも実現可能だと言われてきました。それを実現するには、ある程度の開発力(「Google Maps JavaScript API v3」の理解能力と実装技術)が必要ですが、それを早速構築した人が居ます。

恐らく専用ソフトウェアを開発したのだと思いますが、非常にスムーズに動かしていますよね。

これに触発されてWeb上で構築した日本人開発者が出てきました。この方は何と、開発者向けのコードコミュニティ「jsdo.it」でHTML/JavaScript/cssの各ソースコードを公開してくれています。参考に勉強してみては如何でしょうか?


Leap MotionでGoogle Street Viewを操作する - oimouはてな
http://oimou.hatenablog.com/entry/2013/08/03/043045


とは言え、三次元空間ジェスチャーは、本当に難しいです。

まず、腕が疲れます。ハイ、そんなもんです。

だって、ずっと手を空間に浮かせたままなんですよ。肘とか付けられたらイイんですけどね。そんなポジション取れますかね〜?座っていれば肘も付けられますが、それでもいつのまにか肘も浮かせてるんですよ。そうしたら、もう、腕自体がダルくてダルくて...。

そう考えると、マウスって便利ですよね。肘も手の付け根も付けられるので、基本的には疲れない入力デバイスです。手を離せばポインターはその位置を離れることはありません。ピクセル単位の指定がフリーハンドで出来る、非常に優れた入力デバイスでもあります。

そうそう、LeapMotionは、ポインターの固定が出来ません。三次元認識をしますから、人間の関節の回転運動をモロに読み取るので、指をまっすぐ押し込んでいるように見えて、実はかなり下にズレていたりします。さらに言えば、1/100mmなんて超絶に細かい精度で先端を読み取っているので、脈拍ですら読み取っているかのようです。カーソルは常にブレていると考えなければなりません。
なので「クリック/タップ」の感覚は、かなりアバウトにしか認識してくれないと考えた方が良いでしょう。

一方で、左右上下のフリックを認識することで移動させることが出来たり、ズームイン/アウトなどの二極情報をLeapMotionと手との遠さ/近さで表現する、人間の"動作"そのものを認識してナビゲーションする機能は充実しています。さらには、合計20本の先端認識機能が備わっていますので、指1本のフリックと2本のフリック、3本、4本と、機能を足すことも出来ます。

...とまぁ、LeapMotionの表現に対する機能は無限大です。素晴らしいです。感動を覚えたりします。触って(?!)いてワクワクします。


でも、考えてみましょう。パノラマVRコンテンツで、一番大切な機能って、何だと思いますか?

そう、やっぱり「タップ」なんです。「クリック」なんです。現時点では、これを基準に考えられていると言っても、過言ではありません。

シンプルなパノラマVRコンテンツは、フリックとズームイン/アウトだけで済むでしょう。これならばLeapMotion独特のアクションを使ってナビゲーションすることも出来ますし、楽しいとも思います。
けれど、パノラマVRムービーやモーションVRムービーや、ギガピクセルパノラマを幾つも使ってヴァーチャルツアー的なコンテンツを作ったとしましょう。それらを"選択"するには、一体どうすれば良いですか?

サムネールリストを呼び出すのも良いでしょう。サムネールスタックやマップナビゲーションを呼び出すのも良いでしょう。しかし、そこに設置されているサムネールやホットスポットをタップしないと、今見ているパノラマから次のコンテンツを呼び出すことは不可能です。そう、結局は"選択する"という行為のための「タップ」機能は、間違いなく未だに必要なんです。

そこでボクは、現状のパノラマオーサリングソリューションで出来る、とても簡単な、LeapMotionでナビゲーションしやすいユーザーインターフェイスを考えてみました。

それがこちらです。今月初頭に、京都リサーチパークであった展示会にボクらが出展したブースでの映像です。

(所々穴抜けになっていますが、これはオンラインで公開できない受託案件データが入っていたためです。弊社までお越し頂ければ、ご覧頂けます。)

デスクに置いたiMacは目線より下げ、LeapMotionもそれに合わせて腰ぐらいの高さに配置することで、肘も手もそんなに浮かせないで制御できるので、すこしぐらいの時間ならゆっくり閲覧してもらうことが可能です。人が疲れずに閲覧できる環境を作るのは、非常に重要なのではないかなと思いました。これこそが、LeapMotionを商用で利用する際の一番のポイントかなと思います。

実際のパノラマは、ウチのサーバに上げてあります。
ウチの商用プロモーションコンテンツにもなっているので、良かったらご覧下さい。


PanoramaVR / MotionVR sample | 2013/08/02 | design studio "PENCIL"
http://pencil-jp.net/sample/201308/

このパノラマVRコンテンツは、LeapMotionソフトウェアから起動することが出来る「AirSpace Store」という専用アプリストアから無料でダウンロードできるマウスポインタードライバー「Touchless for Mac / for Windows」に最適化されています。基本的にはマウスと同じ挙動をさせるためのドライバーなので、クリックまでもサポートしてますが、かなりムリヤリ感があるのは否めません。そこを攻略するのかがポイントでした。

パノラマを見ると、大きく目に付くのは、左右上下端に配された巨大な矢印ボタンと、左右上2角のズームイン/アウトボタン。それに、左下角にあるロゴ。これで本コンテンツのナビゲーションは全て。そう、今回イチバン時間をかけて考案したのが、このボタンです。

「LeapMotionは、どんなジェスチャーでも認識できる」ことが、使いにくさを増長させているのだとすると、逆に、極力まで使い方を限定し、最初に最低限のことだけを覚えてもらって、コンテンツに集中しやすくすることに注力しました。

それで出した答えが「人差し指一本ナビゲーション」です。Appleの元祖1ボタンマウスが生まれたきっかけと全く同じことを、このLeapMotionでも導入してみようと考たのです。
(正直、1ボタンマウスの一件は後付けですけどね。図らずもAppleと同じアプローチになるとは思いませんでした。)

翻って、改めてパノラマVRコンテンツの操作を考えると、普段使っている動作は以下の通りとなります。

  • パン/チルト:スワイプ/ドラッグ
  • ズームイン/アウト:ピンチ/スクロールホイール
  • ホットスポット:タップ/クリック

いずれもTouchlessで実現できますが、ドラッグもスクロールホイールも、かなりトレーニングが必要なジェスチャーでした。
これに代わるジェスチャーを考案しようとしたら、専用ソフトウェアや専用ドライバーを開発することになることが分かりましたが、さすがにそれを開発する時間はありませんでした(ウチのLeapMotionが使えるようになったのが7月23日で、展示会は8月2日でしたし)。
基本的には全てナビゲーションUIとしての"ボタン"を専用に構築した方が、開発も早いし、直感的に覚えられるのではないかと思いました。すると、全てはタップ(長タップ含む)のみの動作ですので、オーサリングも基本的には難しくありません。

それでも上記で述べた通り、人が普通にタップ動作しようとすると、手首の関節を支点に回転運動してしまうので、ポインターはタップ認識してくれません。そこで登場するのが「押し込む」という新しいキーワードにです。
タップするという行為そのものも「LeapMotionの真上に透明のフィルムが張ってあって、そこを"押し込む"ように」するという概念の切り替え説明をすると、きちんと理解してくれました。操作習得も数分で出来るので、あとはコンテンツに集中して閲覧してもらうだけです。

さらに、パン/チルトとズームイン/アウトは、ボタンUIを実装しておいて、そこにカーソルが乗りさえすれば、その通りに動くようにしています。これでタップが出来なくて泣きそうになってる人でも、パノラマの操作だけでも楽しんでもらえたりは出来ます。これぐらいシンプルな方が良いと思いませんか?

オーサリングはkrpanoで作っています。
本コンテンツは自前のiMacでプレゼンテーションを行ったので、16:9画角の27インチモニタに合わせてアイコンサイズなどを決めていますが、UI部はHTML側のJavaScriptでウインドーサイズを検知し、krpanoのXMLに反映させて大きさをスケーラブルに変えてありますので、PC+LeapMotionだけでなく、タッチパネルデバイスでも違和感なく操作することも可能にしています。

このスケーラブルUIのスクリプト部分は、ボクのアシスタントの東 正洋による開発です。
基本UIはボクが設計・制作・構築してますが、開発部分は全て彼の手に依るものです。ウチの仕事は彼の貢献が本当に光っています!


とりあえず、三次元空間ジェスチャーコントローラー「Leap Motion」を使って、"最低限"のパノラマVRコンテンツの制御が出来たかと思います。LeapMotionをバリバリ使ってるっ!って感じはさすがにしないですが、逆に覚えやすいルールによってスムーズにコンテンツに集中できることは大切なポイントだと思います。

まずはこれを叩き台にして、多くの方々が、ジェスチャーコントローラーを使ったパノラマVRコンテンツの扱いについて考えを巡らせてもらえれば幸いです。



記事内検索
月別記事リスト
RSS
株式会社パノラマニア
〒602−8233
京都市上京区葭屋町通中立売上ル福大明神町128番地
京都リサーチパーク町家スタジオ
電話: 075-417-3062
FAX: 075-417-3063
JR京都線「京都」駅から市バス50系統・9系統「堀川中立売」バス停下車。徒歩1分。
阪急京都線「烏丸」駅から市バス12系統「堀川中立売」バス停下車。徒歩1分。
京阪本線「出町柳」駅から市バス201系統・203系統「堀川今出川」下車。徒歩10分。
京都市営地下鉄「今出川」駅下車、徒歩20分。