HoloLensの開発ツールであるMixedRealityToolkitではサンプルとして配置するだけで使用できるボタンやスライダーなど数多くのUIが同梱されています。
開発者はプレファブとして提供されているこれらをシーンに配置し、Eventを指定するだけでUIとして機能します。
ここではBlenderを用いてSF映画や近未来を描いたアニメ作品に登場するようなFUI(Fictional User Interface)を基にHoloLens用のオリジナルデザインのUIボードを作ります。
今回はシリーズ第18回目です。
E.F.S.FUIパネルのまとめ記事です。
作品は次のURLで公開しています。
〇デザイン
今回のE.F.S.FPlaneは『HoloLensのMixedReality空間でのアニメや映画に出てくるようなFUI(Fake UI /Fictional UI)がどのような振る舞いを見せるか』を調べるために『機動戦士ガンダムUC』に登場する地球連邦宇宙軍(Earth Federation Space Force=E.F.S.F)のメカニックUIを参考にDescription(説明用)パネルを製作しました。
第一回では作中の機能を考察しました。
〇Blenderでのモデリング
今回もオブジェクトの作成にはフリーのモデリングツールであるBlenderを使用しました。
今回ののパネルは左右対称であるため[モディファイア]の[ミラー]を用いることで簡単に左右対称のオブジェクトを作成しました。
redhologerbera.hatenablog.com 第3回ではサイドの[コの字型ボタン]はメッシュ一つ一つがそれぞれ独立したボタンとして使用するため[Ctrl]キー+[P]キーでメッシュを分離しました。
第4回ではUnityではオブジェクトごとのマテリアル設定はできるもののメッシュごとのマテリアル設定はできないためBlenderでマテリアル割りをそれぞれ行ってUnityへエクスポートしました。
〇Unityでのマテリアル
第5回ではBlenderからエクスポートしてUnityでマテリアルを作成しました。
Blenderでマテリアルを作成していればUnityでもそのマテリアルが適応されますが、ここでは最初からUnityで使用することを前提に作成していたためUnityでマテリアルを作成しています。
E.F.S.FUIパネルには主に3種類のマテリアルを作成しました。
サイドパネルはシリーズ第一回から作成したボタンで使用したハニカム構造のテクスチャを適応してアクセントとして一部に同じマテリアルの[Albedo]のみを変えて青色にしたマテリアルを使用しています。
[コの字型ボタン]部分はこちらもシリーズ一回目のボタンで使用したノイズのテクスチャを使用しています。
バックパネル部にはSF感を持ちつつコの字型ボタン、サイドパネルのように派手ではなくあくまで背景であることを意識して、メモリが入ったテクスチャをマテリアルとして使用しました。
〇機能の作成
第6回ではUIとして必須なテキストを配置しました。
第7回ではボタンとしての機能を作成しました。
MixedRealityToolkitの[Interactable.cs]を使用しています。
[ Interactable.cs]の[General]の[SectionMode]を[Toggle]にすることでラジオボタンとしての機能を作成しました。
[Profile]の[Theme]で選択状態、非選択状態のアクションを作成しました。
非選択状態ではコの字型ボタンは緑、テキストはグレーですが、選択状態ではコの字型ボタンは赤、テキストは少しスケールが大きくなりはっきりとした白と変化するようにしました。
以上でE.F.S.FUIパネルの完成です。
作品は次のGitHubで公開しています。MITライセンスなのでぜひ使ってみてください。