Help us understand the problem. What is going on with this article?

Unityでクリスマスを飾ろう!(UnityLight2Dの話)

image.png

Unity #3 Advent Calendar 2019 12/24・・・僕の番だ!シャンシャンシャンシャン:confetti_ball:

今日はクリスマスイヴですね。
去年はクリスマスの時期にUnityを使ってクリスマスカードを作ろうの話を投稿しましたが今年もしますよ:snowflake:

Unityでクリスマスカードを作ろう

作りましょう。

  • 使ってみたかったUnityの機能があるので試す
    • Unity Light2Dとドット絵で作ろう
  • WebGLでかきだしてUnityRoomにあげる
  • UnityRoomのURLをペッと送ればOK

Unity Light2D

このLight2DはUnity2019.2から使用が可能です。なんとなくクリスマスのイルミネーションピカピカさせっかーと思い使おうとしました。

UnityのLight2Dを使う準備

Window->PackageManagerからLightweight RPをインストールします。
image.png

Projectウインドウ上でPipeline Assetと2D RendererをCreateします。
image.png

Pipeline AssetのRenderer TypeをCustomに変更し、Dataに先程作成した2D Rendererを設定します。
image.png

その後、projectSettingのGraphicsにあるScriptable Renderer Pipeline Assetに先ほど作成したPipeline Assetを設定します。
image.png

これで、Hierarch上でLight2Dが作成できるようになりました!
image.png

Unity Light2Dでできる表現

image.png
こちらに動画を上げました。
https://www.youtube.com/watch?v=2knzJoysZ1s

法線マップを使ってちょっとだけ立体表現してみる

そもそも法線とは?

面に垂直なベクトルのことです。下の図で言うと、黄色の面から垂直に出てる青い矢印が法線です。
image.png

(画像はwikipediaより)

法線マップとは?

オブジェクトの法線ベクトルのX, Y, Z座標に対応したRGB画像のことです。ノーマルマップともいいます。
左の図の法線マップを立方体に張り付けると、立方体が法線マップに応じて凸凹しているのが分かります。
image.png

(画像は http://cpetry.github.io/NormalMap-Online/ より)

簡単に法線マップを作ろう

NormalMap-Onlineを使います。
面白いので、サイトにいって遊んでみてください。
image.png

実際に作ってみた

image.png

こいつを立体的にしてみましょう。
ここに影が入るかな~と思ったところを暗くしたHeightMapとやらをつくって変換してみました。

image.png

SpriteにNormalMapを設定

Sprite EditorのSecondary Textureから設定します。
image.png

Nameの部分は、ラベルの右にある▼から選びます。
※手入力でいれるとうまくいきませんでした(これに気づくのに30分くらいかかった人)
image.png

Light2Dの設定を行う

こちらがノーマルマップ適用前
image.png

Light2Dの設定にUse Normal Mapにチェックをいれるだけで・・・
image.png

にじいろカワウソが立体っぽくなりました!
image.png

こちらに動画をあげています。
https://www.youtube.com/watch?v=C_MHtLP36zc

ってことでUnityRoomにクリスマスカードをうpしました。

とある場所をクリックすることで開封(ライトアップ)します。
icon.png
https://unityroom.com/games/xmascard2019

みなさん、良きクリスマスを!

hayu500ml
ON状態では、Unityを使ってクライアントエンジニアでゲームを作っています。 OFF状態では、MagicavoxelやらUnityやら嗜んでいます。ゲームは作るのもプレイするのも大好きです。
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした