3D アプリ起動ツールの設計ガイダンス

Windows Mixed Reality イマーシブ (VR) ヘッドセットを装着すると、Windows Mixed Reality ホームの中に入ることができます。 この住宅は山々や海に囲まれた崖の上に建てられた家として視覚化されていますが、他の環境を選んだり、独自に作成したりすることもできます。 この家の空間内では、3D オブジェクトや必要なアプリをユーザーが思いどおりに配置し、整理することができます。 3D アプリ起動ツールは、ユーザーの複合現実の住宅内に置かれた、アプリを起動するときに選択できる "物理" オブジェクトです。

"Floaty Bird 3D アプリ起動ツールの例 (架空のアプリ)"

3D アプリ起動ツールの作成プロセス

3D アプリ起動ツールを作成するには、次の 3 つの手順を実行します。

1. 設計と概念 (この記事)
2. モデリングとエクスポート
3. アプリケーションへの統合:
   • UWP アプリ
   • Win32 アプリ

設計概念

空想的でありながら違和感を感じさせない

このアプリ起動ツールが置かれている Windows Mixed Reality 環境は、サイエンス フィクションのように空想的でありながら違和感を感じさせない世界です。 この秀逸の起動ツールは現実世界の規則に従います。 アプリの中にある身近で代表的なものを、現実世界のルールのいくつかを無視して意のままに従わせることを想像してみてください。 魔法を見せられたような気分になるでしょう。

直感的

アプリ起動ツールを見たときに、その目的、つまりアプリを起動すること、が明らかであることが大切です。その点について誤解を招くことは避けなければなりません。 たとえば、クリフ ハウスに使われている装飾の一部と誤解されることなく、アプリの代表的な要素がはっきりと伝わるような起動ツールにします。 アプリ起動ツールは、人々の目を引き、手に触れて選択してもらえるようなものでなければなりません。

"Fresh Note 3D アプリ起動ツールの例 (架空のアプリ)"

ホーム スケール

3D アプリ起動ツールはクリフ ハウス内に置かれるため、その既定のサイズが、空間内の他の "物理" オブジェクトと整合している必要があります。 たとえば、観葉植物や家具の横に起動ツールを置いた場合に違和感がなく、妥当な大きさであることが必要です。 まずは、30 立方センチメートルでどう見えるかを確かめるのがよいでしょう。ただし、そのサイズはユーザーが自由に拡大縮小できることを忘れないでください。

所有感

アプリ起動ツールは、人がその空間の中で所有する喜びを感じるようなものでなければなりません。 ユーザーは実質的に、それらの中に身を置くことになります。こんなものがずっと欲しかったんだ、手元に置いておきたかったんだと思ってもらえるような起動ツールであることが大切です。

"Astro Warp 3D アプリ起動ツールの例 (架空のアプリ)"

見てそれとわかる

3D アプリ起動ツールは、それを見た人々に "アプリのブランド" が直ちに伝わるものでなければなりません。 アプリの中に重要なマスコットや特に知名度の高いものが存在するならば、それをデザインの重要な要素として用いることをお勧めします。 Mixed Reality の世界では、ロゴ単体よりも、モノ、つまりオブジェクトがユーザーの関心を引きます。 見てそれとわかるようなオブジェクトならば、ブランドがすぐに明確に伝わります。

どこから見ても見栄えがする

皆さんのアプリには、ただ平面にロゴを置いて終わり、という以上の価値があります。 起動ツールは、ユーザーの空間の中で、わくわくする 3D の物理オブジェクトを思わせるものでなければなりません。 開発したアプリが、メイシーズ サンクスギビング デイ パレードにバルーンとなって登場することを想像してみましょう。 通りを歩く人々をあっと言わせるデザインはどんなものかと自問してみてください。 どんなデザインなら、どの角度から見てもすばらしいと思えるでしょうか。

ロゴのみ

認識可能

フラットアプローチを感じる、驚くべきことではない、フラットな感じ

ボリューメトリック アプローチの方がアプリのショーケースが向上します

よりよい 3D モデルのためのヒント

• アプリ起動ツールの大きさを計画するときは、約 30 cm の立方体を目安にします。 つまりサイズ比率は 1:1:1 です。
• モデルの多角形数は 10,000 未満にする必要があります。 三角形の数と詳細度 (LOD) の詳細情報を参照してください。
• イマーシブ ヘッドセットでテストします。
• ディテールをテクスチャに頼らず、可能な限りモデルのジオメトリに組み込んでください。
• "水密" で隙のないジオメトリを構築します。 すきまが生じないようにしてください。
• オブジェクトには自然な素材を使用します。 現実世界で巧みに丹念に作るイメージで作業してください。
• さまざまな距離やサイズで確実にモデルが読めるようにします。
• モデルが完成したら、アセットのエクスポートに関するガイドラインをお読みください。

"繊細なテクスチャを備えたモデル"

避けるべきこと

• ハイコントラストのディテールや小さくごてごてしたパターンやテクスチャは使用しないでください。
• 薄いジオメトリは使用しない。距離が大きいとうまく機能せず、良好な結果が得られません。
• 1:1:1 のサイズ比率を超えてモデルの一部が突き出すようなデザインは避けてください。 スケーリングの問題が発生します。

"ハイコントラストで、小さくごてごてしたパターンは避ける"

活字の扱い方

• 活字は、アプリ起動ツールの約 1/3 (またはそれ以上) の大きさにすることをお勧めします。 実際に起動ツールであることを人々に伝えるのは主に活字であるため、その内容が充実していることは大切です。
• 活字を大きくしすぎないようにしてください。アプリ起動ツールの核となるサイズ (またはそれ以下) の枠内に留めるようにします。
• フラットな活字でも通用しますが、特定の環境下や特定の角度からだと見づらくなる場合があります。 その点を考慮し、後ろに立体的なオブジェクトや背景を置くことを検討してください。
• 活字に厚みを持たせると 3D で見栄えがよくなります。 活字の側面には、明度を落とした異なる色の影を付けると可読性が向上します。

背景のないフラットタイプは特定の角度や特定の環境で見るのが難しい場合があります

組み込みの背景を持つ型はうまく機能します

に機能します。押し出し型は、側面を網掛けする場合にうまく機能します

効果的な活字の色

• 白
• Black
• 明るい中彩度の色

"効果的な活字の色"

避けるべき色

トラブルの原因となる活字の色は次のとおりです。

• 中間色
• グレー
• 彩度が高すぎる色や彩度を落とした色

"問題の原因となる活字の色"

照明

アプリ起動ツールの照明は、クリフ ハウスの環境から入ってきます。 屋内のあらゆる場所で起動ツールをテストし、光が当たるところとそうでないところの両方で見え方を確認してください。 安心してください。このドキュメントに記載した他のデザイン ガイダンスに従っていれば、クリフ ハウスにおけるほとんどの照明で起動ツールは良好に表示されます。

さまざまな照明の中での起動ツールの見え方をテストするのに適した場所としては、スタジオ、メディア ルーム、屋外、バック パティオ (芝生のあるコンクリート エリア) があります。 また、半分だけ光が当たるように配置して、その見え方を確認するのも良い方法です。

"光が当たるところとそうでないところの両方で起動ツールの見え方を確認"

テクスチャ

テクスチャを作成する

3D アプリ起動ツールの最終的な形式は、PBR (Physically Based Rendering) パイプラインを使用して作成される .glb ファイルです。 難しい作業なので、まだ技術アーティストを雇っていないのであれば、今がそのときです。 DIY に自信がある方は、作業を始める前に PBR の用語や中のしくみをじっくり調べておくと、起こりがちなミスを避けることができるでしょう。

"Fresh Note 3D アプリ起動ツールの例 (架空のアプリ)"

推奨される作成ツール

Adobe Substance Painter を使用して最終的なファイルを作成することをお勧めします。 あまり Substance Painter で PBR シェーダーを作成したことがない方は、こちらのチュートリアルを参照してください。

(3D-Coat、Quixel Suite 2、Marmoset Toolbag のいずれかの使用経験がある方は、これらのツールを使ってもかまいません。)

ベスト プラクティス

• アプリ起動ツール オブジェクトが PBR 用に作成されている場合、クリフ ハウスの環境用に変換するのは簡単です。
• 私たちのシェーダーは、Metal または Roughness ワークフローを想定しています。Unreal の PBR シェーダーがそれに近いでしょう。
• テクスチャをエクスポートするときは、推奨されるテクスチャ サイズを考慮してください。
• オブジェクトは、リアルタイム照明用に構築する必要があります。これは次のことを意味します。
  • ベイクド シャドー (焼き付けた影)、つまりペイントした影は避けてください。
  • テクスチャにベイクした照明は避けてください。
  • いずれかの PBR 素材作成パッケージを使用して、私たちのシェーダー向けに生成された適切なマップを入手します。

関連項目

• Mixed Reality ホームで使用する 3D モデルを作成する
• 3D アプリ起動ツールの実装 (UWP アプリ)
• 3D アプリ起動ツールの実装 (Win32 アプリ)