キューブマップを作る

ここでは、DCC ツールでのキューブマップの作成方法と CreativeStudio での確認まで説明します。

以下の 3 つのキューブマップ作成方法を説明します。

キューブマップと半球マップの違い

半球マップで用意する画像はカメラから見て 180 度分のみなので、モデルに映り込む絵はどこから見ても常に同じですが、
キューブマップが用意する画像は 360 度分なので、見る角度により変化のある映り込みが実現可能となります。

ここで紹介するのは完全反射モデルに対するキューブマップの作り方です。
また、DCC ツールの説明には Maya を使っています。

DCC ツールとは、Digital Content Creation の略です。
Maya / XSI / Photoshop など、デジタルコンテンツを作成するツールのことです。

DCCツールでの作成方法 ( 1 )

キューブにシーンを映り込ませテクスチャにベイクする

キューブマップはキューブに映り込ませています。

映り込ませたいシーンを読み込む

ここでは、例として方向の分かりやすいシーンを作成しています。

方向の分かりやすいシーンにしてみました。

任意の位置にキューブを作成し、キューブの UV と映り込む方向を合わせます

シーンを見渡す位置にキューブを置きます。

キューブの中心からそれぞれの頂点を結んだ先の範囲の画像がキューブそれぞれの面に映り込むので、キューブの大きさは問いません。
ただ、キューブが背景オブジェクトにめり込まないように気をつける必要がある場合も考えられます。

デフォルトのキューブの場合、回転に ( 0 , 0 , -90 ) を入れて、トランスフォームにフリーズを入れてください。

デフォルトのキューブの UV は T 型のはみ出た部分に天井と床が映り込むようになっていないのでそれを直す必要があります。
UV を手動で直すのも 1 つの方法ですが、手動で作業した場合は、映り込ませる向きに間違いが起こる可能性がありますので注意が必要です。

キューブの法線を丸めます

全方位の映り込みがきれいにつながります。映り込みがうまくつながらないときはキューブの法線を確認してください。

キューブに [ dgs_material ] という映りこみ用のシェーダーをアサインする

完全反射の設定ができればシェーダーは問いません。以下はdgs_materialのアトリビュートです。

dgs_materialシェーダーをアサインします。

Diffuse : 0 ( 背景以外の映り込みをさせないため、自分自身は真っ黒にします )
Glossy : 0 ( 余計なハイライトはなしにする )
Specular : 1 ( 完全反射させる )

バッチベイクの設定

キューブを選択し [ ライティング ]→[シェーディング]→[バッチベイクの追加]→[テクスチャ] を選びます。
キューブにバッチベイクのアトリビュートが追加されます。

texturebakeset

「'正射投影の反射'」にチェック ( テクスチャ座標とモデルの法線の関係を均等にする )
「ファイル名プリフィックス」に出力ファイル名
「単一ベイクマップ」にチェック ( 1 枚のテクスチャに出力すること )
「バックグラウンドモード」では UV の外側のテクスチャ色がはみ出ないように設定します。

バッチベイクをします

キューブを選択し、[ライティング]→[シェーディング]→[バッチベイク ( Mental ray ) ]を選択します。
テクスチャが ''renderData/mentalray/lightMap'' に出力されます。

バッチベイクでできたテクスチャ

Photoshop でバッチベイクしたデータを開きます

キューブマップのテクスチャは Hrizontal Cross ( ホリゾンタルクロス ) という形にしないといけません。

画像をキューブマップのフォーマットに直します

アクションでも作ってみては?
  1. イメージを時計回りに 90 度回転し、キューブ 1 個分右にスクロールさせる
  2. 上下の余白をきちんと取り除き、横は 2 のべき乗、縦はその 75% になるようにする
  3. CreativeStudio の中間ファイルとして保存する

CreativeStudio でテクスチャを確認します

作成したキューブマップを CreativeStudio で確認します。

見る角度によって映る絵が変わります
チェスに貼るとこんなかんじです

DCCツールでの作成方法 ( 2 )

カメラを使って6方向をレンダリングする

ここでのテクスチャの作成方法は、シーンにカメラを置き、画角を90度にして6方向をレンダリングします。

シーンを読込みます

S だけ伸ばしたのはキューブマップにしたときに上下がつながるかを確認するためです。

2コマ目の方向をわかりやすくしています

カメラを作成します

画角を 90 度に指定します。横方向で考えると 90 度を 4 回足すと 360 度なので、すべての部分が見えることになります。

「キューブから見た画像」ではなく「キューブに映り込む画像」なのでカメラのスケールは必ず「 -1 」にしてください。

ビューアングルとカメラのスケールを変更

カメラのアニメーションを作成してレンダリング設定をします

6 コマのアニメーションを作成します。- X 方向から始め、反時計回りに 1 周したあと、上と下を向きます。

カメラが上下を向くときのカメラの傾きに注意してください。

2コマ目の方向をわかりやすくしています

レンダリングをします

以下はレンダリング結果です。 5 コマ目と 6 コマ目はうまくレンダリングできていると画像の向きを直す必要がありません。

レンダリングしました

Photoshopで合成します

グリッドをロックしてキューブマップの配置にします。

これもアクションでいけそうな予感が。

CreativeStudio でテクスチャを確認します

きちんと文字が読めるか確認してください。

まずは方向がわかるシーンでテストするのをお勧めします。

向きの確認大事です。
チェスに貼るとこんなかんじです

Photoshopで作る

画像からキューブマップを作る

自分で描いたり、写真を加工して作ったりする方法です。

photoshopで加工します

横方向の画像を作成(または写真を用意)します

2のべき乗であること、縦横比が1:4であること、左右方向がつながっていること、が条件です。

上と下の方向の画像を用意します

画像サイズを縦に300%にし、上下の画像を用意します。この時、上下どちらも4辺が中央の画像とつながっている必要があります。

保存します

キューブマップは画像サイズが大きくなりがちなので、ETC1フォーマットを積極的に利用します。

CreativeStudioでテクスチャを確認します

csで表示します
チェスに貼るとこんなかんじです