”Export”を選択して出力する。2.石のテクスチャを作る次に作成するのは石のテクスチャですが、それぞれの文字に応じた石を用意する為に、先に作成したフォントテクスチャを複製し、それを加工して石の形を作ります。UVで設定された矩形で切り取られていますので、それぞれの絵はそれぞれの矩形内(下画像の黄線)に収める必要があります。>>3.フォントと石の切り替えの仕組みを作るマテリアルに移りましょう。先に作ったテクスチャを呼び出し、ノードを繋いでいきます。後にブループリントで値を調整する為に、"VertexColor"を利用します。フォントから石への変化はアニメーション出来るように”Lerp"を利用します。この結果を調整した後、マスクとして使用します。LerpのAlphaの数値を変えると形状変化を確認できるはずです。4.立体感を出すノーマルマップも3と同じように"Lerp"を用いてアニメーションさせます。この時、入力される値を3と同じにし、ノーマルマップは3のマスクと連動させます。(VertexColorのR)5.パララックスで疑似的な奥行きを作るこのままだと味気ない石にしか見えません。そこで石の内部を作成しましょう。平面に対し疑似的に奥行きを与えるにはパララックスマッピングが挙げられます。これは視線と法線ベクトルの変化に従ってテクスチャ座標のずれを生じさせます。疑似的に奥行きのある絵と表面の絵を重ねる事で厚みを出します。テクスチャに対しアニメーションを付けたいので、UVの移動を使います。今回はパララックスマッピングには"BumpOffset"を用いて奥行きを出し、"Panner"でUVを移動させます。この画像と任意の色を掛け合わせて、BaseColorに入力します。ノイズが少し奥の方に表示されているように見えます。6.テキストを確認するブループリント上でテキストを表示し、先に作成したマテリアルを入れて、挙動を確認します。タイムラインを使ってキーフレームを作成し、任意のキーを押すとテキストレンダーカラーの値が動くようにノードを繋ぎます。作成したマテリアルを入れる。任意のフォントを設定する。"TextRenderColor"を操作して、テキストと石のテクスチャが移り変わるか確認する。"Timeline"を作成し、Colorの値を作成、0-1の値を行き来するようにキーフレームを打つ。"SetTextRenderColor"と"Timeline"を繋ぎ、アニメーションさせる。ago.今日は数日前についったーしたポストプロセスの切り替えブループリントの紹介をします。below.まずはブループリントを作ってください。Visualization"をオンにしてください。下記のマテリアルがコンテンツブラウザ上に見えるはずです。"PostProcessMaterial".例えば、”BaseColor”の中身がどうなっているか確認しましょう。"SceneTexture"を見てください。これはポストプロセス中、あなたが選んだ特定のバッファにアクセスする方法です。これはポストプロセスマテリアルなので、次のノードを通り、エミッシブに繋がれているのが確認できます。Switch"とは何でしょう。UE4には「性能が低めのデバイス向けに単純化したマテリアルを作成することができます。」と書かれてあります。コードが書けないデザイナーでも、任意のテクスチャをそれぞれのデバイスに応じて選択できるわけです。below.では、ブループリントを作っていきましょう。カメラをBP上に作成します。カメラコンポーネントを取得します。セットし、自身をターゲットとして繋ぎます。Settings"を変数として作成して、繋ぎます。カメラのフォーカス設定が必要ない方はこの工程をスキップして良いです。Settings"をセット、変数を作成して繋ぎます。Weight"を繋ぎ、必要な場合は呼び出す為のキーを割り当てます。複数の切り替えが出来るように、それぞれのキーを割り当てると便利です。プレイしてみて、下記のようになるはずです。Niagara0ごきげんいかがですかー。Vol.250が発売されました。https://cgworld.jp/magazine/cgw250.html私はUIデザイナー向けのNiagaraEditorチュートリアルを担当させて頂きました。みんなでNiagaraを楽しみましょう。雑誌で紹介したプロジェクトファイルは下記です。https://github.com/Aquariaue4/UE4Projectsでは、さっそく作り方をご紹介。テクスチャからパーティクルポジションとカラーを取得して特定のプロパティに格納するモジュール。格納したプロパティを利用してモーフィングさせるモジュール。"Blueprint"レンダーターゲットにWidgetを描画して、Niagaraをスポーンさせる。”いい感じのフォント”あまり細いと見えない。Emitter]まずは大量のパーティクルを利用するために、SimTargetをGPUに変更します。1.今回は一度しかパーティクルを発生させないので、値を”1”に変更します。2.最終的にRenderTargetTextureを入れますが、まずは確認用のテクスチャを入れます。Instantaneousはパーティクルを一度に発生させるものです。今回はマシンが動く限りの数値を入れてみました。通常は処理との相談になりますけど。パーティクルの発生位置・色・ライフを定め、各プロパティに順番に格納します。1.まずはパーティクルをBoxの形に発生させます。次に作成するモジュールをBoxLocationの下に置きます。BoxScaleは発生させたパーティクルの範囲、つまりBoxLocationと同じ数値を入力します。この数値をテクスチャのUVに変換して、該当部分の色を取得します。2.テクスチャの特定チャンネルを利用する事で、色ごとに処理を分ける事が出来ます。Script]現在のパーティクル位置をUVに変換し、テクスチャの色を取得する処理を作ります。MapGetに以下のプロパティを呼び出します。Particles.VectorParticles.PositionModule.VectorModule.BoxScaleModule.IntModule.ColorChannelEmitter.TextureSampleEmitter.TextureSample1.IntをChannelに変換します。これをターゲットチャンネルとして次に説明するノードに繋ぎます。2.取得したBoxScaleの値からUVを算出し、各パーティクルの位置に相当するテクスチャの色を取得します。1.色を取得した各パーティクルを特定の色でふるいにかけます。2.カラーの値がAlphaで指定された値より小さければ、パーティクルは新たに指定されたポジション・色・ライフを与えられます。ここではライフを0にして、発生した後このモジュールを通った時点でパーティクルは消えるようにしています。3.パーティクル発生範囲のX軸をカーブの値の横軸として利用するため、Floatとして保存します。Emitter]1.新しくプロパティを作成し、アニメーション開始時の色を登録します。2.アニメーション開始時の位置を決めるため、Locationモジュールを利用して、パーティクルを再配置します。今回はBoxの形状に一旦配置した後、CurlNoiseLocationを利用してノイズを与えています。3.再配置した値は現在のパーティクル位置、Particles.Positionです。新しく作成したプロパティにこれを繋ぎます。▽のドロップダウンメニューから選択します。CurlNoiseForceを使用して、パーティクルに動きを与えます。Script]Particles.Spawnで設定した値を使って、モーフィングの処理を作ります。MapGetで必要な情報を取得します。Particles.VectorParticles.BeginningPositionParticles.EndPositionModule.floatModule.MorphRateModule.AffectedPositionModule.WorldPositionModule.NewVariableParticles.LinearColorParticles.BeginningColorParticles.EndColorEngine.DeltaTimeEngine.DeltaTimeParticles.floatParticles.NewTimeParticles.PositionParticles.Position1.Lerpを使って、パーティクルのポジションとカラーを決めます。1に近ければテクスチャ通りの見た目になるはずです。2.現在のX座標より多い値が入力されたら、1で決定した値を現在のパーティクルに影響させ、カーブ用に用意した新しい時間をカウントします。3.カーブの横軸の為に新しい時間を作ります。Emitter]先に作成したモジュールをParticleUpdateの一番下に追加します。あとは任意のカーブを設定すると、モーフィングアニメーションの完成です。1.影響を与える範囲をここで設定します。カーブに切り替えて、0-1の値を設定します。2.今回は正規化されたパーティクルAgeを使いましたが、ここは自分の作りたいものに応じて変更してください。3.パーティクルの位置と色を調整するFloatです。これもカーブに切り替えて編集します。4.カーブの横軸は先に設定した、影響を受けた時点からカウントされる時間です。モジュールで設定したParticles.NewTimeを繋げてください。5.ここでは4と同じくParticles.NewTimeを繋いでますが、上のNewVariable(カラーのLerpに作用するFloat値)の横軸として、例えばBPを用いて別の値を入力しても面白いかもしれませんこの時点で、パーティクルがXに沿ってテクスチャと同じ見た目に並ぶはずです。次はBluePrintの設定を行います。Plugin”というプラグインをオンにしているか確認してください。https://github.com/pafuhana1213/RenderWidgetToTarget#renderwidgettotarget-plugin@pafuhana1213一番初めにWidgetをレンダーターゲットに描画します。呼び出し、先に設定したレンダーターゲットテクスチャを設定します。この時、DrawSizeはテクスチャと同じにします。確認しやすいように、任意のキーを割り当てて、NiagaraEmitterを発生させます。最終的にはカスタムeventに置き換えてください。今回は使いませんが、任意のストリングデータをレンダーターゲットに描き込むことができるので、これを利用してもパーティクルで文字が出せます。Target”で描画を終了します。