Blenderで作成した孫以上の親子関係は他ソフトで位置ずれがおきる

今回はBlenderで出力したFBXをUnityにインポートしたところUnity側で位置ずれが起きていたのでメモ

はじめに

当記事は根本的なことが解決できるわけではなく、こういう問題があるよというメモ書き程度になります。

現象

３階層以上の親子関係がある場合Unity側で3階層目以降は位置がずれる。

以下のオブジェクトをBlenderで作成していました。

親子関係はこんな感じで多いところで最大4階層の親子関係があります。

これをUnityにインポートしたところ

親子関係は保たれていますが、孫以上の金具の部品は選択している位置までずれています。

この現象はBlender側で回転やスケールを適用して修正していても起こる問題です。

何故...？

解決方法

根本的な解決方法ではないですが、今回はBlender側で3階層以上の親子関係をやめることで解決しました。

3DSubstancePainter(SP)でも同様のことが起こっていました。

SPでは親子関係などいじれないため不便だと思ったので、今回はこの方法で解決しました。

調べ方が悪いのかこの問題に関する記事が一切でてこないので問題を共有するだけにとどめておきます。

時間があれば根本的な解決に向けてもっと詳しく調べた後追記しておきます。

BlenderとSubstancePainterとUnityを使ったモデル作成フロー

今回はBlenderでモデルを作成、SubstancePainterで色付け(Texture作成)

最後にUnityにimportするまでのソフト間ワークフローを実際にやってみました。

間にSubstancePainterがありますが、Blender→Unityへのフローだけが知りたい人でも見れるようになってます。ではどうぞ

環境

Unity 2021.3.16

HDRP 12.1.8

Blender 3.1.2

3DSubstance Painter 8.3.0(以下SP)

完成品

左：Blender後、右：SP後

汚れや表面の凹凸もSubstance Painterで簡単に作成できました。

それでは手順を解説していきます。

※モデルの作成方法やSubstancePainterでのペイント方法は解説していないので注意。あくまでフローやimport/export設定のみ

まずはBlenderでモデル作成

今回の記事を書くにあたって題材となるモデルが必要だったのでこちらの動画を参考にしました。

まじで簡単にできたのでおすすめ。

完成(Blenderのレンダリング結果)

Blenderのレンダリング絵作り下手すぎる...

エクスポートするための準備

モデルを最終的にUnityで扱うためにやっておくことがいくつかあります。

実寸にあわせる

現実に存在するものであれば、実際のサイズに合わせて作りましょう。

まずはLength(単位)をメートルに変更します(2.9あたりからはデフォルトでメートルだった気がしますが一応)

object選択モードに変更＞Nキー＞Item＞Dimensionsからサイズを調整します。

英語版を使っているのでわかりにくいですが場所は同じです。

サッカーボールは22cmなので「0.22m」に設定

原点をオブジェクトの中心にする

原点が正しい位置にない場合があるので原点をそのオブジェクトの正しい場所に配置する必要があります。

今回はボールなので原点をオブジェクトの中心にします。

Object＞Set Origin＞Geometry to Origin

合わせて読みたい記事

Blenderで変更した原点はUnityでどう変わるのか

→執筆中 

スケールを1にする

Unityではスケール1にしておいた方が扱いやすいので今のサッカーボールのスケールを1に変更します。

Object＞Apply＞Rotation & Scale

マテリアルを設定

もし動画を見ながら作成していたらマテリアルを用意する部分まで説明されているので大丈夫だと思いますが、マテリアルはSubstancePainte側で個別に設定するために部分ごとに分けて設定しておきます。

今回はサッカーボールの白い部分を「soccerWhite」、黒い部分を「soccerBlack」という名前でマテリアルを割り当てました。

UV展開

SubstancePainterではUV展開したモデルの頂点などを編集することができないのであらかじめUV展開して調整をしておきます。

編集モード＞全選択＞Uキー＞Unwrap

今回はシームつけなくてもUV展開うまくいきましたが、もう少し複雑な形のモデルの時はこちらを参考にしてみてください。

合わせて読みたい記事

シーム付けとUV展開が綺麗になるコツ - うにty生活

モデルをFBXでエクスポート

下図はBlenderからUnity向けにExportする出力内容になります。

一度Unityにインポートして大きさを確認してみました。

うん！いい感じ！

先にUnityで確認していた方が手戻りが少なくて済むかも。

Blender→Unityだけが知りたい方はここでおしまいです。以降SubstancePainterの作業になります。

SubstancePainterにImport

これでも十分にサッカーボールなのですが、ここからさらにSubstancePainterで表面の凹凸や縫い目、汚れなどを表現していきます。(SubstancePainter練習したいだけ)

ファイル＞新規＞テンプレート＞Blender

その後にファイルを選択して何も設定は変えずにOKボタン

読み込まれると画面はこんな感じ

画像右上で確認できますが、マテリアルもちゃんと分かれてる。

ここからSubstance Painterで作業を行っていきます。

SubstancePainterでTextureを作成したのがこちら(料理番組かな？)

Before

After

初めてのSubstancePainter作品ですが、ブラシでモデルをへこませたりしてNormalが簡単に作成できるのは超楽しいです。

ここからが本番。この状態をUnityでしっかり再現できるかどうかです。

Textureをエクスポート

ファイル＞テクスチャを書き出し

ひとまず試しにUnityHDRP向けの出力テンプレートがあるのでそれで出力してみます。

結果からいうとHDRPならばこの出力方法で問題なく使えました。

簡単に説明すると

左側：テンプレートリスト(自分で新しく増やすことも可能)

中心：出力される名前とチャンネルのリスト

右側：書き出せるマップのリスト

となっていて中心の色と右側の色はリンクしています。色のついてあるマップを出力するということになります。

アルファ、メタリック、ラフネス、AOはグレースケールなので

RGBAにそれぞれ情報を持たせることができるみたいですね。UnityのLitShaderではこのまとまったTextureはMask mapと対応しています。

今回これが知れただけでもでかい

そして罠なのが設定に戻って出力テンプレートを指定の選択しないとさっきのUnity用だったり自分で作成したテンプレートが使えないということです。

右下の書き出しを押して書き出し後、以下のテクスチャが書き出されました！

UnityにTextureをimport

サッカーボールのMaterialにTextureを設定していきます。

Texture設定前のLitMaterial

そもそもFBXインポートしたときにマテリアルないんだけどって人はimportしたModelを選択＞Materials＞Extract Materialsを押せばマテリアルが作成されます。

読み込んだNormal mapのみInspectorからTexture Typeを「Normal map」にしてあげる必要があります。

各TextureをLitMaterialに設定

完成

←Before After→

汚れとか表面の凹凸が再現できました！

モデルの隙間から若干床の色が見えているのは、LitShaderのDouble-Sidedを有効にするとわからなくなります。まあ今回そこまで気にならないので放置します。

これからもSubstancePaitner活用していきます！

それではまた

シーム付けとUV展開が綺麗になるコツ

 

 

どうもラブヘイトです。

UV展開、綺麗に展開されたら超気持ちいいです！

メッシュを作成してTextureを設定したんだけど、Textureが変な方向向いてる！？

こんなことありませんか？

それ、UV展開で直せます！(CMっぽくなった笑) 

今回はそんなUV展開について、私が綺麗にTexture適用できた時の方法を書き残していきます。Blenderの初心者向け記事です。

環境

Windows10

Blender 2.8

今回のモデル

このモデルを例にして話を進めていきます。当記事ではカフェボードと呼ぶことにします

UV展開とは？

メッシュを平面に展開することで、どこの面にTextureのどの部分を割り当てるか決める作業です。

Editモード＞Aキー＞Uキー ＞ UV展開(unwrap)その後

UV Editingのシーンに切り替えることで展開されたUVが見れます。

展開前

木目が斜めであったり、ぼやけている部分があるのがわかります。

UV展開結果

UV展開のUVはXYの代わりで、何かの略称ではありません。

また、ツールによってはY軸とZ軸が逆だったりすることも関係あるのかなと思います。

シームとは？

UV展開時の面同士を区切るためにマークする、アタリのようなものです。(赤い線)

UV展開時に辺にシームをマークしていると、マークした部分が切り離されて展開されます。

先ほどUV展開した画像を表示しましたが、既にカフェボードの上部にシームをつけた状態でした。

シームを適切にマークすることで、UV展開時に上記のようにメッシュが綺麗に展開されて作業が行いやすくなります。

逆にシームなしだと、潰れているところや、そもそもTextureを割り当てたいメッシュを正しく選択できません。

シームの付け方

辺選択して、control + E ＞ mark seamを行うことで、シームをつけることができます。

それでは次にUV展開する際のコツを紹介します。

UV展開のコツ

以下の画像はUV展開や再配置など行わずに、Textureを適用しただけの状態です。

上記の画像でどこが良くないかわかりますか？

一つずつ見ていきましょう。

ポイント１：シーム付け

シームをつける際のポイントを解説します。

例えばこのカフェボードの木の枠に注目。木目がバラバラです。

赤色の部分は横の木目、青色の部分は縦の木目にしたいとします。

木目の向きが異なるので、ここは別々に展開されるようにシームをつけて囲みます。

シームをつけた結果はこんな感じ

以下の画像は上記モデルをUV展開しただけの画像です。

そしてシームをつけてUV展開したことで、Textureの割り当ても変化します。比較してみましょう。

ポイント２：展開されたメッシュの大きさや、方向を均一に調整する

シームをつけたとしてもUV展開は自動的に行われるため、割り当てたTextureが拡大されてぼやけていたり、細かくなりすぎていることがあります。

そのため、テストTextureを利用して大きさを調節します。

マテリアルにTextureを適用する場合、マテリアルを選択しShader Editor上で以下のようにImage TextureノードとPrincipled BSDFのベースカラーを接続します。

このImageTextureの割り当てをUntitledに変更することで、グリッドと英数字が描かれたテストTextureが割り当て作業しやすくなります。

テストTextureの英数字やグリッド線がくっきりと表示できる大きさを目安に修正していきます。

その作業を行いやすくするために先にポイント3を見ていきます。

ポイント3：おすすめの画面構成

最後に私がUV展開作業しやすいと思う画面構成を紹介します。

左にメッシュ編集モード、右にUV Editorです。さらに、UV Editorの「UV Sync Selection」は無効。頂点選択モードにします。

こうすることで作業中に選択したUV展開したメッシュが、モデルのどこと対応しているか一目でわかるようになります。

UV Sync Selection有効の場合全体が見えるのは利点ですが、

頂点を選択した際に意図した場所だけが選択されません。UV展開した場合頂点は重複するためです。UV Sync Selectionは無効にしましょう。

ではこの画面構成で展開されたメッシュの大きさを調節します。

最終的に以下のようになりました。

色味を少し訂正して、完成したのがこちら

どうだったでしょうか？役に立てば幸いです。

ではまた

【Blender→Unity】Unity側のNormal mapの適用方法 #35.1

どうも、ラブヘイトです。

BlenderからUnityにモデルをインポートした際に、

・Normal mapはどうやって適用するの？

・Bleder側で割り当てていたUVmapはどこへ？など

いくつか疑問があったので、自分が行ってできた一例を紹介しようと思います。

利用するモデル

まずはBlender側から

今回はこちらのモデルを使います。

街灯の窪んでいる部分が、Normal mapの適用されている箇所です。

これをUnity側に持っていった時も適用したいというのが、今回の課題です。

BlenderでのNormal mapの作成方法がわからない方は、過去記事に書いています。参考にしてみてください

【Blender】UV mapの一部にだけNormal mapを適用する方法 - うにty生活

作成したモデルの前提

オブジェクトの一部にNormal mapを割り当ててる(以下Normalオブジェクト)

つまり1つのオブジェクトの中でNormal mapを割り当てる部分のマテリアルは分けている状態

また、全ての箇所に仮でもいいのでマテリアルを割り当てといてください。

Unity側でオリジナルのマテリアルを設定するのに必要です。

UV mapは二つ存在

一つはベタ塗り用、一つはNormal map用です。

 ※ 上側の画像背景はnormal mapですが本来は透明です

Normalオブジェクトのshaderはこんな感じ

エクスポート 

この状態のモデルをエクスポートします。

エクスポート設定は以下の通り

ミニTips

エクスポート設定はいちいち覚えておくのも面倒なので、プリセットとして覚えさせておくことをお勧めします。

そしてUnityにインポートします。

ミニTips

人によって違うとは思いますが、マテリアルはBlenderから運んできても、色味が違うので自分はそもそもBlender側では本気でShaderいじらないです。こんなもんかなーと確認が取れたらもう出力しちゃって、Unity側でガッツリShaderいじります。

Unity側の設定

インポートしたモデルのマテリアルをUnity側で設定する場合

インポートしたオブジェクト＞Inspector＞Materialからマテリアルを設定して

ApplyすることでUnity側のマテリアルをモデルに簡単に割り当てることが可能です。

normal map用のマテリアルもここで割り当てます。

※Blender側でマテリアルが割り当てられてないまま、Unity側にインポートするとインポート設定で出てこなくなるので注意

normal map用のマテリアルを作成していきます。

と言ってもめちゃくちゃ簡単です。

Normal mapのShader作成

Blenderで作成したTextureはBlenderエクスポート時にCollectionとして一緒に出力してもいいし、画像を保存しているなら手動でインポートでもどちらでもいいと思います。

Create ＞ Shader ＞ HDRP ＞ Lit Graphで新しいShader Graphを作成。選択した状態でCreate＞MaterialからShader Graphが割り当てられたMaterialを作成します。

Sample Texture 2Dノードを利用する方法とNormal From Textureノードを利用する方法、2つあります。どちらもTextureにNormal mapを設定するのは同じです。

それぞれの結果を見てみましょう。まずはNormal From Textureから

近くで見た時

遠くで見た時

なぜかぼやける...

次にSample Texture 2D

近く

遠く

かなり遠くからでも窪んで見えるため、Sample Texture 2Dを採用

もしかしたら、Normal From Textureの使い方が悪いのかもしれないが今回は体験談ということでよしとしましょう。

今回はここまで、ここまで見てくださってありがとうございました。

【Blender】UV mapの一部にだけNormal mapを適用する方法

Blender上で、Normal mapの作成から適用までを行ってみたので書き留めておきます。

今回作成するオブジェクトはこちらの街灯です。

この街灯の、ひし形に彫られているように見える部分はNormal mapで再現しています。

多分このくらいのことはメッシュでいいやんって例題ですが、今回はNormalを作成するための練習としてこの題材でいきます。

環境

Blender 2.8.2

Materialの割り当て

まずNormal map適用範囲と非適用範囲で、割り当てるMaterialを分けます。

Normal map適用部分を選択し、New＞Materialを追加してアサインします。

名前は全体Materialを「town-light-base」、Normal適用部分のMaterialを「normal」としました。（わかりやすくするため、一時的に「town-light-base」の Colorを変更しています）

Normal Map作成

Normal map作成は以下の記事を参考にしました。しかし、ただのPlaneを利用すると後でNormal map適用時に歪んだりするので、元のオブジェクトの形状から作成しました。

参考リンク

Blender ノーマルマップ作成・出力方法 - TomoGのごちゃまぜ倉庫

準備

まずはNormal mapを適用したい部分だけ選択してShift + Dで複製し、取り出します。

選択する部分は先程、違うMaterialを適用する時に選んだ面と同じです。

Pキーから複製オブジェクトは違うオブジェクトにして、元々のオブジェクトはHキーで隠して作業を行っていきます

あとは紹介記事のように、効果を適用させるためのオブジェクトを作成して、平行になるように配置します。(当ブログでは既に作成しています。)

UV展開

台形のオブジェクトをUV展開します。が、その前に

プロパティ ＞ UV Maps ＞ 「+」UV mapを新規作成します。

名前は「normalUV」としました。（後で名前使います。）

台形のオブジェクトのみを全選択。「normalUV」を選択後、UV Editorに切り替えて

「+　New」で新しい画像を作成。Uキー＞展開でUV展開します。

おそらく、一度でもUV展開をしている方は前の展開結果が一緒に存在しているかと思います。

これは必要ないのですが、消すことができない(消せるかもしれないが知らない)ので、小さくして影響のない場所に配置します。

その後UV ＞ Export UV LayoutでUV展開した画像を保存します。

Shader 設定

ここからはtomoGさんとほぼ同じです。

「normal」Materialを選択し、Shader EditorでTexture nodeに配置

先ほどエクスポートした画像を設定します。

ベイク

設定を以下のようにしてベイクします。

 

Normal mapができました！

Normal mapを作成するために作成したメッシュなどはもう必要ないので削除するか非表示にしてください。

Normal Map適用

ここからNormal mapを適用していきます。

まずOpenから先ほどのNormal mapを開きます。

「normal」Materialを選択してShader Editorへ切り替えます。

ノード配置をこのように設定します。

完成

失敗例

一応Normal mapを作成することができましたが、結構手のかかる作業なので「今回はこのようにしてできました」というだけのベストプラクティスとかではないです。

これにたどり着くまでにいくつか失敗したので、見ていきます。

UV mapにペイントする方法

ペイントツールでUV mapにペイントした後、NormalMap-Onlineで作成する方法です。

ジャギがひどく目立つので却下。２色でペイントしたのがよくなかったかもしれないです。2色の境界をぼやかせればうまくできるかもしれません。ただ今回はダメでした。

Photoshopで作成する方法

Photoshop持ってないので無理

UV mapにベイクする方法

今回みたいにNormal map作成用にいちいち、平面を用意したりMaterialを分けて登録するなど面倒だと感じていたので、

全体のUVmapにベイクしちゃえばいいじゃんと思ってベイクしてできたのがこちら

このNormal map、結局Shaderから適用したところ、ただオブジェクトが汚れるだけでした。

まとめ

記事には書きましたが、まだ面倒だしいい方法だとは思ってません。

もっとこうした方がいいよ！など意見があれば参考にしたいのでぜひコメントかTwitterにお寄せください。よろしくお願いします！

参考にさせていただいた方々、大変助かりました。ありがとうございます。

適当に完成させてみました。

それではまた、

【Blender2.8】Bevel Node 使ってみた

書くことがないわけではないのですが、今はゲーム制作に専念してるため

最近は勉強がてらShader Node簡単にまとめてます。どうも、ラブヘイトです。

Bevel

Input > Bevel

Bevelはモディファイヤーからも追加できるし、ショートカットからも使えるので説明はいらないかな？

簡単に言うと角を丸くする機能です

Bevelノードを利用するとRenderingが遅くなるんので注意です。

また、Cycles Reder のみ利用できます。

Bevel Node なし

Bevel Node 有り

す、すげぇ......

でもリファレンス程ははっきり丸みがわからない、

どうやってやってるんだろ

出典:

https://docs.blender.org/manual/en/latest/render/shader_nodes/input/bevel.html

モディファイヤーとの違い

Bevelノードで適用するベベルは実際のメッシュに変化は有りません

メッシュは正方形のままです

Shader Editor

Property

Radius

0~1というわけではなさそうですが、1より低く設定しないとほとんど角が取れているのがわかりませんでした

Radius = 1

Radius = 0.2

おまけ

おまけは記事書くためにBlender触ったときに学んだ副産物的なもの書いていきますね

今日はこの粉末についてCycles Renderのモード前提で話しますね

この粉末はノイズというらしい

ガラスなどの素材を作成するとRenderingのプレビューモードで起こるみたいです。

どんなオブジェクトでも多少は存在するみたい

で、これを取り除いてくれるのがDenoising(デノイズ)

Denoising(デノイズ)にチェックを入れてRender > Render Imageからレンダリング すれば、徐々に消えていくのがわかります。

ちょっとレンダリング 風景楽しいなと思っちゃいました笑

ということでまたね

【Blender2.8】Ambient Occlusion 基本的な使い方

 久しぶりです、ラブヘイトです。

Shader Editorの全ノード解説を一つにしようと思ったのですが、

調べてたら一つのノードで書く内容が多くて分けました。

基本自分用なのでノード内の設定項目は主観で頻繁に使いそうなものだけ書きます。

Render Engine EeveeとCyclesとも比較します。

Ambient Occlusion(AO)

Input > Ambient Occlusion

AOを適用するノードです。このノードを利用するにはRender EngineでAOの利用を有効にします。

AOなし

AOあり(Cycles)

AOあり(Eevee)

有効化

Eevee

Cycles

AOノードを配置する場合は基本的にはColorRampと同時に配置します

Shader Editor

設定項目

※AOのプロパティはCyclesだけで利用できます。

samples

値が高いほどAO適用箇所が濃く表現されます。

AOが適用される範囲が広くなる、が正しいかもしれません。

AO Textureがある場合

OverlayをBase Colorの前に配置して

Invertのところはalbedテクスチャやベースカラーを設定すればAOとブレンドできます。

変な場所にAOが適用されない限りは、用意されてあるAOノードを使えばいいと思います。

他に書きたいことがあれば随時更新します。

焚き火のアニメーション作ってみた！【Blender→Unity】 #30

どうも、ラブヘイトです

今回はBlenderで複数オブジェクトのアニメーションを作成してUnityで動かしていこうと思います

題材はサバイバルゲームとかでよくある、焚き火を作成していきます！

え？なんとなくですよ笑

バラバラの素材が集まって焚き火ができていくようなアニメーションなので

他にも応用できるかと思います

◆木材作成

モデルに関しては全てblenderで作成しています。

この方の記事を参考にTexturehevenからダウンロードできるTexture設定を行いました。Texturehevenには加工済み木材はなかったので適当な木材のタイルをダウンロードしました。

参考

Blender テクスチャを利用したリアルなマテリアルの作り方【PBR】 - TomoGのごちゃまぜ倉庫

Textures: All | Texture Haven

ちなみにこの木材のShader Editorはこんな感じ

 ◆石作成

石はこの方の記事を参考

Blenderで石を作るチュートリアルを試す（１） | ぬの部屋（仮）

Blenderは初心者すぎるので、自分が工夫して調節っていうのはもう少し先になるかと思います。

Unityにモデルを持ってくるときは、ベイクを行ってレンダリング結果を直接Textureに焼き込みました

◆Textureのベイク方法

参考：

Blender レンダリング結果をテクスチャにするベイク - TomoGのごちゃまぜ倉庫

すごくお世話になってる... 

普通にベイクすると大体暗いTextureになってしまうので、

Lightをモデル全体に均一に当たるように配置してからベイクを行いました

◆アニメーション作成

Unityでアニメーションを作成しようと思っていたのですが、

UnityはBlenderほどオブジェクトをグリグリ動かせないのでBlederで作成することに

今回は散らばっているところから集まって焚き火が完成するようなアニメーションにしたかったので、コツはずばり「適当さ」です(どやっ！)

File > Append から 木材と石を持ってくる

そうしたらまず組み合わせて完成形を作成

ドープシートを開いてフレームの最後の部分を選択し、完成した焚き火のキーフレームを挿入(オブジェクト全選択＞ 「Iキー」 ＞ LocRot )

今回スケールは変えないのでpositionとrotationだけをキーフレームに登録しました(重くなるからね)

次に１フレームに移動したら

あとは適当に散らばせるだけ！！笑。そしてキーフレームを登録

上から作業するのがおすすめ(７キー)

とはいっても最初と最後を登録しただけでは直線的な動きになってしまうので、

中間で少し浮かせたり、回転を加えてたり、スタートずらしたりと

引き寄せられてる感じを表現しました

グラフエエディターとかも使ってみたかったんだけど、この有様だったのでやめました笑

◆Unity用にエクスポート

ここをうまく設定するのに結構時間がかかりました

ボーンのアニメーションを出力するわけではないので、取り扱いが違います

 ボーンアニメーションのエクスポートはこちら

【Blender】→【Unity】Unityちゃんのアニメーション作成してみた #19 - うにty生活

fbxとして出力するのは１フレーム目のバラバラの状態で出力します(後で説明)

注目すべきはAnimationの設定

色々試した結果Baked Animationは必須。これにチェック入れていないとそもそもアニメーションが出力されない

最初は全てチェックされているのでこれらのチェックを外してください

・ Key All Bones

・ NLA Strips

・ All Action

※これらを外さなかったら、アニメーションがたすき掛けのように大量に出力されてしまいます。扱えたものではありません(私のunityでは重すぎて死にました)

チェックを外したら、出力！

Unityにインポートしたらこんな感じです

きちんとアニメーションがひとつになっていますね

配置してアニメーションを再生

◆パーティクル

パーティクルで炎を作成します

静止画だと炎なのに角ばってますね笑

Textureを使うのですが、いい感じのCloud Textureがなかったので「ibispaint」というアプリで適当に作成しました。どうぞご自由に使ってください

設定

Render Materialに設定するマテリアルですが、Create > Materialで新規マテリアルを作成して、shaderをMobile > Particle >Additive にします

◆Haloを追加

完成しました！がもっと空間的に明かりが欲しいので

Haloコンポーネントを追加

どっちがいいんだろ...

◆組み合わせる

Blenderからエクスポートしたアニメーションは編集ができないので、

スクリプトでアニメーションと炎パーティクルを組み合わせていきます

先ほどのhaloとパーティクルをあらかじめ追加しておきます(setActive=false)

次に焚き火にスクリプトを追加します

gist99074be1c0823b06ddbf60aac06a6e7f

nomalizedTimeでアニメーションが終わったことを取得してます

Animator

時間がかかりましたがなんとか完成しました！

思ったよりうまく作れて嬉しいです！

【Blender】文字をオブジェクトにしてみた #26

どうもラブヘイトです

検索してて偶然このブログにたどり着いた方、いらっしゃいませ！

いつもみてくださる方、お世話になっております！

Unityちゃんを生活させているこのブログ

「うにty生活」と言います

このブログタイトルを常にどこかに置いておきたかったで

今回は、タイトルをかっちょよく3Dオブジェクトにしていきます！

現在ヘッダー画像が薔薇なのですがこのブログと何も関係がないため

ついでにいい感じのヘッダー画像が撮れたらいいなと思ってます(笑)

最終的にこんな感じのネオン演出したい

ネオン風にするのは次の記事で分けて書きます↓

未完成

今回はBlenderで文字をオブジェクトにする回です 

◆テキストオブジェクト作成・文字編集

メッシュ作成(Shift + A)  | テキストを選択

デフォルトでは寝ている状態なので、起こします（Rキー＞ X ＞ 90 入力）

編集モード(tab)に切り替えることで文字が打てるようになります

※この状態ではまだメッシュは編集することができません

◆テキストプロパティ

メッシュにする方法は後述しますが、メッシュにしてしまったらフォントなどの設定ができなくなるので先に設定してしまいます

テキスト特有の設定４つ

・ジオメトリ

・フォント

・段落

・テキストボックス

◆ジオメトリ

ジオメトリは、テキストオブジェクトの奥行きや幅を設定できます

【標準（何もしてない）】

【オフセット】

【押し出し】

【深度】

【解像度】

深度の角が取れた状態。結構かわいい

◆フォント

今回はネオン風にしたかったので、ネオン風フォントを追加

日本語のフォントについては、こちらの記事で紹介してくれています

というかここまでのことほぼ全て紹介されてます↓

【Blender】3Dな文字の作り方【テキスト】

「せん断」という項目で少し傾けてこんな感じになりました↓

せん断って翻訳じゃ最初わからなかったです...... 

◆テキストボックス

テキストボックスを追加

四角のままではダサいのでメッシュオブジェクトにした後に

丸く調節します

◆メッシュオブジェクトに変更

「Alt + C」でメッシュオブジェクトに変更して、やっとメッシュを触れるようになります

テキストボックスも一緒にメッシュ化して、ベベルで角を取ろうと思ったのに

テキストボックス消えてました。なぜ？

◆完成

仕方がないので、自分で丸囲いを作成しました

あと配線みたいなものも欲しいなと思い

文字の後ろにもう一つ同じテキストオブジェクトをつけてみました！いい感じ

  ついでにもう一つありそうなやつ

「BAR」の文字で中身くり抜きました

 マテリアルうまくいけばいいけど・・・

ということで完成です！

最初この記事思いついた時は、Textをメッシュで頑張って作成しなければいけないのか......と思っていましたがまさかBlenderにこんなに素晴らしい機能があるとは

何はともあれ、文字をオブジェクトにすることはできたので次回はマテリアルを利用してネオン演出を頑張っていきます！

近日公開です。それではまた

 参考記事

・ 【Blender】3Dな文字の作り方【テキスト】

【Blender】→【Unity】Unityちゃんのアニメーション作成してみた #19

どうも、ラブヘイトです！

春が来ましたね！色々身の周りが変わる季節なのであんまり更新できてない(泣)

そんな中先月初めて400PV/月行けたので頑張らなきゃなと思っているところです

◆関連記事

【Blender】リギング ボーン編 #19.1 - うにty生活

【Blender】リギング基礎 ウェイト編 #19.2 - うにty生活

【Blender】リギング基礎 IK編 #19.3 - うにty生活

【Blender】リギング基礎 アニメーション編 #19.4 - うにty生活

Unityちゃんのアニメーションつけたい！

ということでしたね

◆Unityちゃんのアニメーションつける方法

Unityちゃんのアニメーションをつける方法は２つ(もっとあれば教えてください)

1.UnityちゃんをBlenderにインポートしてアニメーションを作成する

2.人型のボーンでアニメーション作成してUnityにインポートする

 1の方法

Unityちゃんをインポートした時に、顔がデカかったり

ボーンが突き出ていたりと色々設定が多いですが、実際にUnityちゃんが動いてくれるのでUnity側でアニメーションを動かした時に「これ違うな・・」ってならないです

2の方法

unityちゃんはunityでHuanoidとして自動判別できるため

humnoid型のボーンのアニメーションを作成してUnityにインポートすれば

そのアニメーション使うことができます

今回は２の方法でやっていきます

◆Blenderの準備

関連記事ではリギングのことを色々学んできましたが

実はBlender側では人型のボーンを用意してくれています

ユーザ設定＞アドオンから〜にチェックマークを入れて

Shift＋Aキー＞アーマチュア＞Humanoidを選択してボーンを配置します

 ◆アニメーション作成

アニメーション作成は前回の記事を参考にして思うように作成してみてください！

ただ、用意されてあるヒューマノイド型のボーンはデフォルトでIKが設定されていないので関節を一つずつ動かすようになります

IKについて↓

【Blender】リギング基礎 IK編 #19.3 - うにty生活

アニメーションについて↓

【Blender】リギング基礎 アニメーション編 #19.4 - うにty生活

 私はこんな感じに扉を開くアニメーションを作成しました

できたらUnityの指定フォルダに保存しましょう！

アニメーションを選択します

メッシュをエクスポートする時のような設定は一切なし！楽チン

◆Unity側の準備

 Unityのプロジェクトファイルに先ほどエクスポートしたBenderファイルを入れたら

こんな形で表示されます

この中に先ほど作成したアニメーションが入ってます

このアセットを選択してインスペクターで設定をします

Rig>Animation TypeをHumanoidにして一度Applyしてください

Configure...にチェックマークが入ればHumanoid型と認識されているということです 

UnityちゃんにつけているメカニムのステートにMotionを追加すれば完成！

ワタシタンゴワカラナイネって人はこちら↓

Unityちゃんを実際に歩かせてみる 後編 ＃３ - うにty生活

今気がつきましたがMotionの名前おかしいですね・・・
 

できた！

ドアを開けるモーションの後は待機モーションに切り替わってます

◆まとめ

キャラクターのアニメーション作るのは大変なイメージでしたが、やってみれば案外簡単でした！

今回は大丈夫でしたが、BlenderのボーンとUnityのキャラクターのボーンの位置がずれていることがあるようです

詳しい説明は割愛しますが、

そういう時にはconfigure...から直せるそうです！

ではまた

はてなブログしてる私ですが、お世話になっている記事はだいたいQiitaです笑

Qiitaはシンプルで見出しや文章も、スッと入ってきやすいです

実際自分のブログちょっと読みにくいなと思っていたので

前までド派手な見出しにしていたのをちょっとシンプルにしてみました！

あと、やっぱり背景は白が見やすいので白に変更しました

本当は文章書いてあるところは白で、他は色変えたいのですがやり方わからぬ

ということでブログ自体も色々成長してます

--------------------------------------------------------------------------------

※当ブログにおいてナンバリングはあまり関係ありません 

私とブログの成長記のようなものです

【Blender】リギング基礎 アニメーション編 #19.4

どうもラブヘイトです！

今日はリギング最後のアニメーションとなります

自分もすぐ忘れちゃいそうなので基礎的な部分もまとめていきます

前回までの流れ

 項目ごとにわかりやすくまとめています

◆アニメーション作成

今回例として作っていくのは闇ちゃんの手をあげるアニメーションです

Blenderのアニメーションはキーフレーム方式でタイムライン(時間軸)に姿勢(キー)を挿入することでその間の動きは補完してくれます

簡単な流れ

①アニメーション新規作成

②ボーンの姿勢を変化

③「Iキー」→「位置と回転」を選択してキーフレーム挿入

④次のフレームを選択

⑤②〜④を繰り返す

⑥再生しながら見直し

◆作成方法 

①ドープシートに変更、新規作成する

ここでの準備４つ

・新規作成する

・ドープシートのフレームを1に合わせる

 ・Fボタン押すの忘れずに！

・モードをアクションモードにする

＜モードの違い＞

・アクション：現在選択しているオブジェクトのキーフレームを編集できる

・ドープシート：全てのオブジェクトのキーフレームを管理する

②ボーンの姿勢を変更

ボーンのモードをポーズモードにして最初のポーズに合わせます

今回最初は直立にしたいので腕を閉じた格好が最初のポーズです

ポーズが決まったらマスターボーン以外のボーンを全選択（Aキーで全選択したのちShift+右クリでマスターボーンだけ解除）して「Iキー」で「位置と回転」を選択します③

これでドープシートに戻ったらキーフレームが作成されているので次のフレームを選択します④

今回は10を選択します

繰り返してまた②です

一気に手を挙げた状態にしてしまうと変な挙動になってしまうので途中の部分を作成する必要があります

２頭身なのでちょっと顔も傾けました

この状態でキーフレームを挿入します③

また今度は20フレーム目を選択して最後の姿勢を挿入します

再生(Alt+A)して見ます

いい感じ！

最後にフレームが多いのでタイムラインで終了の値を調節します

この場合22くらいですかね

 作ったアニメーションを連続して再生するNLAエディターもありますが、今回は使わないのでまた今度

◆気になった設定項目

 ・コマ割り再生

フレームを落として再生してくれます

私みたいにBlender重たいって人にはいい機能ですね

・コピー＆ペースト

Ctr+C：コピー

Ctr + V:ペースト

Shift + Ctr + V：反転ペースト

反転ペーストはよく使いそうですね

一応手動でもできそうなボタンを発見

今回はここまで

 やっぱりブログに書いているとやり方忘れないですね

ではまた

--------------------------------------------------------------------------------

※当ブログにおいてナンバリングはあまり関係ありません 

私とブログの成長記のようなものです

【Blender】リギング基礎 IK編 #19.3

どうもラブへです

今アセットがセール中なので近々買って、レビューする記事書きます！

前回に引き続きリギングです。今回はIKの設定をしていきます

IKって最初に聞いたときよくわからないし、あんまり関係ないだろうと思ってましたが

使って見たら結構簡単だしボーンの制御がとてもシンプルになりました！

◆IKとは

IK(Inverse Kinematics)は直訳すると逆の運動学、つまり逆運動法ということ

FK(Forward Kinematics)という制御方法もありこれは順運動法のことです

IKやFKはボーンに設定するものであり、子から親を制御するのか親から子を制御するのかという違いです(今回この2つ詳しい違いは語りませんてか知りません笑)

FKについては今回使わないのでまた記事にしようと思います

IKを設定したらこんな感じでボーンが黄色くなります↓

私の環境ではポーズモードでしか設定することはできませんでした

◆どんなメリットがあるの？

アニメーションを作成する際、足を動かそうと思ったらそれだけで太もも・すね・足の３つのボーンを動かさないといけません

そんな時にIKを設定していると少ないボーンで足をすべて動かす事ができるのです！

◆設定方法

他のブログではよく、足を想定して機能紹介しているので今回は腕を想定して書いていきます(ほぼ同じですが笑)

①Shift+A＞アーマチュア＞単一ボーン　でボーンを作成する

②編集モードにして押し出し（Eキー）でUpperArm,LowerArm,Handのボーンを作成する↓

③コントロール用のボーンを作成します作り方は②と同じように、名前は「ArmController」にします。この時Handの反対側に直線になるように作成するので

　Handボーンを少し傾けます↓

④次にArmControllerのボーンプロパティで接続のチェックを外し、親を空欄にします

⑤Handのボーンプロパティで同じように接続を外し、今度は親をArmControllerにします

⑥ここまでは準備でここからIKの設定になります。LowerArmを選択してポーズモードにして、チェーンみたいなアイコンからIKを選択します

今LowerArmが黄色くなっていたらokです

⑦画像の通り設定します。チェーンの長さは、IKで設定したボーンからの数だけ逆(親の方)にさかのぼって影響があります

これで自由に動かしてみてください

まだ肘が安定しないですね

⑧肘を安定させるためにもう一つIKを設定します。肘から押し出しでボーンを作成します。設定項目はこんな感じ↓

完成！

いただきますのポーズはこんな感じです

◆回転の制限

回転を制限することでより不自然な動きがなくなります

UpperArmのボーンプロパティのインバースキネマティクス(IK)でボーン一つずつを詳細に回転制限できます

初見面倒そうな設定だから別にいいやと思うかもしれませんが、触ってみたら視覚的に範囲がわかるので簡単に扱えましたよ！

これの制限はあくまでIKによって動かされた時の話なので、普通にRキーでは回転できます

今回はここまで

それでは

【Blender】リギング基礎 ウェイト編 #19.2

どうもラブヘイトです

書きたい記事がありすぎて追いつかない笑

今回は前回に引き続きBlenderのリギングについて書いていきます、ウェイト編です！

前回の記事↓

tubakihimelovehate.hatenablog.com

◆ウェイト付け

ボーンを一つ選択したのち、3Dモデルを選択してウェイトポイントから設定可能です

ウェイトはその名の通り重み付けです。ボーンと一緒に動く割合みたいなもので、上の画像で赤いところはボーン動きに合わせてに完全についてきます、青いところは全く動きません

こちらのブラシを使って塗っていきます↓

「F Draw」しか使いませんでしたが他のブラシも色々使い方があるのかな？

私は基本「F Draw」でウェイトを上下させて塗っていました

このウェイト付けかなり楽しい作業です笑

ボーンを動かしてもついてきていないメッシュを塗ると本来の場所に戻っていくのが楽しくて楽しくて！(変態)

◆自動ウェイト

最初は自動ウェイトという機能を使ってみました

やり方は　3Dモデル＞ボーンの順で選択し「control+P」のペアレント設定から

"自動ウェイトで"を選べばokです

これは自動で全てのボーンのウェイトを自動でつけることができます

なんてすごい機能なんだ！・・・最初はそう思っていました

そう、蓋を開けてみるとなんとウェイトがぐちゃぐちゃではありませんか！

こちらは他のボーンに指のウェイトがついてしまっている時の恐怖画像です

もしかしたら私の作成したメッシュがあまりにも下手だったから自動ウェイトがうまくいってくれなかったのかもしれません

結局全てのボーンを見直したので便利なのかどうなのかって機能でした

◆つまづきやすい点

ボーンの動きにメッシュがついてこない場合考えられる原因は２つ

１）ただ単にその部分のウェイトが設定されていない

２）気が付きにくいのですが関係ない他のボーンでウェイトが付けられている場合です

例えば青いのに動いている、赤いのに動かないというときはだいたい他のボーンでその部分のウェイトが設定されています

ボーンはそんなに数多くないと思うので一つずつ確認したほうが確実ですね

関係ない場所はすべてウェイト０のブラシで塗りましょう

◆便利機能

・グラデーション

Alt＋左ドラッグでグラデーションのように塗ることができます

これ私は知らずに手動でやってました笑

・面選択＋輪っか選択

私がウェイト編集で見つけたとても簡単に関係ない場所を塗りつぶす方法を載せます

今回例にするのはこういった状態↓ これは自動ウェイトの結果です（ぐちゃぐちゃ）

手のボーンにも関わらず、髪の毛や頭にもウェイトが適用されているのでこれを直していきます

＜やり方＞

①もしもミラーリング状態の場合ミラーリングを適用して外す

②オブジェクト表示をワイヤフレームにして、面選択にする↓

③cnotrol+左ドラッグで範囲選択

④ウェイトを０にして塗りつぶし

⑤すべて塗りつぶしたらHキーで非表示に

⑥3~5を繰り返し

⑦最後に「Alt+Hキー」で非表示部分を解除

この方法何がいいかというと見えない場所も塗る事ができる点です。髪などを厚み付けではなく、押し出しでボリュームを出している時などは見えない所にも頂点があるのでそういった時におすすめ！

今回はここまで！

それでは

-----------------------------------------------------------------------------------------

 ※「うにty生活ブログにおいて」ナンバリングに意味はありません

　私と、このブログの成長記みたいなものです

【Blender】リギング ボーン編 #19.1

どうもラブヘイトです！

Unityちゃんの新しいモーションを自分で作成しようと思い、まず練習としてこの間作成した金色の闇ちゃんで試してみました！

tubakihimelovehate.hatenablog.com

ところが！アニメーションの以前にリギングもできていなくて、それも意外と大変だったので今回ボーンについてまとめました

といってもメインの部分は他のサイトを参考にしているので、つまづいたところや

知らなくて損した便利機能をいくつか紹介します

まずは簡単な用語のおさらい 

◆リギングとは

リギングはアニメーションをつける工程のことで、ボーンを設定するスキニングやウェイト付け、IKというのはこれに含まれます(初めて知りました！笑)

つまりこれらの設定なしでアニメーションはできないということです。

◆スキニング

体などのすべてのメッシュが完成したらボーンを作成、これをスキニングと言います

ボーンは関節をのようなもので、これを3Dモデルつけルことにより、自然な動きが表現できます

◆アーマチュア作成

アーマチュアとはボーンの集合体のことです

アーマチュア作成はこちらの記事を参考にさせていただきました↓

krlab.info.kochi-tech.ac.jp

私は頭と髪だけでなく服も結合しちゃいました、普通体と一緒に服も動くからいいんだよね？きっと

◆ポイント

ポイントとしてはやはり、上の記事でも説明されていますが「ボーン」と「3Dモデル」両方に独立してモードがあるということです

ボーンのモード

ボーンを選択すると輪郭が水色にハイライトされます

オブジェクトモードは移動など

編集モードは拡大縮小・押し出しができます

ポーズモードはボーンを動かして実際にキャラクターを動かします

一応メッシュを選択した時との比較画像

これに慣れないと結構間違えちゃいます

◆アーマチュアの知らなきゃ損する便利機能

 ここで各アーマチュアやボーンの設定項目をまとめようとしましたが、やっぱり他の人がやってくれている作業をわざわざするのはナンセンスかなと思い、急遽使っておけばよかった便利機能に変更します笑

今回各設定項目は「Blenderの優しい使い方」という優しい使い方が書いてあるブログを参考に書いていきます

blender-cg.net

・スケルトン

レスト位置を押すと初期ポーズをいつでも確認することができます(本体のポーズが変わるわけではない)

・表示

ボーンのデフォルト表示は八面体です

そのためレントゲンにした時、終始邪魔だなあと思っていましたがスティックなどにするとサクサクすすめられるようになりました

・ポーズライブラリ

これを知らなかったのは本当に悔しかったですね

ポーズを保存することができるっぽいので、このポーズ試したいけど今のポーズ崩れちゃうなというときに使えます

◆ボーン設定

アーマチュアとは違い、個々のボーンに対しての設定になります

ボーン設定での便利機能は特にないですがポーズモードでよく使った機能を紹介します

・右クリックで回転

操作環境にもよりますが、Rを押さなくても右クリックで回転させることが可能です

ただし注意が必要でRキーのように軸を固定できないので

平面投影してから行ってください

・トランスフォームのクリア

ボーンの移動間違えた！って時にどうやって元に戻すんだろう？

って時に使えます。元に戻したいボーンを選択（すべてならAキーで全選択）してポーズメニューから　トランスフォームのクリア＞すべて　で元のいちに戻すことが可能です

また、位置だけや回転だけ直すことも可能なのでめっちゃ使えます 

今回は番外編みたいなものなので手短に終わりまーす

それでは

--------------------------------------------------------------------------------------

 ※「うにty生活ブログにおいて」ナンバリングに意味はありません

　私と、このブログの成長記みたいなものです

【Blender】Blender初心者、初めてのキャラモデリング #16

#2020/8/16に更新

まじでこの時Blender初心者すぎて下手すぎる.....

どうもラブヘイトです。最近はずっとBlenderしてました

今回はBlenderで初めてキャラモデリングをして、Unityへインポートした感想や、つまずいたところを紹介していきます

 ◆完成品(途中だけど)

先に完成した作品をご覧ください

ToLoveるの金色の闇ちゃんです

中学生くらいの時に好きだったのでこのキャラで練習しよってなりました

作成期間はほぼ１ヶ月です

と言っても時間にしたら50時間もかかってないです

◆準備から顔の作成

最初の準備や顔の作成はYoutube動画で学びました

「わにこ沼地辺境伯」さんの動画再生リストです

www.youtube.com

この動画はキャラを一人完成させよう！というコンセプトですが、

残念ながら顔の終盤で動画投稿がストップしています

ですがかなり丁寧で、始めるきっかけになることは間違いなし！

この動画のおかげで重要なショートカットキーが簡単に覚えられました

私は３面図が出てきたあたりで、「えっ・・そんなのかけねーし」って思いましたが

さすがわにこさん、用意してありました

キャラデザインだけは自分でしなければいけませんが、結構適当にしててもだいたいあってれば大丈夫でした

実際に使った三面図をお見せします

側面のやる気のなさw

実はこれアイビスペイントというスマホアプリケーションで手書きで書きました

それでも最初の画像のようなものができるってすごいですよね

だから絵心はそこまで必要ではないなと感じました(あるに越したことはない)

◆体・髪など

動画は顔で終わってしまっているためほかの動画を引き続き参考にして

続きを作成しました

www.youtube.com

この動画は早送りでキャラデザインをしていきます

正直早くて何をしているかは全くわかりませんが、私が見ているのは工程です

どこの部分を作成して、次はどこで・・というのがわかる程度でよかったのです

そのくらいにわにこさんの動画で基礎が身についていました

◆つまずいたところ

わにこさんの動画や早送り動画だけではもちろんわからない部分が出てきます

・手

「手」ですね。自分の手を見ながらバランスを取るのに手間取りました

私は適当に作ってしまいましたが、あとで調べるとこちらの記事に良い方法がありました

http://krlab.info.kochi-tech.ac.jp/kurihara/lecture/cg/BlenderWeb_Hayashi/html/modelingBody.html

・どうやってテクスチャを目に貼るのかという疑問

それはこの記事で解決しました

original-game.com

・まつげにマテリアルを適用する場面（本来は苦労するところではありませんが）

「黒いマテリアルをまつげに適用させたのになぜ反映されないんだ！」

とずっと考えていて

色々試行錯誤した結果自分では解決できなかったのでテラテイルで質問しました笑

結局解決方法は簡単なことでした、ソリッドモードだからマテリアルが適用されてなかったのです

・髪の毛

正直一番時間がかかったと思います

髪の毛の作成方法はいろいろあるのですが、私はUV球からEで押し出して厚みづけして

作成しました

◆BlenderからUnityへインポート

ここもつまずいたところですね

ボーンとかUV展開やらしてないのですがとりあえず現状をUnityに入れてみましが

Blenderのエクスポート設定やらテクスチャ関連が初見ではわからないですね

Unityにインポートする時テクスチャが反映されないのは知ってたけど

解決方法がなかなか見つからず、やっとこちらのブログの方法で解決できました！

ありがとうございます。幸せになりました

wbhappy.hatenablog.jp

何度かUnityにインポートした結果がこちら

Blenderでレンダリングしたのと全然違うし、全体的に光沢があってきm...

やば、この画像笑　ほんまに消したい(2020/8/16)

 ◆感想

初めてにしては、って感じですが

まだまだ課題がありますね、、、

でもとりあえず今回はBlenderでつまづいたところなので

課題の解決はまた次回の記事で紹介したいと思います

服作るのが一番楽しかった！

それでは