Three.jsを使って、作ってみた

プログラミング関連の事を色々書いています(^^) 週末はレストランやコンビニのお菓子のことを書いています。

Unity 空を作る Skybox

今回は、Unityの「Skybox」について書きます。


「Skybox」を使うと、空が作れます。
こんな感じの空が作れます↓
f:id:gupuru:20140526014152p:plain

あと、「Skybox」の空は、360度きれいな空が作れます。途中で継ぎ目とかは、ないです。


では、「Skybox」を使う方法を書きます。

「Skybox」で使う空の画像(マテリアル)は、すでにUnityで用意されています。(自分で作ったものやAsset storeでダウンロードしたものを使用する場合は、1〜2は飛ばしてください。)


1.
「Assets」の「Import Package」を選びます。すると、いっぱいリストが表示されます。
f:id:gupuru:20140526014647p:plain
この中から、「Skyboxes」を選びます。

2.
選ぶと、このような↓画面が出てくるので、「Import」を押します。
f:id:gupuru:20140526014714p:plain
すると、「Assets」の所に「Skyboxes」が入っていると思います。
f:id:gupuru:20140526014843p:plain
中身は、こんな感じです。
f:id:gupuru:20140526015206p:plain

3.
ここから、「Skybox」をMain Cameraに設定していきます。
カメラに設定しておくことで、常に空を表示できます。

Main Cameraの「Inspector」の下の方にある「Add Component」を選びます。
f:id:gupuru:20140526015151p:plain
で、「Rendering」の「Skybox」を選びます。
f:id:gupuru:20140526015302p:plain
すると、こういうものが追加されているはずです。
f:id:gupuru:20140526015324p:plain

4.
上で追加された、「Custom Skybox」の所に「Skybox」の画像(マテリアル)を入れます。
入れ方は、ドラッグ・アンド・ドロップや「Custom Skybox」の欄の右にある◯アイコンをクリックします。
f:id:gupuru:20140526015631p:plain

無事に「Skybox」の設定ができたら、こんな感じに表示されています。
f:id:gupuru:20140526014152p:plain

使い方は以上です。


しかし、Game Viewのほうでは、「Skybox」が設定されていますが、「Scene」のほうは設定されていません。まだ、こんな↓地味な画面のままだと思います。
f:id:gupuru:20140526020007p:plain


ここからは、「Scene」のほうにも「Skybox」を設定する方法を書きます。

まず、「Edit」の「Render Settings」を選びます。
f:id:gupuru:20140526020124p:plain

すると、「Inspector」にこんな感じのやつ↓が表示されます。
f:id:gupuru:20140526020204p:plain

ここの「Skybox Material」にカメラに設定した「Skybox」の画像(マテリアル)を入れます。
f:id:gupuru:20140526020346p:plain
入れ方は、カメラに入れた時と同じです。

で、画像(マテリアル)を入れると「Scene」のほうにも「Skybox」を設定されています。
f:id:gupuru:20140526020503p:plain



今回は、空の「Skybox」を使いましたが、Asset storeには宇宙などの「Skybox」もあります。設定の仕方は同じですので、興味ある方は試してみてください。

これで、終わります。


参考サイト
ActionScript入門Wiki - Unity - 空テクスチャ(Skybox)を表示する