【Unity】マテリアルに複数のテクスチャを重ねて表示する

ひとつのメッシュデータに複数のテクスチャを重ねて表示する方法を紹介していきます。
まず、方法は2つあります。
・Shaderを改造し、テクスチャを二枚入れると重ねて表示されるようにする。
・マテリアルを2つ用意し、マテリアルを2つ重ねる。
今回はマテリアルを2つ使用する方法を紹介します。

マテリアルを重ねる方法

やり方は単純で、InspecterからRendererのマテリアルの配列要素数を増やし、マテリアルを紐づけます。

また、重ねるマテリアルはしっかり透過部分のあるものを選択しましょう。
StandardShaderを使用する場合はRenderingModeをCutoutにし、pngファイル等の透明度のあるテクスチャをalbedoにセットしてください。

これで重ねて表示できます。

しかーし!モデルのサブメッシュが複数に別れている場合、これではうまくいかない可能性が高いです。
解決策について、サブメッシュって何よってとこから説明していきます。

モデルデータの構造

学んだわけじゃないけど多分こんな感じ

FBXファイルを読み込むとメッシュ単位でオブジェクトが生成される。
そして、そのメッシュ内のサブメッシュ毎にマテリアルが生成される。
Blenderでいうとオブジェクト毎にメッシュ、マテリアルの配色分け毎にサブメッシュといった感じだ。
問題は、Unity内でメッシュの描画を行うRendererがメッシュ毎に使用することにある。

最初に紹介したように、RendererのMaterialsの要素数を増やすことで、サブメッシュの数以上のマテリアルを重ねることができる。
しかし、ここで厄介なのがメッシュ内で保持しているサブメッシュの内、一要素目のサブメッシュにしかマテリアルが重ならない。いくつマテリアルを追加で重ねても、全て一要素目に重なってしまう。
上記例の場合、肌にタトゥーや擦り傷のマテリアルを重ねて表示したくても、肌ではなく瞳のサブメッシュに重ねて表示してしまう為、不可能である。
また、メッシュ内のどのサブメッシュを一要素目にするかは、選べない。(多分頂点数の一番少ないサブメッシュが一要素目に来ている気がする。)

解決策としては、モデリングソフトで目と肌のメッシュを分けて再度FBXにエクスポートした後にインポートし直す。
もしくは、マテリアルを2つ重ねる方法を諦めて、自作シェーダー内でテクスチャを重ねて表示する他ないと思う。多分。

身体はUnityで闘争を求める。⑧。機体のカラーリングと、機体データのセーブ&ロード

機体の色変更と機体データのセーブ&ロードをできるようにしました。

今回の実装は以下がポイントでした。
・テクスチャを重ねて表示する
・データ及び表示画面の保存・読み込み
これらは長くなりそうなので別々に他記事に後日まとめようと思います。

身体はUnityで闘争を求める。⑦。アセンブル機能追加

自機をカスタマイズできるようにしました。

ScriptableObjectによるデータ管理

ゲームにおけるアイテムの情報だとか、敵の情報、等々の普遍的なデータ群はScriptableObjectで管理するのが、Unityでは一般的です。
例えば、アイテムオブジェクトに各アイテム全部の情報を配列で保持し、アイテムIDによって配列から個別の情報を取り出すようにした場合、アイテムオブジェクトを10個生成したときに、各アイテム全部の情報配列10個分がメモリを圧迫してしまいます。これを避けるために、データ群は独立したScriptableObjectにもとめて格納します。

とはいえ、素の状態でScriptableObjectのままデータ群を管理するのは、編集し辛く現実的ではないと思います。

そこでExcelからScritableObjectにデータ群を変換するプラグインを用いて。
Excel上でデータ群を管理できるようにします。

Excel⇒ScriptableObject

おなじみのテラシュールブログ様で上記プラグインが公開されています。
使い方とプラグインは下記リンクから

http://tsubakit1.hateblo.jp/entry/20131010/1381411760

背景の使用モデル

背景の使用モデルは
・自作
・商用可能なフリーモデル
・商用可能な有料モデル
を組み合わせております。

自作モデル

投光器のモデルは自作しました。
いつも通りblenderで作成し、SubstancePainterで色付けをしています。
せっかくなのでBOOTHにて無料配布しています。
https://nextnext.booth.pm/items/1309666

電球の数だけLightオブジェクトを設置したけども、明らかに高負荷である。

フリーモデル

色んなサイトから集めてまわりました。
・cdtrader
・TURBO SQUID
・Free 3D
あたりから漁りました。

この中ではBTR(装甲車)、ドラム缶、箱がフリーモデルです。

有料モデル

オイルタンクだとかクレーンはフリーでいいものがなかなか見つかりませんでした。探す時間ももったいなので、いろんなタンクモデルが入ったモデルパック等を購入しました。1モデル100円以下なので、こういうのはさっさと買っちゃったほうがいいと思いましたね。

cgtraderのarmzep様のモデルが安くて中身も豊富でよかったですね。
https://www.cgtrader.com/3d-models?author=armzep

ただし、Textureは自分で作成する必要があるのと、
3DS MAX で作られたモデルだったので、blenderにobjファイルをインポートした際に、UV展開がごっちゃになっていました。仕方なく自分で雑にUV展開しなおしました・・・
TexturもSubstancePainterですぐ作れるし、UV展開も雑でいいならすぐできるので、それを加味しても安いしたくさんモデルがあるので助かりました。

身体はUnityで闘争を求める⑥。オンラインマルチプレイの仮実装。

オンラインマルチプレイを仮実装しました。
実装にあたって、Photonを用いました。
https://www.photonengine.com/ja-JP/Photon
先に以下できたもの。

Photonの使い方等は以下のページが大変参考になりました。

https://connect.unity.com/p/pun2deshi-meruonraingemukai-fa-ru-men-sono1
こちらのページが優秀すぎて特にまとめる内容はありません。(逃げ)
使用したのは 2018年8月25日 にリリースされたPUN2(
パンツ。。。 多分Photon Unity Network 2の略かな?)です。

実装した所感としましては、オンライン実装を視野にいれるなら、早い段階で組み込むほうが良いでしょう。
プレイヤー間の通信には更新間隔や一回のデータ送信料に制限がある為、どのようなデータだけをやり取りしてオンラインマルチプレイを実現させるかを考える必要があります。この実現方法によっては、今までローカル用に組んできたロジックを大きく修正する必要が生まれてきます。
以降は今回の仮実装を糧に、マルチプレイを加味したロジックでゲーム作成していきます。

身体はUnityで闘争を求める⑤ポストプロセスの導入、販売3Dモデルの導入

ポストプロセスとは

既存のゲーム画面(レンダリングされたシーン)にエフェクトをかけて、画面全体をかっちょよくすることです。
このポストエフェクトをかけるツールに
Post Processing Stackっちゅーものがあります。 Unityの公式アセットの一つで、誰でも簡単に導入できます。
https://assetstore.unity.com/packages/essentials/post-processing-stack-83912

Post Processing Stack を導入してみる

公式アセットということもあり、機能一通りのチュートリアル動画(講演動画)があります。

この解説を参考に自信のゲームにもポストエフェクトをかけてみました。

かっこよくはなりましたが、全体的に白飛びしてしまっていますね。
Bloomを強くかけすぎているのだと思います。
また、パーティクルが総じてBloomの影響を受けています。
スラスターやマズルファイア等が勝手に光ってくれるのはありがたいのですが、煙なども光ってしまっています。幾重にも煙が重なった際などは顕著に眩しくなってしまいます。パーティクルとPost Processing Stackの関係性をもう少し調べる必要がありそうです。

販売モデルの導入

Boothにて販売している商用利用可能なモデルを購入し、ゲーム内に導入しました。ボーンの数や構造に違いがありますが、FinalIKによる逆運動学で手足の動きを制御している為、難なく導入できました。

購入したモデル↓
https://booth.pm/ja/items/1207119

やはり自分で作成するよりも、購入したほうがコスパもいいしクオリティも高い。自機のパーツバリエーションを増やすのに、ガンガン購入して導入をしていきたいと思います。


次回はオンラインマルチプレイを仮実装。

身体はUnityで闘争を求める④自機モデルの一新&壁キックの実装

新規モデル作成

前回の記事から顔をだしていましたが、新しく自機のモデリングをしました。
いつも通り、BlenderでモデリングしてSubstancePainterでぬりぬりしてます。
さくっとスクショだけ。

1機目に比べて物凄くかっこよくなった。我ながら成長を感じる。

壁キックの実装

まずは完成した壁キックをどうぞ。

通常のジャンプとは違い、地面ではなく、壁を使ってジャンプして移動することですね。

では壁ジャンプを実装する上で必要な要素に分解します。

処理実施条件
・機体が空中にいる
・ジャンプボタンが押された
・壁が近くにある
・ジャンプ及び壁キックをした直後ではない

処理内容
・一瞬壁を蹴る為に自機が止まる。
・上方向に上昇
・さらには移動入力にあわせ、水平方向にも素早く移動
・壁を蹴った場所にエフェクト&音を発生させる。

ではまず条件のほうから。
・機体が空中にいる
・ジャンプボタンが押された
 この2つは通常のジャンプと同じ条件である為、特にありません。

・ジャンプ及び壁キックをした直後ではない
 ジャンプしてからの経過時間を、Time.deltaTimeを用いて測定し、一定時間経過するまでは壁キックができないようにする。

・壁が近くにある
 壁との接近を判定する為に、この判定専用のCollider(isTrigger)を用意します。壁との判定にある程度ゆとりを持たせるに、ここではcollisionではなくisTriggerを用います。下図の赤い枠と障害物が重なった場合、壁に触れているものとしています。

次に処理
・一瞬壁を蹴る為に自機が止まる。
・上方向に上昇
・さらには移動入力にあわせ、水平方向にも素早く移動
この3つに関してはrigidBodyのvelocityを操作するのみです。


・壁を蹴った場所にエフェクト&音を発生させる。
この処理の実装が問題です。まず、自機と触れている壁の座標を取得しなければなりません。Collisionであれば、 collider.contactsを用いることでどの座標で接触したかを取得することができます。しかし、今回はisTriggerで判定を行っている為、できません。なので接触している物体そのものの座標と自機の座標の差分から、おおよその接触座標を割り出してエフェクトを出します。この方法で長方形や球等の単純なColliderとの接触箇所の割り出しはうまくいきますが、複雑な Colliderとの接触は、下図のようにうまくいかない場合があります。

赤点が本来エッフェクトを出したい座標で、黄色いパチパチが実際に出しているエフェクトです。terrarianのColliderとの接触の場合は綺麗な位置のエフェクトが出ないと思われます。
とはいえ、こういった細かいビジュアル部分は後回しにして、今回はこのままでよしとします。

【Unity】ParticleSystemを画面外でも処理させる

移動中の足元に砂埃を発生させるParticleSystemを追加したときに、少し躓いた部分をまとめます。

まずは以下の動画をご確認ください。

まず前提として、砂埃は空中では発生させないようにしています。
Particle System のEmissionを停止させる。もしくはPlay()Stop()関数で制御できます。
【Unity】パーティクルのクリアは行わずパーティクルの”生成”を停止させる方法
【Unity】パーティクルを止める – エフェクトhttp://albatrus.com/main/unity/8305

なのでジャンプ中は砂埃が発生しないわけですが。
何故か、着地した後も右脚だけは砂埃がでてきません。
これは、Particle Systemの「表示 画面外では処理を停止する」機能が働いてしまっているせいです。
ジャンプすることで、一旦画面内から砂埃が消えます。これにより
Particle System そのものが処理を停止してしまい、パーティクルの生成処理を要求しても、処理が実行されないことが原因だと思われます。
※証拠として振り向くと、ジャンプする前の砂埃のが残っています。そして、表示画面内にパーティクルが入ったことにより、右脚の砂埃生成が復活します。

解決方法は単純で、Particle Systemコンポーネントにある設定項目の
「Culling Mode」を”Always Simulate”に設定します。

するとパーティクルが画面外にでてしまってもParticle Systemは停止しないので、再度パーティクルを生成し始めるときに問題が発生しなくなる。

解決!
なんだかぐぐってもすぐに出てこない、こういった小さな問題の解決策を初めてとりあげれた希ガス。

身体はUnityで闘争を求める③砂漠と雑魚敵の実装

アーマードコアライクなゲーム制作の進捗その③
実際作業したのは2か月前ですが、覚えてる範囲でまとめておきます。

以下、作成したものをまとめた動画

砂漠の作成

ステージの作成に挑戦してみました。
まずはオブジェクトの一切ない、砂漠を作成してみようと思います。
作成するにあたって、Unityの地形生成ツールを利用して作成することにします。
候補として「Gaia」と
https://assetstore.unity.com/packages/tools/terrain/gaia-42618
「World Creator」
https://assetstore.unity.com/packages/tools/terrain/world-creator-professional-55073
とで、どちらにするか迷いました。
World Creatorのほうが、荒廃し、荒れ果てた戦場っぽい土地を作成しやすそうである点と、professional版が大幅値引きセールをしていたのでこちらを採用しました。

使用方法についてですが、日本語で解説しているサイトがあまり無い為、公式のYouTube動画を参考に、使用方法を学習します。

詳細な使用方法は、次回 World Creatorを使用したときにまとめるとします。
途中のスクショもないですし、うろ覚えです・・・(備忘録の意味・・!)
①World Creator Terrainオブジェクトをシーン上に配置します。
 (まだ地形は真っ平ら)
②WindowタブからWorld Creatorウィンドウを表示します。
 (このウィンドウで地形操作を行います)
③Terrain MaskでDesertを選択
 (これで地形が砂漠っぽくなります)
④③のLevel Strengthsの項目をお好みに調整します。
 (この値で砂丘の大きさや粗っぽさが決まり、生成されます。)
⑤テクスチャを張りつけます
 (以下の無料アセットを利用しました!)
https://assetstore.unity.com/packages/2d/textures-materials/floors/yughues-free-sand-materials-12964
⑥あとは雰囲気が出るように空(skyBox)を変更します。
 (有名な以下のアセットを使用)
https://assetstore.unity.com/packages/2d/textures-materials/sky/allsky-10109

すると以下のように砂漠ステージが完成?する。多分。

今アセットストアを見直していたら、地形データセットも結構お安く売ってるのね・・・
自分で作らなくてもよかったかもしれない・・

雑魚敵の作成

フワフワ浮いてて、集団攻撃してくる無人機、THE・雑魚敵を作ります。
まずデザインを考えるのですが、どうしてもよくあるドローンみたいなデザインを発想してしまう。弱そうでよくあるドローンっぽくない無人機・・・うーむ・・と悩んでいると。
前回のアバター看板のイラストを描いてくれたそるとりっぴ氏がアイデアをくれました。

ん?・・えーと、ん?

もうちょっと詳細が分かるように僕が全体図を描きなおしました。
話しながら「こんな感じ?これでいい?」と相談しながら。

プロペラが縦に2枚という奇抜なデザイン。その発想はなかった。

これを元にBlenderでモデリング

ものすごく脆そうでいい感じ。

後はUnity上の作業
もともと使用していたタレットを流用し、移動する制御を追加して完成。
移動はただただプレイヤーに接近するだけだと集団でいたときにまとまってしまうので、個体個体で目標移動地点にバラツキを与えるようにしました。敵AIの作成も、もう少し複雑な動きをするようなものを作ったらまとめることにしよう。

いっぱい、配置。動きはページ上部の動画を見てね

2か月前の作業だったからまとめ方がかなり雑・・・むしろまとまってすらいない。次から作業しつつ記録するよう気を付けよう。
ではばいなら。

バーチャルマーケット2に出展します

こんばんは。ねくすとです。
オリジナル3Dモデルアバターを作成しました!
バーチャルマーケット2に出展致します。

まず、作ったアバターがこちら
https://nextnext.booth.pm/items/1211097

アバターの作成

どんな手順でアバターを作成していったかを記録しておきます。
合計で45時間くらい?かかったかな?

素体の作成
ここまでは初めてアバター作った時と同じような手順です。アバター2体目ということもあって前回よりもスピーディーに作業ができました。
ここまでで10時間くらい

単純なフォルムということもあり、早くできたと思う。多分。

シェイプキーの作成
素体の状態で先にシェイプキーを設定しちゃいます。瞬きように目を閉じた状態と、リップシンクようにいくつかの口を開けてるモーションですね。

改めて見返すと、なんだか目が潰れてる気がしないでもない。

服と鎧の作成
服は肌のメッシュを複製して拡大することで作成しました。
鎧は一から作成し、できる限り単一ボーンに割り当てました。動作によってなるべく鎧が捻じれないようにしています。

鎧が好きなので、鎧のメッシュを作るのは楽しかった。アルみたいな中身空っぽの鎧アバターとか作ってみたいかも。

小物の作成
鞄や手袋、靴を作成。
手袋と鞄はやっぱり肌メッシュを複製して拡大。

腰に鞄が付いてるとアドベンチャーって感じがする。

剣と盾の作成
すごく単純なメッシュで作成。
細かい模様とかはSubstancePainterで入れようと考えていた。

剣と盾、あわせて30分くらいの単純さ

髪の毛の作成
頭髪の作成は以下を参考にしました。
http://blog.tsuno.co/2018/05/03/1525331437/

「Bsurface」といったプラグインツールを用いた作成方法です。
お絵かき間隔で髪の毛一束メッシュを作成できます。

SubstancePainterでテクスチャ作成
テキトーにUV展開した後、FBXファイルでエクスポート、SubstancePainterにインポートします。 SubstancePainterは体験版を使用しています。

読み込んだだけの状態

SubstancePainter にはデフォルトでSmartMaterialという適用するだけでそれっぽくなるマテリアルがあります。鎧にはちょっと汚れた鉄のマテリアル。服には布っぽいマテリアル。靴や手袋には革っぽいマテリアルという風に設定していくだけで・・・

はぁあああ、鎧の光沢がスゴイ鎧!(語彙力)

めっちゃかっこよくなった。SubstancePainter・・・恐ろしい子・・・!

自分でノーマルマップにテコ入れして凹凸を加えることもできるので、縦にそれっぽい凹凸をつけていきます。

単純なノーマルマップスタンプを盾に2種5か所押しただけ

デフォルトで用意されてるスタンプをポチポチするだけでこのクオリティ。なんて簡単なんだ・・・!

全体的に使い易かったですが、注意点があります。
テクスチャをエクスポートする際は、マテリアル単位でエクスポートされてしまいます。例えば今回、「皮手袋」、「長袖」、「ズボン」等を1枚のテクスチャにまとめています。Blender上ではこれらのマテリアルを分けて作業するかと思いますが、そのままSubstancePainterで使用するとテクスチャがマテリアル毎に何枚もできあがってしまいます。これについてはレベルマップを用いることで解決できます。詳細は以下参照。
https://note.mu/ig_k/n/n6649eea0c2c0

髪の毛用のテクスチャ作成
髪の毛のテクスチャは以下のサイトを参考に作成しました。

https://original-game.com/photoshop-hair-texture/

その後、作成したテクスチャに合わせてUVマップを調整します。

えらい無駄の多いテクスチャ・・・許してヒヤシンス

Unity上でアニメージョンオーバーライドの設定
物体オンオフのオーバーライドのを利用して、鎧兜をはずしたり、武器を取り出したりできるようにします。以下のサイトを参考にしました。

http://shiasakura.hatenablog.com/entry/2018/04/18/082930

アニメーションオーバーライドにより、兜の有無や抜刀⇔納刀を切り替えれる。

あとはVRChatにアップロードして完成!お疲れさまでした。

マテリアルの質感がVRChat内でもそのまんまだったことに満々満足。

ブースの作成

そして、バーチャルマーケットに出展する際は、売り物だけでなく、自分のブースも作成しなければなりません。
この自分でブースを作成できるところがバーチャルマーケットの良いところですよね。アバターの試着やホログラム表示等、バーチャル環境でしかできない展示方法を自分で作成できるのですから。
んで、私が作成したブースがこちら

武具屋をイメージして作りました。作成時間は7時間程だったと思います。

最初にBlenderでお店の外観モデルを作成。壁棚、武器棚、木箱を置いただけ。
これをUVマップを正規展開してFBXにエクスポート。ここまで1時間。

単純なフォルムのパーツ群をパパっと作成し複製。慣れたもんだね。

SubstancePainterにインポートして、とりあえずベイクします。ベイクすることでライティング(光による陰影)の反映と、後のエッジマスクに使用する、角度のマップファイル?を作成します。
その後、スマートマテリアルから木目調を選択。
あとは汚れ感を出すために、エッジ部分にマスクをかけて汚します。
手順は
①汚れ用レイヤー作成(汚れっぽいパターンを選ぶ)。

②①のレイヤーに黒マスクを追加する。
 レイヤーを右クリックで黒マスクを追加できます。黒マスクを追加することによって、①のレイヤーの内で、マスク画像の白い部分のみを表示させます。黒マスクを追加した瞬間は、マスク画像が真っ黒なのでどこも表示されません。次の③でマスクをかけない白い部分を生成します。

③add generatorでエッジ部分のみのマスクパターンを生成する。
 黒マスクを右クリック→add generatorでマスク部分を生成する機能を追加します。この操作だけではどういったマスクを生成するのか?が決まっていないのでまだマスクは真っ黒のままです。PROPERTIESタブから既存のマスク生成設定を選択します(Metal Edge Wear等)。後はこのタブ内の設定をいじくりまわすことで、どの程度の範囲を汚すのか?どの程度の角度の角までを汚すのか?等を詳しく変更できます。

以上の流れで角を汚せます。
この状態でテクスチャをエクスポートします。ここまでで2時間。
SubstancePainterってスゴイ。

角汚しが無いバージョン。
角汚しが有りバージョン。角が汚れてたほうがなんだかそれっぽい。

次はUnity上での配置作業。
Blenderで作ったFBXファイルを読み込み、そのマテリアルにSubstancePainterで作成したテクスチャを使用します。
後はモデル”小さな騎士”とそのパーツ群を、それっぽいポーズを付けさせながら配置。ここまでで4時間半。

配置しまくってなんだかそれっぽくする。

最後に看板イラストや商品概要をはっつけて完成!
イラストは描いてもらいました。ありがとう(そるとりっぴ)!

大看板の右上が寂しかったので、何かのイラストで埋める流れになったのだが
何故かキリンで埋めたのが一番しっくりきたので唐突のキリン採用となった。

また、ここには表示されていませんが、アバターの試着をできるギミックが入っております。後は細かい修正等して計7時間程でした。
そして謎のキリン。

入稿締め切り10日前には入稿できてよかった!締め切り当日だと運営様への負担がものすごいでしょうしね。
はー、疲れた!バーチャルマーケット2が楽しみですね!
アバター自体が売れなかったとしても、これはいい経験になりそうです!

身体はUnityで闘争を求める② ライフルとミサイル

ライフルとミサイルを実装しました。

銃弾やミサイルをかっこよくする為にパーティクルと音をかっちょよくつけました。

それと、武器切り替えのシステムを実装しました。
ACVDの武器持ち替え型か、ACfaの背中武器切り替え型で悩みましたが
ミサイルやキャノンは背中についてたほうがかっこいい!という私の考えからACfa型になりました。とはいえ、欲張りに武器持ち替えも有りの武器6個持ちハイブリッド型に今後なるかもしれない。

武器入れ替えの今後の課題は、アニメーションの切り替えを滑らかに行うこと。
現状、狙い撃つときはFinalIKで動作し、アイドル中はアニメーションで動作している。そのため、アニメーションとFinalIK切り替え時の動作が不自然になってしまっている。これといっしょに、FinalIKによる腕の動きが瞬間移動になってしまっているのをなおしたい。どうしたら良いのだろうか・・・