映画から想像するVR・AR時代のGUIデザイン

ここ最近(というか数週間)、Build 2015でのMicrosoftの発表の攻めっぷりがすごかったよね。「Visual Studio Code」でクロスプラットフォーム対応したり、顔画像の年齢推定エンジンを「How Old Do I look?」で無料で試せるようにしたり。
その中でもちょっと未来的な「HoloLens」というHMDが個人的にワクワクした。
https://wired.jp/2015/05/08/new-hololens-features/



UnityがこのHoloLensに対応するそうですよ。
この手のジャンルはVRとかARとか言われたりとまちまちだけど、まあ両方の要素を含むんだろうね。

このデバイスを装着したユーザーから見ると、現実空間上で仮想オブジェクトを操作できるような感覚になる。まあ、それでもまだ触覚が無く、あくまで視覚情報の拡張なので、ユーザーインターフェイス全般というより、グラフィカルユーザーインターフェイスの領域の話だ。



この手のデバイスが当たり前のようになると、当然GUIのデザインパラダイムもそれに合わせたものへ進化していくこととなる。新しい技術が普及すれば、旧来のインターフェイスのデザイン思想が立ち行かなくなるはずだ。

映画アイアンマンのGUI

新たなUIデザイン思想を考えるヒントは映像作品の中にあるとオイラは思っている。アメコミヒーローを実写化した2008年の映画「アイアンマン」は、その後の映画の中の3D GUI表現にもかなり影響を与えたんじゃ無いかと思う。

アイアンマン [Blu-ray]

この映画では、天才発明家の主人公トニー・スタークの発明したハイテクスーツの性能や、人工知能のアシスタント「ジャーヴィス」とのやりとりを視覚的に表現するために様々なGUIがデザインされている。

メイキング映像を見ると、アイアンマンのヘルメット内のHead-Up DisplayのUIデザインチームが編成されていたようだ。確か「トニー・スタークなら、iPhoneのような洗練されたデザインのUIを好むはず」と言っていた気がする。(うろ覚え)
時代の先端を行く、洗練されたイメージの例にiPhoneが出てくることは多い。こうしたデザインパラダイムの流行にiPhoneが与えた影響は非常に大きい。iPhone登場は2007年だったな。

アイアンマンスーツを装着したトニー・スタークの主観映像には、現実空間上に様々な情報が追加投影されている。そう、HoloLensを通して見たような仮想オブジェクトを重曹表示した光景だ。ジャーヴィスとの、白を主色とした3Dの文字・線画が空中に投影される。



さらに2010年の続編「 アイアンマン2」では、トニー・スタークが空中に投影される3Dのオブジェクトをタッチ、ピンチ、スワイプといった操作で整理し、父親の残した模型から洞察を得る過程が描かれている。この辺はiPhoneの影響なのか、観客としてもそのUI操作に疑問を抱かずにすんなり受け入れられる。



アイアンマン2 [Blu-ray]

その後、アイアンマンに限らず、この手のヒーロー物やSF映画作品に登場するGUIのデザイントレンドとして、明度の高い輪郭線と半透明な濃度を持った3Dオブジェクトが空間上に投影される描画が当たり前のように用いられている気がする↓
http://akiras.seesaa.net/article/366945676.html

この手のフィクションに登場するUIはFUIと呼ばれたりもする。
フィクションに登場するUIデザインのまとめサイト
映画などに登場するやや未来的な情報ビジュアリゼーションやユーザーインターフェイスは大好物です。この手のフィクションインターフェイスが登場するに作品情報のまとめサイトがあるらしい↓Kit FUIFUIとは?Fantasy User Inter...

現在の3D GUI開発環境

今時の3D開発環境に目を向けると、Unityがバージョンアップと共に、uGUIといった2DのGUI開発ツールの拡充をはかっているのが興味深い。現状、たとえ3D開発ツールといえども、開発者達にとって2DのGUI開発の需要が高いのだろう。作る側のデザインパラダイムはそうそう変わらない。もちろん、使う側もなかなか変われない。

UnityゲームUI実践ガイド 開発者が知っておきたいGUI構築の新スタンダード

他分野の知見の応用

個人的には、GUIが3Dになっていくことで、もっと現実空間のデザインの知見が活きてくるのではないかと思っている。建築やインテリアなどの空間デザインの知見だ。3次元空間での光や色による演出は、建築の分野では古くから行われてきたはずだ。そっちの分野の知識が乏しいので、建築物がどういうプロセスで、どういう分担で完成に至るのかはわからないけど、様々なデザイン思想が培われていると想像する。

映画は総合芸術

最近たまたまNHKで「ハリウッド白熱教室」が再放送されていて、映画のビジュアルデザインについての講義をやってる第2回を見たんだけど、映像でも光・色による演出の理論体系があるようだ。(南カリフォルニア大学には映画を専門に教える学科がある)

この講義では、セット・照明・衣装も含む映画中の色彩デザインが、どのような効果を上げているかを理論的に紐解いていた。特に色のコントラストが観客に与える意味の重要性についての話が印象的だった。映画とは、様々な分野の理論体系や手段を駆使した娯楽なのだと、改めて実感する。映画においては、情報はより直観的、感覚に訴える方法であることが求められる。観客にとって無意識であっても、様々な意図・手段が隠されている。

そして、気づけば映画は座席が揺れる4D上映など、画に限らず、様々な五感に訴えるマルチモーダルなメディアとなりつつある。次世代のUIを考えるうえで、これほど示唆に富んだコンテンツも珍しいなぁ、と思うわけです。未来の情報デザインのヒントは映画にある気がする。

関連記事

タダでRenderManを体験する方法

ゴジラの全てがわかる博覧会『G博』

MeshroomでPhotogrammetry

2016年の振り返り

MeshLab:3Dオブジェクトの確認・変換に便利なフリーウェア

ZBrushでアヴァン・ガメラを作ってみる 甲羅の修正・脚の作り込み

2017年9月 振り返り

Blenderでよく使うaddon

CreativeCOW.net

偏愛マップ

『シン・ゴジラ』のコンセプトアニメーションのメイキング動画が公開された

トランスフォーマーロストエイジのメイキング

映画『シン・仮面ライダー』のデザインとキャストが発表されたぞ!

映像ビジネスの未来

iPhone 3GSがますます欲しくなる動画

スター・ウォーズ フォースの覚醒 BB-8の誕生秘話

DensePose:画像中の人物表面のUV座標を推定する

4K HDR『ガメラ3 邪神覚醒』

PS4用ソフト『スター・ウォーズ バトルフロント』を購入

ゴジラのサウンドトラック

Photoshopで作る怪獣特撮チュートリアル

劇場版 『仮面ライダードライブ サプライズ・フューチャー』を観た

ホビージャパンのムック『怪獣大進撃』が復活

Python for Unity:UnityEditorでPythonを使えるパッケージ

シン・ゴジラのDVD&Blu-ray発売

映画『ゴジラvsコング』を観てきた! (一応ネタバレ無し)

2023年8月 振り返り

アニメーション映画『GODZILLA 決戦機動増殖都市』の予告編が公開された!

2020年12月 振り返り

ゴジラ トレーディングバトル

viser:Pythonで使える3D可視化ライブラリ

裾野を広げる「○○カフェ」という存在

ZBrushでゴジラ2001を作ってみる 身体のSubToolを分割

映画『GODZILLA 決戦機動増殖都市』を観た (ネタバレ無し)

2023年7月 振り返り

TorchStudio:PyTorchのための統合開発環境とエコシステム

黒歴史

ポリ男からMetaHumanを作る

書籍『ゼロから作るDeep Learning』で自分なりに学ぶ

JavaによるCGプログラミング入門サイト (日本語)

PCの自作

言葉が支配する世界

コメント