【Unity】Photoshopを使って「オリジナルのスカイボックス」を作る方法

Photoshopでスカイボックスを自作しよう Unity

今回はゲームの絵作りや素材制作に関する話題で、

Unity用のスカイボックス(=空)を自作してみよう!

という内容になっています。

Unityで3Dゲームを作るうえで、空がデフォルトのままだと非常にダサいので必ずと言っていいほどスカイボックスを変更することになりますよね。ただスカイボックスはイメージ通りのアセットが手に入らない場合も多いので「自作できたらいいのになぁ」と思っている方も少なくないのではないでしょうか。

そこでここではPhotoshopを使ってスカイボックスのテクスチャを自作する方法をご紹介しますね。

スカイボックス(Skybox)について

まずはじめに、Unityのスカイボックスについて簡単に説明しておきます。

スカイボックスとはUntiyのシーンの「空」や「遠景」を描画するためのマテリアルのことです。デフォルトだと皆さんお馴染みのくすんだ空と茶色い地面のようなものが描画されるようになっていますが…

Unityのデフォルトのスカイボックス

Unityのデフォルトのスカイボックス

マテリアルを変更することで好みのテクスチャを表示させることができます。下記は今回自作したスカイボックスのサンプルです。

上記のような空はPhotoshop等の画像編集ソフトがあれば簡単に作ることができます。

Photoshopでスカイボックスのテクスチャを自作する方法

ではここからが本題で、Photoshopを使ってスカイボックスを作る方法を順を追って説明していきます。主な手順は次の3ステップです。

  1. Photoshopでスカイボックスを描く
  2. 手順1のテクスチャをUnityにインポートする
  3. スカイボックス用のマテリアルを作り、シーンに適用する

それぞれ詳しく見ていきましょう。

Photoshopの3D機能を使ってスカイボックスをプレビューしながら描く

まずはPhotoshopの3D機能を使ってスカイボックスのテクスチャを描きます。スカイボックスは普通の画像なのでソフトはPhotoshop以外でもよいのですが、Unity上での表示は球状なのでそのまま描くと歪みが生じてしまい意図した見た目にならない可能性があります。そこでPhotoshopの3D機能が役立ちます。

さてPhotohopを起動したら、縦横比が16:9の画像を新規作成しましょう。サイズは適当でかまいませんがここでは「1920×1080px」とします。そうしたらメニューバーの「3D」→「球パノラマ」→「選択したレイヤーから新規パノラマレイヤーを作成」を選び、パノラマを作成してください。

球パノラマの新規作成

それができたらレイヤーの「SphericalMap」をダブルクリックして、テクスチャ(PSBファイル)を開きます。

パノラマのテクスチャの開き方

このテクスチャが実際のスカイボックスとなるテクスチャです。下の画像のように適当にガイド線を引いてから好きなように空を描いてみてください。

空のテクスチャの作成

実際の見え方を確認したい場合は、先ほどのパノラマのタブに戻って「V」キーで見回すことができます。試しに上の方を向いてみると下の画像のように表示されます。

球パノラマの見え方の一例

実際に絵を描いてみると分かるのですが、テクスチャの上端・下端に近いほど歪みが大きくなります。なのでなるべく上端と下端を避けて雲などを描くと歪みが少なくきれいに描くことができるので覚えておいてください。

それからもう一つのポイントとして、スカイボックスはカメラがどんなに離れても縮小表示されないので雲などは少し小さめに描くと巨大になりすぎず見栄えがよくなります。

あとは納得いくまで描き込んで、できたらテクスチャのほうをPNGファイルとして書き出ししてください(※パノラマのほうはあくまでもプレビュー用ですから実際には使いません)。

自作したスカイボックスをUnityにインポートし、設定を行う

次に書き出したPNGファイルをUnityにインポートして設定を行います。

スカイボックス用のテクスチャの設定

上の図のように

  • テクスチャ形状:キューブ
  • ミップマップの生成:OFF

に変更しましょう。これでテクスチャのインポートはOKです。

スカイボックス用のマテリアルを作ってシーンに適用する

最後はスカイボックス用のマテリアルを作ってシーンに適用します。新しいマテリアルを作り、そのマテリアルのシェーダーを「Skybox/Cubemap」に変更してCubemap欄に先ほどのテクスチャを設定しましょう(下図)。

スカイボックス用のマテリアルの作り方

あとはライティング設定ウィンドウを開き、「環境」→「スカイボックスマテリアル」の欄に上記のスカイボックス用マテリアルを登録すれば完了です。ここまできちんとできていれば、下の画像のようにオリジナルのスカイボックスがシーンビューやゲームビューに表示されます。

オリジナルのスカイボックスをシーンに適用した例

おわりに

以上、簡単ではありますがオリジナルのスカイボックスを作る方法について書きました。

スカイボックスは地味ながらゲームの見た目にかなり影響するので、アセットで気に入ったものがなければ自作を選択肢に入れてもよいでしょう。その場合はぜひ上記を参考にしていただき自分好みのスカイボックスを作って頂ければと思います。

この記事がUnityでのゲーム開発のお役に立てば幸いです。