UE4の勉強記録

UE4の勉強の記録です。個人用です。

「Unreal Engine 4.xを使用してRPGを作成する」の足りない部分を作成する。アニメレンダリングについて4

<前文>

<もし安倍元首相暗殺事件が単独犯ではなかった場合>

これは単純な推測で証拠があるわけじゃないです。しかも私個人としては単独犯の犯行だと思っています。

それはこの暗殺事件こそが、攻殻機動隊で予言されていたStand Alone Complexそのものだと思っているからです。(これについては別枠で語りたいと思っています。)

しかし仮にこれが、組織犯罪で実行犯以外の巨大な組織が後ろで手を引いていたらと考えるのは次の暗殺事件を防ぎやすくするためにも行っておいた方が良いというのは事実です。

ので今回は、もし安倍元首相暗殺事件が単独犯ではなかった場合、

  • 背後にいる組織は何だと思うのか?
  • 何故その組織は暗殺をしたのか?
  • 次に暗殺されるのは誰か?

などについて考えています。

私が推測すると考えられる組織は以下の3つです。

  • 本命:アメリ
  • 対抗:中国
  • 大穴:韓国

日本の元首相を暗殺出来る組織です。これ位巨大な組織じゃないと一国の元総理の暗殺を計画実行する事は無理でしょう。という考えに基づいて選びました。

まずアメリカですが今のアメリカの大統領は民主党です。

前の民主党の大統領であるオバマ氏は安倍元首相を非常に嫌っていました。

それであんなに親日的だったオバマ元大統領が、安倍元首相が総理の時は必要な用事がない場合は全く日本に寄らない。という事態になっていました。

アメリカで10年間暮らした私が断言しますが、単に政治信条の違いでこれだけ嫌われるというのはアメリカではありません。

アメリカ人は兄弟、家族、友達の間でも信条や支持する政党が違ったりしていつも口喧嘩しています。しかしアジア人(当然日本人も含む)のようにそれが原因で絶交になる事はありません。(サイエントロジーとかいうカルト団体では子供が入信しないと親がその子を捨てたりする事があるらしいですが、これは極一部の話で一般的な話ではありません。)

これはオバマ元大統領が、安倍元首相、もしくはその側近がアメリカの重大な法律に違反する何か(例えば在日アメリカ軍基地の最高機密をロシアに流した。)に関係しているのを知って、自分がその事が原因で大統領から罷免されないようにするために距離をおいた。と考えるのはおかしくはない気がします。

そしてオバマ元大統領が現職の時に副大統領であったバイデン現大統領が、オバマ元大統領からその話を直接聞いて、安倍元首相、もしくはその側近が関係しているアメリカの重大な法律に反する何かが大問題になるとの結論にいたり、安倍元首相暗殺にゴーサインを出した可能性は考えられます。

ここでは、安倍元首相、もしくはその側近がアメリカの重大な法律に違反する何かが、アメリカ軍基地の最高機密をロシアに流した。事と仮定して話を進めます。

すると何故、トランプ元大統領の時は安倍元首相は何も問題なく付き合っていられたんだという問題も自然と解答出来ます。

それはトランプ元大統領を含む、右派の連中も共犯者(ロシアのスパイ)だった可能性があるからです。

英語が分からない人は知らないかもしれませんが、ロシアとウクライナの戦争で彼等は、公然とロシアの味方をしています。私はこれを見た時本当に唖然としました。

ただしアメリカの民主党が犯人であるには非常に大きな問題があります。

それはアメリカの民主党が暗殺なんて面倒くさい事を実行するのかと言う事です。

これはアメリカで暮らした事が無い人には良く分からない感覚なんですが、兎に角、民主党は何もしない党なんです。本当に何もしません。

例えばですが、今、民主党がやらないといけない事は学生ローンの免除なんです。

これ民主党はヤルヤル言っていますが、全然進捗していません。私が個人的に非常に期待していたAOC氏ですが、彼女は中絶問題にかかりっきりになってしまって学生ローンの免除にさける時間が全く無くなってしまいました。

これは仕方ない部分もありますが、私は非常に残念に思っています。

学生ローンの免除の話になった時にRedditに、借金して弁護士になるより高卒で土方になった方が儲かるみたいな話をする政治家や大金持ちの談話が載っていましたが、直ぐに論破されていました。これは統計的なデータを全く取っていない事実に基づかない話だったんです。でもそれが出来るのは、RedditのCommentを書いた人達が例え借金をしてでも大学にいって勉強したからなんです。

大学レベルの学力があると政治家や大金持ちの談話が嘘であるって見破れるんです。Fox Newsの戯言に騙される事も無くなる訳です。(因みにこれはアメリカの大学に限った話です。日本の大学は良く知りません。)

だから本当は凄く民主党に有利な話なのに、民主党ナマケモノが移動する速度位のやる気しか見せていません。

まあそう言う訳でアメリカの民主党が安倍元首相を暗殺した可能性を検討しましたが、例え「安倍元首相が在日米軍の最高機密をロシアに流した。」としても暗殺なんかしないと思っています。

ただ一つ不思議なのは岸田現首相が、全く暗殺に恐れていない事です。まるで犯人を知っていて自分は絶対狙われない事でも知っているような感じです。

そして岸田現首相は、ロシアとウクライナの戦争で真っ先にウクライナの支持を表明しています。のでアメリカの民主党からロシアのスパイと疑われる可能性が全くない存在なんです。

この場合、次に暗殺されるのは、そのロシア側のスパイと見なされる人になります。つまりロシアの支持を表明している議員が狙わる可能性があります。

次に考えられるのが中国共産党の極右です。

私は中国語は読めないので、外国語の文献は英語のみの情報ですが、安倍元首相が戦闘機に乗った時の写真が公開された時、その戦闘機の番号が731だったのが中国で政治問題化しました。

これは日本人には良く分からない感覚ですが、中国人からしたらこの人は中国人をバカにするためにわざとやっていると見られます。事実、安倍元首相が暗殺された時、中国のネットでは歓喜の声で溢れていたと聞いています。

それに追加してですが、英語の文献で旧日本軍の戦争犯罪を読むと安倍元首相のおじいさんである岸元首相が戦争犯罪人だった事や731部隊がどんな事をしたのかについて結構詳しく出て来ます。

これらの英語の文献を元に日本の戦争犯罪を学習した中国共産党内部の極右にとって、今の安倍元首相の存在は戦前の日本の復活と捉える可能性はあります。そして中国共産党にとって安倍元首相の存在は非常に危険であるとみなされ、暗殺を許可した可能性も考えられます。

この仮説が正しい場合ですが、もっと大きな事件が1,2年の内に起きると思われます。それは中国の台湾進攻です。その時に右派の強力な指導者であった安倍元首相が生きていれば改憲して日本も台湾側について中国との戦争に参戦する可能性は大いにあったわけです。

だから中国共産党としてもその芽を潰すために、安倍元首相を暗殺出来るのならしてしまいたいと思った可能性は0ではないはずです。

この仮説は全くの想像で例えば中国語が話せる人からしたらどれくらい信ぴょう性があるのかは全く分かりません。

この仮説が正しい場合は、次に暗殺されるのは安倍元首相の親戚でかつ台湾を強力に支持している政治家の誰かになると思われます。

最後にですが、今話題の元統〇〇会ですが、彼らが安倍元首相を暗殺した可能性もあると思っています。

これは安倍元首相が、側近に法律的にグレーもしくは完全に違法な行為をやらせる時は、自分で命令せずに側近に忖度させて自主的にさせて、その事が後で問題になったら勝手にやった。と主張して逃げ切ると噂されているのが理由です。

この噂が事実であるかどうかは、私には知る由もありませんが、もし事実ならば、元統〇〇会の幹部だって、今度は俺らの首が切られる番だと思う可能性はあります。

そうなった時に逆に殺してしまえ。位の感覚にはなるかもしれません。

この場合は、次に暗殺されるのは安倍元首相の関係者で、犯人が彼等であると知っている人達でしょうね。

まあこれも可能性としては凄く低いです。

色々書きましたが、実際はどれも信じてはいません。ただしこう言う事も考えておかないと万が一本当だった時に対応出来なくなります。そういう意味で頭の体操の一環としてやってみました。

それでは今週の勉強を始めます。

<本文>

1.今週の勉強について

今週も以下の内容についてやって行きます。

  • Niagara: CGHOW氏のTutorialをやる
  • Materialの勉強
  • RPGEventの作成
  • Open Worldの検証
  • Gaeaの勉強
  • 雪山のMapの作成
  • UI Designの勉強
  • Anime Renderingの勉強

2.Niagara: CGHOW氏のTutorialをやる

今週もUnreal Engine 5 Niagara Beginner Tutorial - UE5 Niagara Starter Course! [1]の続きを勉強していきます。

2.1 Unreal Engine 5 Niagara Beginner Tutorial - UE5 Niagara Starter Course! [1]の続きを勉強する

いつも通りTutorialの内20分だけ進めようとすると以下の内容をやる必要があります。

  • Beam Emitter
  • Light Renderer
  • Component Renderer
  • Event(LocationDeathCollusion)
  • Static Mesh Location
  • Skeletal Mesh Location

今週のNiagaraは、こんなに沢山勉強出来るんでしょうか?まあやれるとこまで頑張ります。

<Beam Emitter

Beam とRibbonの違い自体が良く分かってないです。

開始点と終了点の間がずっと繋がっているのがBeamで、開始点のParticleは時間によって消滅するので開始点と終了点の間が繋がっている時もあるし開始点のParticleは既に消滅して開始点と終了点の間が繋がっていない時もあるのがRibbonと解釈していますがそれで合っているんでしょうか?

Tutorialを見てみましょう。

まずBeamはTemplateにDynamic Beamが存在するのでそれを使用します。

開きます。

Previewです。

Emitterです。

ここでBeam Emitter内のBeamを作成するのに必要なModuleを一つ一つ解説していくのかと思ったら、このEmitterを消してEmptyのEmitterに変えてしまいました。

えっと思いましたが、仕方ないです。新しいEmptyのEmitterを追加しました。

Emitter Update SectionにBeam Emitter Setup Moduleを追加します。

うーん。

こんなModule使用した記憶がないです。

Beam Renderingって今まで勉強していなかったのかな。

一寸調べます。

Beam Emitter Setup Moduleに関する記述は2021-06-20 のBlog2021-07-11のBlogにあります。

どちらもTemplateを使用していて空のEmitterからBeamを作成してはいません。はっきり言うとこのModuleを何でここで使用しているのかは分からないけどTutorialにそう書かれていたからやりました。と言う事です。

後、この辺りのBlogで結構Beam Emitterを使用したEffectを勉強していました。ただしこのころはまだNiagaraの勉強を始めて間もない頃だったのでBeamとRibbonの区別もついていないまま勉強していたりとかしています。今読み直すと結構勘違いしている部分もありました。

そしてびっくりしたのが、この時に理解出来なかった事は今になっても理解出来ていません。

次にEmitter Update SectionにSpawn Burst Instantaneous Moduleを追加します。

Beam Emitter Setup ModuleをSpawn Burst Instantaneous Moduleの前に移動させます。

うーん。これは絶対しないといけないのかその辺は良く分かりません。

Particle Update SectionにUpdate Beam Moduleを追加します。

そしてParticle Spawn SectionにSpawn Beam Moduleを追加します。

すると以下の様になります。

更にRender SectionのSprite Renderer Moduleを外してRibbon Renderer Moduleを追加します。

Beam Emitterは専用のRendererがなくRibbon Renderer moduleを使用します。

Ribbon Renderer ModuleのMaterialにはM_Meshをセットします。

結果です。

うーん。細すぎる。

と思ったらしっかり次でBeamの幅を管理する方法を説明していました。

Particle Spawn SectionにBeam Width Moduleを追加します。

結果です。

うーん。今一ですね。

微調整して以下の様になりました。

以上だそうです。

うーん。

Beamの基礎は理解出来ました。

正直Beam Effectに関してはああだこうだ言える程勉強していないので、これを足掛かりにしてもう一回勉強します。

<Light Renderer

はい。

これって何のためにあるのか一番不明のRendererです。

Lumenが備わってから普通のStatic MeshのMaterialのEmitter値を非常に大きくして光らしてもGlobal Illuminationが生成されるようになりました。ので敢えてLight Rendererを使用する必要は全くない気がします。

まずこのTutorial通りにやってLight Renderingのやり方を復習します。その後で、Light Renderingを使用した場合とそうでない場合の違いについても検証します。

Fountain Emitterを使用します。

Renderer SectionにLight Renderer Moduleを追加します。

これをLevel上に配置します。

Light Renderer Moduleの影響は全く見えません。

しかしParticle Spawn SelectionにあるInitialize Particle Moduleの

Colorの値を以下の様に1より大きくして

更にRender SectionにあるLight Renderer Moduleの

Use Inverse Squared FalloffのCheckを外します。

すると以下の様に地面にLightの明かりが投影されます。

はい。

これってLumen使用したら同じ事をLight Renderer使用しなくても出来るんじゃない。と思っています。後でこれは試してみます。

Particleは光らせないで地面に反射光だけ表示する事も出来るそうです。

Particle Spawn SectionにあるInitialize Particle Moduleの

Colorの設定を元に戻します。

そしてRenderer SectionのLight Renderer Moduleの

Color Addに以下の値を追加します。

すると以下の様にParticleの色は赤のままで地面の光っている色は緑になります。

暗くした場合の画像です。

またLight Renderer Moduleの以下のボタンをClickする事で

Bindingsに以下の表示をさせ、それぞれのBindingに新しいParameterをセットする事も出来ます。

試しにColor Bindingに新しいParameterをセットしてみます。

Particle Update SectionにSet Parameters Moduleをセットします。

+ボタンを押してLinear Colorを追加します。

名前を変更します。

分かり易いようにMy Color Blueとしました。そしてBの値を3にしました。

そしてLight Renderer Module のColor Bindingに先程作成したParameterをセットします。

結果です。

あんまり青くないですね。

Set Parameters ModuleのBの値を100にしました。

結果です。

地面の反射光が青くなりました。

確かに地面の反射光の色を変更するのは、Light Renderer Moduleを使用しないと出来ないですね。

この辺がLight Rendererが必要な部分なのかもしれません。

<Component Renderer

次はComponent Rendererです。

これはほとんど勉強した事ないです。

これ用の新しいNSを作成しました。

FountainをTemplateとして追加しています。

Render SectionのSprite Renderer Moduleを消してComponent Renderer Moduleを追加します。

Componentをセットします。

Componentなら何でもセット出来るのでほとんど全てがセット出来ます。

例えば先程作成したLight RenderingのNiagara SystemをComponentとしてここにセットする事も出来ます。

その場合は、Component TypeにNiagara Componentをセットします。

そしてNiagara System Assetに先程作成したNSをセットします。

結果です。

NS_Lightが沢山現れています。

がどういう理屈であらわれたり消えてたりしているのかは良く分かりません。

分身の術のやり方が分かったら勉強する事にします。

<Event (Location、Death、Collusion)

今度はEventについてです。

おお。既に結構疲れています。これからEventについての復習もやるとなると最後までやるのは結構きつい気がして来ました。

まず軽く見ました。

Eventの使用方法の解説をしながら非常に簡単な花火を作成しています。

花火か。

そう言えばNiagaraを勉強した最初の目的は花火のVFXを自分で作成する。でした。

今の所、勉強するだけで手一杯で自分でオリジナルのVFXを作成してみようという余裕は全然無いです。

と言うか、もうVFXの技術ってある程度Saturateしているので、最適解をNetで見つけてそのやり方を覚えてしまった方が下手に自分で考えるよりずっと良い物が出来ます。

後、Particle Attribute ReaderとEventの使い分けとか、その辺も教えて下さい。と思っていますが、このTutorialはあくまで初心者向けなのでParticle Attribute Readerについての解説は無いですね。

まあTutorial通りにやって行きましょう。

まずNiagaraにおいてEventが何であるかについて簡単に解説しています。

NiagaraにおけるEventとは簡単に言うと2つのEmitterを繋いで、片方のEmitterの位置、や消滅などの情報をもう片方のEmitterに送る事です。

なのでEventを実装するためにEmitterを追加します。

Sourceは単なるFountainのTemplateです。Ribbon は先週作成したRibbon Rendererを使用したEmitterです。

結果です。

今はこの二つのEmitterはEventで繋がっていないのでそれぞれ勝手に動いています。

この二つのEmitter間でEventを行い、RibbonがFountainで生成されたそれぞれのParticleを追うようにします。

Source EmitterのPropertiesの

Requires Persistent IDsにCheckを入れます。

これにCheckを入れると、それぞれのParticleのIDがそのParticleが消滅するまで同じになるはず。

Source EmitterのParticle Update SectionにGenerate Location Event Moduleを追加します。

Generate Location Event ModuleがこのEmitterで生成されたParticleの位置情報を別のEmitterにPassします。

今度はSource Emitterで生成されたEventを受け取る実装をRibbon Emitter内に作成します。

まずPropertiesにある+を押して

Event Handlerを追加します。

Particle Update SectionとRender Sectionの間にEvent Handler Sectionが生成されます。

Event Handler SectionにあるEvent Handler Properties Moduleの

SourceにEmitter “Source” Event: “Location Event”を選択します。

更にExecution ModeにSpawned Particlesをセットします。

そしてEvent Handler SectionにReceive Location Event Moduleを追加します。

Emitter Update SectionにあるSpawn Rate Moduleを外します。

そして最後にEvent Handler SectionにあるEvent Handler Properties Moduleの

Spawn Numberの値を1に変更します。

結果です。

Source Emitterで生成されたParticleにRibbon Emitter で生成されたRibbonが追随しています。

これがEventです。

今度はEventの内のDeath、つまりParticleが消滅した時にEventを送る場合の実装を行います。

先程作成したSource EmitterをDuplicateしてBurst Emitterを作成します。

Emitter Update SectionのSpawn Rate Moduleを消してSpawn Burst Instantaneous Moduleを追加します。

微調整して以下の様な形状にします。

このEmitterがSourceのParticleが消滅した瞬間に生成されるようにEventを組みます。

まずSource EmitterのParticle Update SectionにGenerate Death Event Moduleを追加します。

今度は、Burst Emitterの方に前回と同じやり方でEvent Handler を追加します。

Event Handler SectionのEvent Handler Properties Moduleの設定を以下の様に変更します。

そして最期にReceive Death Event Moduleを追加します。

当然、Emitter Update SectionにあるSpawn Burst Instantaneous Moduleは消します。

結果です。

今一、Eventが効いているのか分かりません。

少し微調整してみました。

これだと、最初のEmitterで生成されたParticleが消滅した時に次のEmitterがParticle を生成しているのが分かります。

もう完全に花火ですね。これ

先程のRibbon Emitterを追加し微調整しました。

最後にEventのCollisionの実装方法を説明します。

先程のEventをDuplicateしてRibbon Emitterを消します。

更にSource EmitterのGenerate Death Event Moduleを消します。

以下の様になりました。

このParticleが地面と衝突した時に2番目のEmitterのParticleが生成されるようにします。

Source EmitterのParticle Update SectionにCollision Moduleを追加します。

更にこのCollision ModuleのRestitutionの値を0にします。

するとParticleは地面と衝突しますが跳ね返らなくなります。

Source EmitterのParticle Update SectionにGenerate Collision Event Moduleを追加します。

次にBurst Emitterの方のEvent Handler SectionにReceive Collision Event Moduleを追加します。

後、Event Handler Properties ModuleのSourceはCollisionに変更します。

結果です。

Source Emitterで作成されたParticleが地面に衝突した時にBurst EmitterのParticleが生成されています。

ただ、良く見ると地面にぶつかったParticleでもBurst EmitterのParticleが生成されないのがありますね。

どうしてなんでしょうか?

まあ、良いです。

もう疲れてしまったので、Niagaraの勉強はこれで終わりにします。

<感想とまとめ>

流石にあんまり詳しくないBeamやLightのEffectの作成とか全く勉強した事のないComponentのEffectに追加してEventの実装方法の復習までやったので疲れてしまいました。

ここで教えている事はNiagaraの基本が濃縮されているので全部、血肉にします。そして自分でNiagaraの初心者向けのTutorialを作成する時の基礎にします。

3.Materialの勉強

今週も、Ben Cloward 先生のPost Process用のMaterialとFluid Ninja VFX Toolsを勉強します。

3.1 Blur and Sharpen Filter - Shader Graph Basics - Episode 51 [2]を軽く見る

軽く全部見ました。

Blurのやり方は基本的には線の抽出方法と同じで、あるPixelの点の回りの値を抽出します。Blurの場合はその抽出した値を平均化して使用します。

Sharpenのやり方はBlurと元の絵からLinearに外挿して元の絵よりも鋭い映像を作成しています。

このやり方は興味深いです。

この方法を使用して、ぼやけて読めない文字とかはどれくらい読めるようになるのか知りたいです。画像処理とかで同様の技術が使用されているはずです。調べたら分かりそうですね。

以下に手順をまとめました。

まずあるSceneをSampleします。

これは正確に言えば、あるSceneのあるPixelをSampleしています。

今回は以下の様に7つの点のSampleを採取します。

このTutorialの図はあんまり好きじゃないです。Pixelなんで点じゃなくて面なはずです。

以下の様に書き直しました。

Pixelなので面が並んでいます。ここでは仮にそれぞれの面に対してX軸とY軸の値から番号で名前を付けました。

ここまで書くと代々何をしているのか想像つくと思います。

0,0の位置のPixelのSampleを取った場合、その周りのオレンジ色の位置のPixelの値も同時にサンプルを取ります。

これらの値をある割合に応じて全部混ぜて平均を計算します。その平均の値を新たな0.0の位置のPixelの値とします。

これを全てのPixelで行うとBlurなImageが作成出来ます。

はい。

では実際にあるPixelの値とその周りのPixelの値をどうやって取り出すのかですが、Pixelの値そのものはUV値をPassするの事で簡単に出来ます。

そのUV値をどうやって得るのかが問題になります。

まず以下に示したようにそれぞれのPixelの位置を表すConstantを作成します。

次にこれらのConstantを実際の画面上のPixelと対応させるための計算を行います。

そのためには、まず実際の画面のPixelのサイズを得る必要があります。

以下に示したScreen Resolution ノードのOutputにあるVisible Resolutionがその値を返してくれます。

その値で1を割ります。

これで1 Pixelの大きさが分かりました。

その大きさ分をそれぞれのPixelの位に掛けます。

その分をTexCoord[0]の値に足します。

はい。

これでPixelの回りのUV値を得る事が出来ました。

それぞれのUV値を以下に示したScene Texture: Postprocess Input 0ノードに繋げてそれぞれの位置のPixelの値を得ます。

次にWeight、つまりそれぞれのPixelの値をどれくらいの割合で混ぜるのかを決定します。

0.0のPixelの値は30%、それ以外のPixelは11%強の値で混ぜる様にしました。

最後に全部の値を足します。

結果です。

少しだけボケています。

ここからが私が一番注目している部分ですが、どうやってBlurのイメージと元のイメージから内挿したり外挿したりするんでしょうか?

はい、Lerpノードを使用します。

内挿の英語はInterpolationで、線形の内挿をLinear Interpolationと言います。そしてLerpノードはLinear Interpolationのabbreviation(省略形)がLerpです。

このLerpのAlphaの値が0の時は、Aの値、つまり元のImageが返され、

Alphaの値が1の時は、Bの値、つまりBlurのImageが返されます。

そしてここからこの値を使用して線形の外挿を行います。

まずAlphaに2を入れた場合です。

ぼやけています。凄いぼやけています。

でもまあ、ぼやけるのは情報量が減っているのでまあそれなりに見られるのは分かります。

逆のSharpenする場合です。

Alphaに-1を入れました。

凄いはっきりしている気がしますね。

比較のために元のImageを以下に貼ります。

うーん。

Tutorialではこの後、色々なSceneを見せているので元の絵と比較してどれくらいSharpenになっているのか分かりません。

でもかなりSharpenになっている気がします。

何とこの計算方法、Photoshopとかに採用されているシャープ(アンシャープマスク?)の計算方法だそうです。

うーん。これ知らんかった。

3.2 Blur and Sharpen Filter - Shader Graph Basics - Episode 51 [2]を実装する

それでは実装します。

それですね。Tutorialの正しいPixelの位置の計算方法は勿論合っていますが、その計算方法の解釈は微妙に間違っている気がしています。

その辺についての私の意見を次の節でまとめます。

まずConstantを7つ作成します。

Screen Resolution ノードを使用して画面のPixel数を得え、その値で1を割ってPixelの1個のサイズを求めます。

それぞれのConstantの値にその値を掛けます。

最近、Named Reroute Declaration ノードの使い方を覚えたので試しに使用してみました。

あんまり綺麗になっているとは言えませんが、線が無い分、見やすいのかもしれません。

TexCoord[0]の値を追加しました。

Scene Texture Postprocess Input 0ノードを繋げます。

今度はWeightを計算します。

最後に全部足します。

Lerpも追加してしまいます。

出来ました。

Alpha=0の時の結果です。

Alphaを1にしました。

ぼやっとしています。

Alphaの値を2にしてみます。

Uの文字が2重になってしまいました。

今度はAlphaの値を-1にしました。

Uの字がShapeになっています。

3.3 Blur and Sharpen Filter - Shader Graph Basics - Episode 51 [2]の隣のPixelの位置の計算方法の理論について

この部分の説明です。

これってTutorialでは1/Visible Resolutionの値が1Pixelの大きさであると説明しています。

これはかなり誤解を与える表現で、端的に言うと間違っていると私は考えています。

以下にこの部分の説明に関する私の見解を述べます。

まずScene Texture Postprocess Input 0ノードがどんなTextureをG bufferに保持しているかが問題なんです。

以下の実装をしたMaterialをPostprocessに使用します。

Post Processを使用していない時と全く同じ映像が表示されます。

つまりPost Process Input 0はRenderingし終わった最終の映像をTextureとして保持している訳です。

次にTexCoord[0]の値を2倍にしてみます。

結果です。

画面のサイズが4分の1に縮小しました。

この事からPost Process Input 0に保持されているTextureは普通のTextureと同じように以下の様なサイズで保存されています。

だから1 pixelのサイズが1/Resolutionになる訳です。

どんな条件でも1 pixelのサイズが1/Resolutionになる訳ではないです。Post Process Input 0に保持されているTextureのサイズは上記のようになっているので、このTextureに限って言えば、1 pixelのサイズが1/Resolutionになる訳です。

3.4 FluidNinja VFX Tools for Unreal - 03 - More On Simulation Input [UE4] [4]を軽く見る

先週勉強したUIの使い方の更に詳しい使い方について解説しています。

ここで教えているのは以下の3つです。

<Freehand Densityの手書きの保存方法について>

以下の様なPaintを描いてそれを保存しておきたいとします。

以下のButtonを押す事で出来ます。

以下に示したような名前で保存されています。

You might have seenのYouをイーって発音しています。

凄い、この発音の仕方も初めて聞きました。

<WaterfallにおけるOffsetについて>

WaterfallではInput Densityは以下に示したように画面の中央にありますが、

Outputでは画面の上部に移動しています。

これは以下に示したInput のDensityのOffsetのParameterの値を変更しているからです。

<Logo

これはBitmapでInputする例として出て来ますが特に何も説明しないで終わってしまいました。

以上です。

特に試してみる内容でもないのでこれで今週のFluid Ninjaの勉強は終わりにします。

4.RPGEventの作成

今週はNPCのセリフを直します。

4.1 ヤマメ村のNPCのセリフを直す

まずは番人との会話です。

直しました。

ここでもヤマメ村について語っていました。

今度はヤマメ村の村長のDialogueです。

直しました。

村長の腰巾着です。

以下の様に変更しました。

今度は旅人です。

最初の会話は以下の様に変更しました。

更に外の世界についての解説もここに追加しました。

起業家の卵です。

以下の様に変更しました。

ただし文が長すぎます。

もう少し推敲が必要です。

こっちは短くて良いです。

詩人です。

ここでは森と泉の青の世界にあるアポロン王国についての話をします。

これも長すぎました。後で推敲します。

4.2 村の外れに要るNPCとの会話を作成する

以下の二人の会話を作成します。

NPCとの会話をどうやって実装したのか忘れてしまったのでそれをまず復習します。

コードを読み直したんですが、全体像がよく分かりません。

多分ですが、以下のDialogueの作成と

以下のWidgetのTutorial Villageの会話の部分の実装を追加すれば良いと思います。

まず会話を作成しました。

更に以下のWidget

以下の実装を追加しました。

あ、一個忘れていました。

以下の配置しているNPC

設定を以下の様に変更します。

結果です。

何個か細かい間違いを直しましたが出来ました。

セリフが変わっています。

出来ていますね。

こっちのNPCのDialogueも作成します。

これも前と同じ方法で直しました。

結果です。

Dialogueが変わっています。

4.3 このRPGをもっと短くする

ここまでやってやっと分かったんですが、RPGを完成させるには量が多すぎるんです。これ頑張って完成させてもBug出しで詰んでしまう可能性もあります。更にはWorld CompositionのようなUE5では使用しない技術への対応も考える必要があります。

そこで、武器を手に入れてMonsterを一体倒す所で、一端完成にします。

序章の前半部分だけでGameを作成すると言う事です。

これをする事で以下のMeritが考えられるからです。

  • バグ出し
  • その他の技術の変更にも対応出来る。
  • Monsterが一種類しかいない問題も解決する必要がなくなる。
  • このGameが面白いかどうかがここだけで分かる
  • Post Processなどの最近学んだ技術も追加出来る

その上で序章の後半や、第一章の作成は別なProjectで後で作成する事にします。

まあ、分かっていますがこのGame、今のままでは面白くありません。その理由もGameを完成した後で検証、考察します。

5.Open Worldの検証

5.1 Open Worldの検証の目的の再確認

先週、以下の様に述べました。

しかしこれをやる前に、Open Worldの検証をしている目的の再確認をする必要がある気がします。のでそれをまずやります。

先週、以下の様に述べました。

これを読み直しましたが、Gaeaの仕組みやUE5のLandscapeの仕組みをかなり理解した今ならもう少し具体的に書き直す事が出来る気がします。

のでそれをまずやります。

まず、最初の目的はUE5のWorld Partitionを用いて、一辺の長さが4km、計16km^2のPhoto Realisticな観点から最高の品質を持ったOpen Worldを作成する事です。

Photo Realisticな観点から最高の品質を持ったLandscapeを作成するためにHeight MapはGaeaなどのThird PartyのSoftwareで作成したモノを使用します。UE5内でLandscapeを使用して自作する事はしません。

このHeight Mapには以下の条件が要求されます。

  • GeometryのサイズはGaeaで作成した時とUE5で生成されるLandscapeのサイズが同じである事
  • Height Map一枚のサイズは1009x1009 Pixel
  • UE5にImportした時に100倍のScaleにする。
  • つまり複数枚でOutputする必要がある(16枚)

ここまではこの目的を達成する為のやり方は判明しています。

この次の条件のが問題です。

Height Mapにおける質を保つ為には高さは512m以下にする必要がある。それ以上の場合はHeight Mapを別に作成する必要がある。

これのやり方が分かりません。

私が見た中でHeight Mapの高さを分割してImportしているTutorialはSmart Poly氏のHow To Make A Massive Open World Map In Unreal Engine 4 [4]だけです。

これをまず復習してどうやってHeightを分割してUE5 にImportしているのか確認します。

5.2 Smart Poly氏のHow To Make A Massive Open World Map In Unreal Engine 4 [4]を復習する

まずHeight Mapやその他のMaskをImportしている所から確認します。

Levelsを開いてImport Tiled Landscape…を選択します。

すると以下のBoxが開かれます。のでSelect Height Map Tiles…を選択します。

Height Map全部選択します。

次にMaterialを選択します。

するとそれぞれのLayerがMaterialの下に現れます。

のでそれぞれのLayerにMaskを割り当てます。

例えばRock Layerには以下のRockのPng全部を割り当てます。

最後にLandscapeのZの値を100から70にさげています。

これで終わりでした。

あれ?

Height Mapを2層にして高い山とか作成していたと思ったんですが。

ちょっとDownloadしたPngを確認します。

DarkgrassはLayerの一つを担当しているMaskです。これが49枚あります。

次は同様にLight GrassのLayerを担当しているMaskが49枚ありました。

Open WorldつまりHeight Mapが49枚ありました。

後RockとSandのLayerを担当しているMaskがそれぞれ49枚あって終わりです。

あれ?

高さをHeight Mapと分割して管理しているPngは無いです。

Smart Poly氏のHow To Make A Massive Open World Map In Unreal Engine 4 [4]でHeight Mapの高さを分割してImportしていると思ったのは私の勘違いだったようです。

でもそれだとSmart Poly氏はどうやってHeight Mapの高さに対応しているのかと思ったら、Height MapのFormatが.r16になっていました。

調べるとr16は16bit分のDataを白黒で保持するみたいです。Pngは32BitでRGBAの全てのDataを担当するとなると一つに対して 8 bit分のDataしか入らないのでしょうか。そうするとR16 の方が2倍多くのDataを保持出来ると言う事になります。

GaeaのExportの設定を見ると.r32があります。

これPngだと8 bitsだから512mが限界なんでしょうか?でも2^8は256ですよね。+かーを示すのがBit以外にあるならそれを利用して512って事なのかもしれません。

Pngが8bitsだから512mが限界が正しいとしたら、R16 はその2倍の16 bitsあるから1024mまでは綺麗に表示出来そうです。

更にGaeaにあるR32だったら32bitsだから512mの4倍の2048mまで綺麗に再現できるのかもしれませんね。

こっちで高さの問題は解決しているのかもしれません。

となると一応「UE5のWorld Partitionを用いて、一辺の長さが4km、計16km^2のPhoto Realisticな観点から最高の品質を持ったOpen Worldを作成する。」と言う目的を達成するための最適な手段は既に全部理解している事になります。

5.3 Open Worldの作成方法をまとめる

<準備>

まず、Gaeaで1009x1009のHeight Mapを16枚作成する必要があります。更にそれぞれのBlend Layerに当たるMaskもそれぞれ16枚作成する必要があります。

ところがGaeaでそれを作成するためには有料版を買う必要があります。

まだGaea使用歴2カ月で有料版に切り替えるのは軽率なのでそれはまだしません。代わりに先程のSmart Poly氏が提供してくれている以下のHeight MapとそのMask4種類。

これの最初の4x4を使用します。

しかもこのHeight Map、サイズが1009x1009です。

しかもHeight Mapにr16が使用されているので、そのFormatにUE5が対応しているのかの確認も出来ます。

以下の様に最初の4x4だけ別なFolderに分けて保存しました。

<UE5におけるWorld Partitionの作成方法>

これは先週、勉強したUnreal Engine 5 : How to Create a MASSIVE Open World Landscape (100 km2 map) - UE5 Tutorial [5]のUE5にImportした部分をそのまま行います。

まずEmpty Open Worldから新しいLevelを作成します。

空を追加します。

今回は、先週教わったEnv.Light Mixerで作成します。

Create Atmospheric Light 1以外を全部押します。

以下の様に空が完成しました。

これは便利なんですが、これに頼っていると折角勉強した空の作成方法を忘れてしまいそうです。

空の作成方法については後で復習してまとめる事にします。

Landscapeの作成です。

Landscape Modeに変更します。

Import from Fileにします。

Enable Edit LayerにCheckします。

これ確かにやった記憶があるんですが、先週のBlogにはこの部分は載っていませんでした。後でUnreal Engine 5 : How to Create a MASSIVE Open World Landscape (100 km2 map) - UE5 Tutorial [5]を見直します。

Height Mapに先程の.r16のFileを読み込ませます。

Height Map1枚のSizeが1009x1009 Pixelで4 x 4枚あるので4036 x 4036になります。

そしてMaterialですが

あ、このLandscape用のMaterialを作成してなかったです。

取りあえず以下のMaterialを作成しました。

このMaterialをセットしました。

更にMaterialのLayerもここでセットしました。

これは最初の1枚目だけしかセット出来なかったです。

多分これで全部のMaskが読み込まれるはずです。

Scaleです。

高さに関しては何の情報も持っていないでの70にしました。

この設定で合っているのか不明です。

公式DocumentであるLandscape Technical Guide [6]によると以下の設定を進めています。

するとSection Sizeを63に変更して、Component Sizeを63x63にした方が良いかもしれません。

出来ませんでした。

Number of Componentsのサイズの最大が32でした。

これで作成します。

Importを押しました。

結果です。

あれ、形状がオカシイ。

先週の以下の図からするとyの番号が逆になるのか?

以下の様に名称を変更してみます。

Y0->Y3

Y1->Y2

Y2->Y1

Y3->Y0

大変なんでHeight Mapだけ直しました。

結果です。

Top ViewでUnlitで見ました。

うん。出来てるっぽいですね。

と言う事はMaskも全部直す必要があるんですね。

残りは来週やります。

今週はここまでです。

6.Gaeaの勉強

6.1 これからのGaeaの課題

一応、Gaeaで1009 x 1009 pixelのHeight Mapを16枚作成して16 km^2のLandscapeを作成する方法は分かりました。

後、残っている問題は、Png、R16、R32のFormatでExportした時に高さの滑らかさに変化があるのかどうかを確認する事です。

これは結構大変なので今週はやりません。

Mountainの作成に慣れてからこのテストはやりたいと思います。

もう一つはGaeaでLandscapeを沢山作成する事です。やっぱり量をやらないと上手くならないです。20個位は作成したいです。

6.2 Gaeaの勉強の復習

それで今週は今までの勉強の復習をやります。

2022-04-18

Gaeaの勉強を始めたのは4月18日からでした。まだ1カ月ぐらいしか勉強してないと思っていたら既に3カ月位は勉強していたんですね。

この週はGaeaのFree版の特徴や有料版になった場合との違いについての解説をまとめてありました。

今読むと、1009 x 1009 pixelで4 x 4 のHeight Mapを作成するために必要な条件を綺麗にまとめてあるんですが、これ勉強した当時は何を言っているのか全く理解していなかったです。

後は公式のTutorialをやっていますね。

2022-04-25

無料版でもTilesの数を複数にセット出来るけど、本当にお金払わないといけないのか?と書いています。

これは後で試してみましょう。まあ出来たとしても商業版に組み込んだ時点でばれますが。

後は公式のTutorialの勉強をしています。

以下に示した様に自分でPaintしたりしています。

実装についても詳しくまとめてありますが、良く分かりません。

やっぱりGaeaのTerrainを作成するための実装部分になるとまだ分からないですね。その辺はこれからじっくり勉強します。

2022-05-02

何と、公式のTutorialに飽きて、Klaus氏のTutorialをやっぱりやる事になりました。

これがまあ結果から言えば正解だったんですが、最初のTutorialのInterfaceで地獄の苦しみを味わう事になります。

UIの使い方なんて勉強しても全く面白く無いです。

一応、UIの使い方も復習しようかなとBlogのまとめを読み始めましtが途中で気持ち悪くなりましたのでやめました。

2022-05-09

ここでも先週の続きのUIの勉強です。

UIの勉強はヤダったのかPropertyの部分だけ勉強して終わりにしています。

2022-05-16

Tool Boxの勉強だけして終わりです。

2022-05-23

ここでやっとUIの勉強が終わりました。

2022-05-30

やっとKlaus氏の次のTutorialが始められます。

以下のTerrainを作成していました。

この辺になるとそんなに昔の気がしません。2カ月位前の話ですね。

2022-06-05

先週の続きをやっていますね。

以下の事が分かったと書いてありました。

雪、川、湖の色付けはExportした後ではほとんど関係ない機能ですね。

後は大事です。

2022-06-12

「川とか湖に新しいTextureを貼る為のMaskを作成しています。」と書いていますがここで作成しているMaskはExportしてUEでMaskとして使用するためのものですね。

後は特に記録する事は書いてないです。

2022-06-19

ここでも先週の続きのMaskを作成しています。

2022-06-26

BuildとExportについて勉強しています。

以下の部分について良く分からないとかいてあります。

あれ?

NormalizedにセットするとHeight とScaleを自由にセット出来るんじゃないの?

うーん。

この辺が復習して確認する必要がありますね。後でやります。

2022-07-10

ここでそれまでにGaeaで作成したHeight MapとそのMaskをUnreal Engine 5にImportしてLandscapeを作成しています。

やっぱりEnable Edit LayerにCheckを入れていましたね。

ここではWater Systemを使用していました。

そう言えばWater Systemについて別個に勉強すると言っていました。

すっかり忘れていました。

以下の様な結果になってしまいました。

2022-07-18

先週の間違いを直して最終的には以下の様になりました。

World Partitionが効いているのも確認しました。

高さから発生する歪みは結構激しく確認されました。

2022-07-25

先週のBlogなのでまとめるのもあれですが、ここで一応最初の目的である「UE5のWorld Partitionを用いて、一辺の長さが4km、計16km^2のPhoto Realisticな観点から最高の品質を持ったOpen Worldを作成する」ためにGaeaでやらないといけない事が何であるのかとそのやり方が全部分かりました。

<復習した感想>

やった内容覚えていないですね。もう一回同じ事をやり直すのもかなり勉強になる気がします。

来週から何を勉強するのか一週間考える事にします。

7.雪山のMapの作成

今週もVolumetric Cloudの勉強の続きをやっていきます。

Ben Cloward 先生のVolumetric Cloud Materials - Building Worlds In Unreal - Episode 33 [7]の実装をやります。

7.1 Volumetric Cloud Materials - Building Worlds In Unreal - Episode 33 [7]の実装

まず、Tutorialでは以下の複雑なMaterialの実装を整理したら

こうなったと言っています。

これから確認します。

Volumetric CloudのMaterialにDefaultでセットされているMaterialは以下のm_Simple Volumetric Cloudです。

開きます。

Tutorialにそっくりな実装が現れました。

このMaterialをCopyしてそっくりなMaterialを作成します。

これの実装を整理してみます。

以下の様になりました。

これをBen Cloward先生の分割と同じように3つに分けます。

丁度Larpノードがあるのでこれを利用します。

Aに繋がっている部分の実装です。

Bに繋がっている部分の実装です。

Alphaに繋がっている部分です。

ここだけ見るとBen Cloward先生がm_Simple Volumetric Cloudを整理したら

こうなった。と言うのはかなり文字通りの話みたいです。

<Basic Shapeとの比較>

私が整理した部分の実装とBen 先生が整理したBase Shapeを比較してみました。

全く同じです。

と言う事は先週のTutorialを復習すればこのMaterialの実装は理解出来ると言う事ですね。

先週のBlogを見直すとまず使用しているTextureについて調べています。

のてTextureを開いて見ました。

以下の様なTextureが並んでいます。

私、大学でVolume Renderingの研究をしていたのでこのImageは非常に懐かしいんですが、Volume Renderingを勉強した事が無い人には何の事か分からんと思います。

分かり易いように3d化して、更に透明度を上げて中身が見える様にしました。

これ見る限り単なる煙の塊ですね。

あー。

分かりました。

このMaterialの意味の根本が。

これはどうやってVolume Textureを使用するのかを教えているんです。

良し。

自分でVolume Textureを使用したMaterialを作成してみましょう。

Result ノードの設定をVolumetric Cloud様に変更します。

Lerpの後に色々な実装がありますが色を追加したりContrastを強めたりしているだけで

ないと駄目というモノはないはずです。

のでそのまま繋げます。

するとErrorが表示され

UVWは絶対入力して下さいと出て来ました。

元のMaterialを見ると以下の実装からUVWを計算している事が分かります。

しかしまずTimeは要りません。サイズを調節している掛け算の部分も要らないでしょう。

と言う事でAbsolute World Positionノードだけ追加しました。

これをCloud Materialに追加してみました。

結果です。

追加する前のViewです。

Static Meshが全部見えなくなってしまいました。

うーん。もう少しUVWの指定をしっかりやりますか。

Absolute World PositionとTexture Sampleの間にSampleに有った以下の計算を追加しました。

結果です。

変わらないですね。

となるとExtinctionに値を入れる必要があるのかもしれません。

あるいはこっちのNodeが必要なのかもしれません。

以下の実装を追加してみました。

変わりませんね。

あー。分かりました。これVolumetric Cloudが空間全体に作成されているんです。

しかもOpacityが100%の状態で。

ならばDensityを薄くすれば良いんです。

Extinctionに以下の実装を追加しました。

これでExtinctionの値を小さくしたらどうなるか見てみます。

Default値の0.05を掛けた時点で以下の様になっていました。

は。雲が青色になっていたんですね。それで雲の中に居ると言う事が良く分からなかったんです。

確認のためにExtinctionのParameterの値を0にしたり1にしたりしてみました。

青色のVolumetric Cloudの中に居るのが分かりますね。

はい。

まずは雲を白くしたいですね。

結果です。

あんまり白くならなかったです。

というか透明度が増しました。

もっと強調させてみます。

サンプルにあった白色を強調させるための実装をそのままCopyしました。

結果です。

うーん。白くならない。

となると後はここですか。

変わらないですね。

今度は、先程整理したMaterialのBasic Shapeを直接繋げてみました。

自作したMaterialとの大きな違いは以下の部分だけです。

結果です。

普通に雲が出来ています。

うーん。

こっちを先に理解する必要があるのか。

取りあえず、丸コピーしてVolumetric Advanced OutputのConservative Densityに繋げました。

その結果を以下の部分の実装に足しました。

結果です。

雲とは言い難いですが何かが空に生成されています。

確認のためにSampleのMaterialからConservative Densityを抜いてみます。

結果です。

む。それでも雲は認識出来ますね。

色々弄ったら分かりました。

Extinctionに繋がる実装はTexture Sampleノードから直接引くのではなくその後のContrastを出してSaturateした値から引く必要がありました。

結果です。

やっと雲らしく白くなりました。

7.2 Volumetric Cloud用のMaterialに必要な実装を検証する

この後、どうじても納得出来なくて色々試したんですが、

を足しだだけでも雲が出来ました。

雲に見えないと思われるかもしれませんが、この位置から上昇してVolumetric Cloudを上から見ると

になっています。

このように上空から雲をみると、Volumetric Cloudである事や、一個の雲の大きさとかが一目瞭然ですね。

分かり易いのでこの位置からDefaultの雲を見てみました。

うーん。

ここで2022-07-12のBlogで勉強したUE4: Step-by-Step to Creating Your First Volumetric Cloud Material [8]を復習したら以下の実装で最初の雲を作成していました。

こんな感じです。

この実装には、Volume Textureを使用していません。でもVolumetric Cloudを作成出来ています。

7.3 Volumetric Cloud用のMaterialに関して今週勉強した事をまとめる

今週のVolumetric Cloudの勉強は流れに流されて全然最初の目的と違う事をずっとやってしまったのでここで整理しておきます。

まず最初の目的は、先週勉強したBen Cloward 先生のVolumetric Cloud Materials - Building Worlds In Unreal - Episode 33 [7]の実装をやる事でした。

所が途中で、Volume Textureの構造を見て以下の様にピンと来たんです。

つまり、Volumetric Cloudに使用しているMaterialの実装と言うのは結局このVolume Textureの使用方法を理解する事であると。

それでVolume Textureを使用するために必要な最低限の実装を検討しました。

所が、予想に反してこのVolume Textureを使用するために必要な最低限の実装が良く分からない。

色々試したら、実装出来てるようで、出来てないような結果になりました。

それで2022-07-12のBlogで勉強したUE4: Step-by-Step to Creating Your First Volumetric Cloud Material [8]を復習したら以下の実装で最初の雲を作成していました。

これ、Volume Textureを使用していません。

つまりVolumetric Cloud用のMaterialに必要な最低限の実装にはVolume Textureは必要なかったんです。

最初の仮説である

が間違っていたんです。

それで今週のVolumetric Cloudの勉強が全部流されてしまった。

しかしそれはそれで、Volumetric Cloudに関する知見を得る事になりました。

  • 観察する場所を一定にしないと、雲の下から見ているのか、雲の中から見ているのか、雲の上から見ているのかが分からなくなる。(Book Markを使用すべき)
  • Extinctionが雲の形状を作成する。ExtinctionMaskOpacityのような役割をする
  • Extinctionの機能を調べるにはUE4: Step-by-Step to Creating Your First Volumetric Cloud Material[8]の実装を見るべき

これを踏まえて、来週の課題を考えます。

Volumetric Cloudの勉強の目的である「Volumetric Cloudを作成するために必要な最低限の実装を見つける。」ですが、これが分かるとその上に新しい技術を積んで理解する事が容易になるので来週もちょっと頑張ってみようと思います。

後、雲が白くならなかったのは多分、最初からVolume TextureをAlbedoに使用したので、Sky Lightなどの影響を受けたためだと思います。雲の上から観察したら白かったかもしれません。これも来週確認します。

「Extinctionに適当なTextureか計算で端の部分が真っ黒なTexCoord[0]を作成して雲の上から観察すれば、Volumetric Cloudが出来ているかどうかは確認出来る。」と考えています。これも来週試してみます。

8.UI Designの勉強

今週は、Volumetric Cloudの勉強が大幅に予定を超えてしまったのでここはお休みします。

9.Anime Renderingの勉強

今週もアニメレンダリングの勉強をしていきます。

9.1 Anime Renderingについて

暫くの間、以下の文は毎回貼らせて頂きます。

こっちもです。

9.2 今回の予定

今回、初めてのAnime Renderingの勉強として、10回程度ここで勉強する予定です、

以下に勉強する予定の内容を書いておきます。

それではそれぞれの勉強をして行きます。

9.3 PPLineDrawingの検証

PPLineDrawingはUnreal Engineでイケてるイラストを描くためのノウハウ大放出! | UE4 Manga Anime Illustration Dive Online [11] で紹介されています。

今週はNormal Lineについての勉強をします。

<Default値>

結構、汚いですね。

昔の劇画調です。

World NormalのImageです。

うーん。

これだけ見たんじゃ良く分かりませんね。

細かい点を見てみます。

結構、細かい線も抽出出来ていますね。

足元です。

うーん。

線はしっかり出ていますね。

<Normal Line Bias

値を5にしてみました。

結果です。

線がもっと太くなるかと思ったら細くなりました。

実装を見たらLineのContrastを上げるためにPower しています。

あれ、Default値が5になっています。

あ、以下の値がDefault値でした。

結果です。

Default値で見た絵と全然、違う。

もう一回やり直します。

<Default値(やり直し)>

Outlineは部分だけしか抽出出来ていませんね。

足元です。

意外にも結構抽出出来ています。

World Normalの足元の画像です。

足元と地面のNormalの値は全然違うので線を抽出しやすいみたいですね。

これは新しい知見を得られました。

<Normal Line Bias(やり直し)>

値を小さくします。

結果です。

線がほとんど消えてしまいました。

消えたというか薄くなった感じです。実装を見るとLineのContrastを上げる機能なのでこれは納得です。

今度は数字を大きくしてみます。

値を10にしました。

結果です。

線が濃くなりました。

ただし、元々線が無い部分に線が現れる事は無いみたいです。

これはWorld Normalで見るとその理由が一目瞭然です。

MannequinのNormalの値が、背景のNormalと全く同じ値を取った時には線の抽出は出来なくなるからです。

やっぱりこういうのを見るとCustom Stencilで番号で分けるのが一番な気がします。

001から225まで番号を振れるのだから、結構な線がこれから作成出来る気がします。ただこの方法だと指とかの線を出すのが難しいくなるのかもしれません。

足元です。

思ったより線が抽出していません。

World Normalで確認するとかなり色が違う部分でも線が出来てない箇所があります。

他のParameterを変更すると線が見える様になるんでしょうか?

<Normal Line Max Weight

これは何をしているのか良く分からないParameterなので実装を見ます。

測定しているPixelとその周りのPixelの差をClampしていますが、そのClampする値の最大値と最小値を決定するParameterでした。

と言う事はこの値が大きい方がより差が大きくなるのでしょうか。これ絶対値にしてからClampしていたらそうなる気がしますが、実際の計算はClampしてから足してその後で絶対値にしているので、値が大きい方がより差が少なくなる場合もありそうです。

値を大きくしました。

結果です。

全体的に線は太くなりました。しかし線が無い部分もありますね。

今度は値を小さくします。

結果です。

線がほとんど消えてしまいました。

<Normal Line Sampling Scale

こっちは以下の実装から推測すると

線が太くなるんでしょうね。

1.0に上げてみました。

結果です。

線が太くなるというより、線になる閾値が下がったと言うのが正解みたいです。

Default値では線として認識されていない小さな違いしかない部分にも線が生成されています。

では細かい部分が線として認識されるようになったのかMannequinの東部を見てみます。

顔の部分の輪郭は抽出されていません。

World Normalで確認すると奥のObjectのNormalと同じ値だったからみたいです。

やはりNormalで輪郭線を抽出するのは良くないですね。

<Normal Line Width

これは実装を見ると比較対象のPixelを決定する時に、どれくらい離れたPixelを採取するのかを指定しています。

では1以下の数字を入れたら隣のPixelより近くになってErrorになるんじゃない?と思ったら

しっかり最低値が1になっていました。

値を2倍にしてみました。

結果です。

黒い部分が増えていますが、もともと線が抽出出来ない部分はこの値を増やしても線は生成されないですね。

この検査しているPixelのすぐ隣のPixelを調べないで、2つ隣のPixelを調べる事に何の意味があるのかと常々思っていたんですが、その意味が分かりました。

以下の様なPixelが並んでいたとします。

すぐ隣のPixelと比較して違いが有ったPixelを黒く塗ります。

Pixel2つ分が黒くなります。

2個隣のPixelと比較して違いが有ったPixelを黒く塗ります。

何と4個分のPixelが黒くなります。

だから比較するPixelの位置を遠くにすると線が太くなる傾向が出て来る訳です。

やっと理解しました。

9.4 公式のDocumentStylized Rendering [9] の勉強

今週から実際に使用されているMaterialの実装を見ていきます。

この木のMaterialから見てみます。

木の幹のMaterialです。

M_Tree_Type_Bの実装をみます。

これはMaterial Instanceでした。

ParentはM_Tree_Bark_Aでした。

この実装を見てみます。

かなり簡単な実装です。

これなら全部理解出来そうです。

まずBase ColorとEmissive Colorの違いですが、Emissive Colorは数字を掛けているだけの違いですね。

SpecularとRoughnessの値が指定されています。

Specularの0ですが、これってMetallicに0を設定するつもりで間違てるって事はないんでしょうか?

何か気になります。

次にBase ColorとEmissive Colorですが、Lerpで2種類の実装を混ぜています。

しかも条件にDisntance_Blendノードを使用しているのでカメラからの距離によって2つの実装を切り替えているのが分かります。

確認してみます。

木の根にベージュ色が確認できます。

ここから少しだけカメラを後ろに下げました。

木の根のベージュ色が無くなりました。

使用しているMaterialが切り替わっている証拠です。

一寸だけDistance_Blendノードの復習もしておきます。

以下の様に直接Base ColorにDistance_Blendノードを接続すると

以下の様になります。

近い部分は黒、遠い部分は白、そしてその中間は灰色です。

この特質をLerpノードのAlphaに使用して以下の様に実装します。

近い部分、黒い部分はAが配置され、遠い部分、白い部分にはBが配置されます。中間の部分にはAとBが混ぜた色が配置されます。

はい。

それでは近い距離で使用されているAの実装から見てみます。

何とまたLerpノードが繋がっています。

まずAlpha値ですが、Clampノードが繋がっています。

このNodeの値をPreviewで見ると

となっています。

思ったより画像が細かいですね。

この黒い部分がAの実装、白い部分がBの実装になります。

AとBの値は以下のParameterで指定されていました。

このLerpノードのImageは以下の様になっています。

灰色の部分はなさそうですね。

拡大して見たらありました。

何で?と思ったらLerpノードがその前に挟まれていました。

うーん。

でもLerpがあっても元のTextureに灰色がないと灰色は出来ないでしょうね。

Textureの先はいつもと同じです。

このTexture SampleとClampノードに挟まれているLerpノードの意味は分からないです。無くてもいい気がします。

遠い場所のMaterialの実装の部分を以下に示します。

使用しているTextureが違うだけで実装内容は同じなのでSkipします。

はい。

一個のMaterialの実装を見ただけで時間が無くなってしまいました。

来週はこの木に使用されているもう一個のMaterialを勉強します。

9.5 夏森轄(なつもり かつ)先生のBlender】セルルック講座 ~ノード、輪郭線、法線転写、RGB分離~ [10を勉強する

<法線転写(Normal Transfer)>

まず法線転写がNormal Transferと約されていますが、この英語が正しいのか一寸心配です。

これから調べて見ます。

色々調査しましたが、Normal Transferを使用している英語のTutorialは以下の一個だけでした。

後は、Editing Normalとか、Customizing Normalとか使用されているのが見られました。

ああ、分かりました。この違和感の正体が。

Normal Transferというと何かTransferが主に聞こえるんです。上記の例のようにNormal Transfer OptionとかNormal Transfer Settingとかなら、普通に聞こえますがNormal TransferだとNormalなTransfer、つまり正常な移動と言う意味に聞こえます。

他の例のようにEditing NormalとかCustomizing Normalと言えば、Normalが主に聞こえます。だから自然と法線の編集とか、法線のカスタム化のように聞こえます。

だからTransferring Normalのような言い方だったらそんなに変な感じはしなかったと思います。

だたし転写の訳にTransferを使用していますが、これも違和感を感じます。

転写と言う意味自体が良く分かりませんがStatic Meshを移動、回転、拡大縮小する行為を総称してTransformと言います。

Normal Vectorを移動、回転、拡大縮小しているならTransformの方が正しい訳かもしれません。

でもそもそも法線転写自体が日本で作られた技術ならその技術をどう呼ぼうが日本人の勝手であって英語として可笑しく感じてもどうでも良いと言う意見もあります。

更にProgrammerなら兎も角、デザイナーに英語がしゃべれる事を必要条件として要求するのも酷な気がします。

ここでは法線転写と言う事にします。

まずNormal Vectorの視覚化のやり方が解説されていました。

やってみます。

まずEdit Modeに変更します。

次に以下のButtonを押す事で

以下のBoxを開き

この中のNormalから面のNormalを選択します。

すると以下の様に選択しているObjectのNormalが表示されます。

はい。分かりました。

この後、法線と面の向きについて解説しています。

以下のFace OrientationにCheckを入れると

法線が出ている方が青、その面の裏側が赤に表示されるそうです。

球では分かりにくいのでPlaneを追加して試してみました。

法線が出ている方です。

裏面です。

出来ていますね。

法線転写について解説していました。

うーん。

凄い、別なObjectの法線の情報を使用するんですね。

これってUEでも出来るんでしょうか?

まずTutorialのやり方をまとめます。

<法線を転写したい部分だけをオブジェクトとして分離>

法線を転写したい部分だけを選択してPを押すと出来るそうです。

一寸試してみます。

と言っても適当なModelがないので、Suzanneで試してみます。

顔の部分を選択してPを押しました。

以下のBoxが表示されました。

Selectionを選択します。

すると以下に示したようにSuznne.001が生成されました。

画面は以下の様になっています。

うーん。出来ているんでしょうか?

Lを押して繋がっているMeshを選択してみます。

顔の部分は選択されませんでした。

成程。

でも顔の部分のMeshの選択は出来ません。

この面を選択してPを押すという事を調べる必要がありますね。実際は何をしているんでしょうか?

今週は取りあえず先に進んで法線転写について理解する事を優先します。

<UV球の追加>

Shift AでUV球を追加するそうです。

このやり方は知っています。

ただこの球をObject Modeとして追加するのかEdit Modeで追加するのか分かりません。

取りあえずObject Modeとして追加しました。

こんな感じです。

このUV球をスムーズシェードするそうです。

これですね。

ゴツゴツが無くなりました。

次の工程ですが、以下の様な形にUV球を変形させています。

こんな複雑な事出来るのか?

と思いましたが、やってみます。

何度かやったら奇跡的に以下の様な形状が出来ました。

底は空洞ですが、これでいいんでしょうか?

この変形した球にModifierのSubdivision Surfaceを追加してLevels ViewportとRenderを6にセットします。

そしてApplyを選択しました。

Tutorialではここから更に細分化しろと言っていますが私の球は既に以下のような状態になっていますので止めておきます。

これで球の作業は一端終了だそうです。

次に顔の編集だそうです。

Modifierからデータ転送を選択するそうです。

そのままData Transferと言うのがありました。

うーん。

これからNormal Transferと言う英訳が出て来たんですかね。

確かにData Transferだとそんなに違和感無いですね。

ここからはData Transferの設定のやり方についての解説になります。

まずSourceに先程作成した球をセットします。

はい。しました。

次にFace Corner DataにCheckを入れCustom Normalsを選択します。

しました。

すると警告が表示されました。

そんなのどうやったら良いの?

と思ったらTutorialで解説していました。

Tutorialの解説通りにやってみました。

Suzanneの顔が無くなってしまいました。

Lightで照らしてみました。

何か選択出来てないMeshが有ったみたいでSuzanneの顔が黒抜きされている箇所があります。

ここでLightを移動させて影の動きを確認したいんですが、Lightの動かし方が分かりません。

しょうがないので手動でLight の位置を変えて観察してみます。

Tutorialの例のようにSmoothな影でもないですし、所々がPolygonの四角が浮き出ています。

これは来週、もう一回挑戦する必要がありそうです。

Tutorialではこの後で

をやるように言っています。

Suzanne.001とSuzanneを合体させました。

以下の様になりました。

<法線転写(Normal Transfer)を勉強した感想>

やっている理屈は理解しました。しかしBlenderの機能が良く分からないので以下の事が出来ませんでした。

  • 顔に使用している全てのFaceを選択する
  • Sun Lightの向きを変更する

UEならばDirectional Lightの向きを変えるには、以下のような天体図みたいなのが現れて太陽の位置を移動させるかのように自由にDirectional Lightを動かせるんですが、Blenderにおけるこの機能がどんな名称なのか分からなくて結局、Lightの位置を引っ張って動かして確認しました。

まあ、今週は初めてこの技術を習ったので来週もう一回試してみてからまた考える事にします。

10.まとめと感想

今週も予定した時間を大幅に超過してしまいました。

やりたい事に対して時間が足りなさ過ぎです。

11.参照(Reference

[1] CGHOW. (2022, June 12). Unreal Engine 5 Niagara Beginner Tutorial - UE5 Niagara Starter Course! [Video]. YouTube. https://www.youtube.com/watch?v=NcJ1ZP7tFUk

[2] Cloward, B. [Ben Cloward]. (2022, June 23). Blur and Sharpen Filter - Shader Graph Basics - Episode 51 [Video]. YouTube. https://www.youtube.com/watch?v=c30uBsyMnNY

[3] Ketzer, A. [Andras Ketzer]. (2019, November 12). FluidNinja VFX Tools for Unreal - 03 - More On Simulation Input [UE4] [Video]. YouTube. https://www.youtube.com/watch?v=txR5IMoufdI&list=PLVCUepYV6TvPnVELcyGoSDhpoLO7PyT6_&index=4

[4] Smart Poly. (2020, May 19). How To Make A Massive Open World Map In Unreal Engine 4 [Video]. YouTube. https://www.youtube.com/watch?v=HQUC0Gejmo4

[5] Klaus. (2022b, March 24). Unreal Engine 5 : How to Create a MASSIVE Open World Landscape (100 km2 map) - UE5 Tutorial [Video]. YouTube. https://www.youtube.com/watch?v=JNNizdQ4JvY

[6] Epic Games. (n.d.). Landscape Technical Guide. Unreal Engine Documentation. Retrieved July 31, 2022, from https://docs.unrealengine.com/4.27/en-US/BuildingWorlds/Landscape/TechnicalGuide/

[7] Cloward, B. [Ben Cloward]. (2021, June 3). Volumetric Cloud Materials - Building Worlds In Unreal - Episode 33 [Video]. YouTube. https://www.youtube.com/watch?v=rEYojMx26T0

[8] WorldofLevelDesign. (2021b, February 16). UE4: Step-by-Step to Creating Your First Volumetric Cloud Material [Video]. YouTube. https://www.youtube.com/watch?v=aYxvN5cs-EU

[9] Epic Games. (n.d.). Stylized Rendering. Unreal Engine Documentation. Retrieved June 19, 2022, from https://docs.unrealengine.com/4.27/en-US/Resources/Showcases/Stylized/

[10] 夏森轄(なつもり かつ). (2022, May 21). 【Blender】セルルック講座 ~ノード、輪郭線、法線転写、RGB分離~ [Video]. YouTube. https://www.youtube.com/watch?v=e1tFq5OoSY0

[11] Epic Games Japan. (2022, February 21). Unreal Engineでイケてるイラストを描くためのノウハウ大放出! | UE4 Manga Anime Illustration Dive Online [Video]. YouTube. https://www.youtube.com/watch?v=QuYIkSozV6w