Adobe AMX2021 Adobe Aero Adobe CCアプリを使った「発展的ワークフロー」について
AR思い出の旅「球体：夏：ひまわり畑」
Adobe MAX2021 10月27日4：00〜4：30 セクションS921-Adeobe Aero "おつくり遊ばせ！中級編ARイマジネーションの旅へ"の中で紹介した「発展的ワークフロー」の内容を書き出したスライドです。セクションの動画解説の補完資料として見ていただければ幸いです。
解説でPBR（物理ベースレンダリング）についてがありますがこれは本来の3DCGで PBRを使ってリアルで正確なレンダリングを再現することではなくARでクリエイティブな表現をするために使ってます。その為にPBRとしては変則的な使い方になってるかもしれません。
この6月にAdobeからSubstance 3Dシリーズが発表になり新しい3DCGアプリ環境が提供されました。この企画を始めたのがこの時期と重なったため十分な検証ができずにARコンテンツワークフローではAdobe Dimensionを使ったワークフローで紹介をしてます。今後、3D関係はSubstance 3Dに移行するのでこのワークフローが使えるかを検証していきたいと思います。
また8月からはPhotoshop2021のバージョン22.5から3D機能が削除になり法線テクスチャーの作成ができなくなりました。※ただし旧バージョンでは利用は可能です。詳しくはAdobeのサイトを参考にしてください。
AR体験 ひまわり畑の球体
ARについて
コンセプトを実現するため、お届け先の現実空間を借景としてリアルな3DモデルでARを演出。
「透明感」「浮遊感」「アクション」の３つの要素をポイントにしました。
そしてアドビ・クリエイティブ・クラウド・アプリを連携して作成しています。
ワークフロー
制作フローとして4つの工程でCCアプリの連携を行なっています。
Photoshopで素材制作テクスチャー画像
DImensionでモデル・テクスチャー設定
Aeroデスクトップベータ版でARコンテンツ作成
AeroモバイルでAR体験
概要
Adobe Aeroでひまわり畑を球体にするには3Dオブジェクトが必要です。
1.モデルデータ
Dimensionの基本シェイプ球
2.球にリアルな質感を再現するテクスチャーマテリアル
Photoshopで写真画像からテクスチャーを作成
Dimensionで球に画像をテクスチャー設定します。
ひまわり畑の球体の外側球の作成方法につて絞って解説します。
物理ベースのレンダリングシステム PBR
Aeroではリアルな3Dモデルを表示するのに「物理ベースのレンダリング」が使われてます。とても難しい内容なのでここでは制作に必要な事象に沿って紹介します。今回は、Aeroと共有のDimension（ディメンション）、プロパティテクスチャーに素材の画像を使い3D球体を制作しています。詳しい内容はアドビのサイトに「Adobe Standard Materialのプロパティ」というサイトがありますので、ご参照ください。
参考リンク：https://helpx.adobe.com/jp/dimension/using/standard-materials.html
ベースカラー
ひまわり畑を撮影した写真を使ってます。
RGBカラー画像
各テクスチャー画像のベースになります。この後の画像はこれを元に画像処理で作成しています。
球に貼り込むため左右を縮めた正方形にしています。
不透明度
物体が光を透すかどうかという設定で今回の透明/透過の球体を実現するのに重要な項目です。
白黒画像
Aeroでは 黒い領域が透明で白い領域は不透明になります。今回は黒い領域をグレー濃度70%にして完全な透明ではないガラスのような質感にしています。
粗さ
物体の表面の仕上げ感を再現できます。
白黒画像
Aeroでは 黒い領域は滑らかなツルツル感 白い領域は艶消しになります。
タリック
金属素材の光沢を再現できます。
白黒画像
Aeroでは 黒い領域は金属的でない鈍い光沢 白い領域は反射のある光沢
発光
物が発する光の強さ
白黒画像
Aeroでは 黒い領域は光を反射 白い領域は光を発します。
法線
特殊な画像を使って表面の凹凸やディテール、影を再現。
法線マップ画像
Photoshopのフィルター/3D/法線マップ生成...で作成できます。
Photoshopで６つのテクスチャー画像をそれぞれ作成して pngで保存。
今回はAeroで扱うデータを小さくする為、512 x 512ピクセルの画像サイズにしています。
モデリングはAdobe Dimensionの基本シェイプ 球 を使います。
Adobe Dimension 球にPhotoshopで作成した各種テクスチャーマテリアルの画像をプロパティテクスチャーにある相当する項目に設定します。
そうすると透過のあるひまわり畑の球体になります。
ひまわり畑の球体用に 外側、内側、コア の3つの球を作成してます。
それぞれの表現に最適な画像を作成してテクスチャーを設定します。
３つの球体に名前を付けてaero用にglbファイル書き出しします。
Dimensionのメニュー：ファイル/書き出しから「aero用データへの書き出し」を選択してクラウドに書き出します。
Aeroデスクトップベータ版を使って新規プロジェクトを作成。
Dimensionから書き出した３つの球体モデルglbファイルを読み込ませます。
次にプロパティで3つのモデルに 回転軸 位置 拡大・縮小 サイズを設定します。
アクションの追加
３つの球体それぞれにビヘイビアビルダーを使ってトリガーと動き、アニメーション、インタラクションを追加します。
完成した球体をARトランクに組み込み編集、ビヘイビアでアクション設定。
クラウドに保存して共有でリンクURLもしくはQRコードを書き出します。
iPhone iPadのカメラからQR コードを読み取りAR体験
トランクから飛び出した回転するひまわり畑の球体に飛び込むと蝉の鳴く環境サウンドが体験できます。
このワークフローは一例です。他にも色々な制作方法があるので是非Aero で新しい体験にチャレンジしてみてください。
