先日は、

 

■ ディスプレイスメントマップとアクション (UPBGE 0.3 Alpha

 

にてディスプレイスメントマップをキーフレームで制御できることについて書きました。UPBGE 0.3 Alphaでは、ゲーム内でも使えることが確認できたので、色々な使い方ができそうです。

 

 

 凸の指定をする                  

 

 凹凸の指定には、ポリゴンを形成するちょつ円の座標で制御しますが、この場合、頂点の数とディテールの細かさが比例します。その為、基本的に、ハイポリモデルにすると、その分、細かなディテールの制御が可能になります。また、ディテールの表現にはテクスチャーも用いますが、これも高解像度になれば描き込めるディテールの量も増えるので、解像度の比例してディテールが高くなります。

 

 凹凸については、

 

■ 凹凸とカメラ 【 Blender 2.82a 】

 

の中でディスプレイスメントマップとノーマルマップを使っていますが、

ディスプレイスメントマップについては、

 

  ■ 作成したテクスチャーを使用する

  ■ プロシージャルテクスチャーを使用する

 

と言う二つの方法があります。とは言っても、ディスプレイスメントマップはハイトマップなので、昔の3DCGツールのバンプマップ用のグレースケールのマップをそのまま使う感じなので、基本的にグレースケールで描ける環境を用意することになります。

 

 Blenderの場合だと、テクスチャーペイントで作成したマップを使用できますが、作成後に一旦保存して、ブラシ用のテクスチャーで読み込みます。すると、そのマップをモディファイヤーで指定したディスプレイスメントマップとして使用できます。グラフィックツールを使う場合だと、レイヤー効果を使ってハイライトとシャドウをコントロールできたりガウスなどでにじませる事もできるので、手書きよりももう少し複雑な事ができますが、こうした外部ツールを使った作業の場合は、ファイルの読み込みを

 

ブラシの指定を行うテクスチャーとして読み込む

  

とディスプレイスメントマップとして使用できます。これが、作成したテクスチャーでの処理になりますが、これとは別にプロシージャルテクスチャーを使う事もできます。これは数値の変化でテクスチャーのパターンを変更できるものになりますが、ブラシ形状として登録できるので、

 

 ■ テクスチャーペイント

 ■ Sculptモデリング

 

において、ディテールを描きこむ時に使えます。あと、ダイナミックペイントやウェイトペイントでもブラシ形状が反映されますが、形状に直接関係ありそうなのは、この2つになります。

 

 ちなみに、テクスチャーペイントを使った場合だと、

 

 ■ テクスチャーペイント+ディスプレイス    

 

のような感じになります。また、ディスプレイスメントマップは、手書きではなく、テクスチャーBAKEで作る事もできますが、素の場合、Sculptモデリングで形状を作って適応します。Sculptモデリングは、ブラシで直感的に頂点の座標を変化させるモデリング手法になりますが、

  

 ■ Sculptモデリング                 

 

のような感じになります。また、ディスプレイスメントマップはノードでも指定できるので、

 

 ■ シェーダーでの質感の設定           

 

のようにシェーダーで指定する事も可能です。

 

 今回は、後者のプロシージャルテクスチャーを使ってディスプレイスメントマップの指定を行います。

 

 

 ィスプレイスメントマップを適応する      

 

 今回はUPBGE 0.3 Alphaを使用しますが、サイトを聴見てみると、

 

 

ように2に最新版が出ていました。そして、Blender 2.9.0 Alphaも

 

 

のように3日に最新版がリリースされています。

 

 今回は、ダウンロードが終わっていないので旧バージョンになりますが、UPBGE 0.3 Alphaを立ち上げると、

 

 

のような画面になりますが、今回は、このCUBEにディスプレイスメントマップを適応します。

 

 

■ ディスプレイスメントマップを適応する     

 

 ディスプレイスメントマップはノードから指定する方法と、モディファイヤーから指定する方法がありますが、今回はモディファイヤーから指定します。指定をすると、

 

 

のようになりますが、ディスプレイスメントマップはオブジェクト(ジオメトリ)を構成している頂点(バーテックス)の座標変化をハイトマップで制御しているので、頂点の数が少ないと変化が出ません。

 

 その為、分割を行て細分化をするか、サブディビジョンで細分化することになります。Ctmul-Clark法だと画像のように丸まってしまうので、面を維持したい場合だと、エディットモードから辺を細分化して形状が変化しないようにする必要があります。この状態で、

 

 

のようになりますが、凹凸は、下にあるディスプレイスで行っています。

 

 

のように指定テクスチャーで制御しますが、このディスプレイスメントマップも数値で制御されていますから、

 

 

のようにキーフレームを打つとアクションが登録されます。つまり、このディスプレイスメントマップの凹凸の変化をロジックエディタで制御できます。

 

 

 ジックエディタの準備               

  

 UPBGE 0.3 Alphaではロジックエディタのタブはなく、項目すら存在しないので、新規にウインドウ構成を作る必要があります。まず、

 

 

のように新規ワークスペースを作るために、余計な分割差がされていないRenderingを選択します。新規作成は 【 + 】のアイコンでこの項目が表示できます。追加すると、

 

 

のようになります。ただし、この状態だと使いにくいので画面を分割します。

 

 画面の左側面の端にマウスカーソルを合わせると、 【 ↔ 】 の形になるので、そこで右クリックをすると

 

 

のようなメニューが出てきます。すると、分割するラインが出てくるので任意の場所で分割します。

 

 

この状態で、画面左上のアイコンをクリックすると、

 

 

のように表示メニューの一覧が出るので、上側を3Dビューポートにします。下側も変更する必要があるので、

 

 

のようにアイコンをクリックしてメニューを出し、

 

 

のようにLOGIC EDITORを指定します。すると、

 

 

のような画面構成になります。

 

 

 ジックを組む                    

 

 とりあえず、画面構成はできたのでロジックを組みます。

 

 

のように

 

  ■ センサー

  ■ コントローラー

  ■ アクチュエーター

 

を繋ぐことになりますが、今回は、

 

 

のようにしています。これは自動でアクションが実行される作りですが、

 

 

のようにアクションを見ると、先ほど追加した挙動が登録されているので、アクチュエーターでアクションを選択すると呼び出す事ができます。

 

 挙動が実装されているので、実際にゲームとして実行してい観ると、

 

 

のようなディテールの変化をそのまま反映させることができます。

 

 ■ 実際にゲームとして動かした動画       

 

 

 ロシージャルテクスチャー            

  

 ディスプレイスメントマップの指定は、テクスチャーで行えますが、

 

 

のような質感の変化もディスプレイスのモディファイヤーで指定したテクスチャーの状態を数値でコントロールして調整しています。

 

 

このテクスチャーの指定ですが、テクスチャーのプロパティーで指定したマップを使うことになるので、その登録を粉う必要があります。画像を読み込んで使う場合も同様ですが、画像の場合だと、

 

 

の中の、画像または動画を選択します。それ以外はパラメーターの変化で結果を変更できるプロシージャルテクスチャーになります。各項目による変化ですが、

 

 ■ ブレンド                       

 

 ■ クラウド                       

 

 ■ 変調ノイズ                     

 

 ■ マジック                       

 

 ■ マーブル                       

 

 ■ マスグレイブ                    

 

 ■ ノイズ                         

 

 ■ 凹凸                         

 

 ■ ボロノイ                       

 

 ■ 木材                         

 

のような状態変化が発生します。これについては、

 

 ■ ディスプレイスメントと状態変化         

 

にて動画で紹介していますが、結構変化します。

 

 プロシージャルテクスチャーでディスプレイスを調整した場合、

 

 ■ ディスプレイス                   

   数値の変更でバーテックスの座標変化の度合いを変える。   

   (凹凸の状態が変わります)

 

 ■ プロシージャルテクスチャー           

   数値の設定や指定した項目でテクスチャーの状態や

   サイズを変更する

   (指定するパターン自体が変わります)

 

をコントロールできるので、形状自体をパラメーターの変更だけで調整できます。これについても、動画で見たほうが解り易いので、YouTubeに動画をアップしておきました。

 

 ■ プロシージャルテクスチャーでの形状変化  

 

 

 ャラクターにアクションを使用する       

 

 オブジェクトには物体とキャラクターがありますが、UPBGEではキャラクター専用のダイナミクスがあります。ダイナミクスのプロパティは、

 

 

のようにBlenderと同じ項目が並んでいますが、物理タイプについては、

 

 

のようにBlender 2.8では実装されていないものが並んでいます。と言ってもBGEではおなじみの項目ですが、ゲーム用のダイナミクスが実装されています。

 

 キャラクターを選択すると、

 

 

のような感じになりますが、ジャンプする高さやその時の力も指定できますし、落ちる時の速度も設定できます。Max Jumpsは連続ジャンプの設定で、通常は一度のジャンプの実に対応していますが、この数値を増やすと多段ジャンプができるようになります。

 

 今回は、

 

 

のようにしていますが、ダイナミクスを指定しているので、

 

 

のように高い位置からスタートすると、引力によって物体は落下します。その為、このオブジェクトもゲーム実行時には落下します。

 

 ゲームとしてシーンを実行すると、

 

 

のようになりますが、ジャンプに指定したキーを押すと、

 

 

のようになります。キャラクター設定をすると、固定物のような常時の設定ができなくなるので、アクションの実行時にはキー判定などを入れる必要があります。

 

 

のようなロジックを組むと、登録したアクションがそのまま実行されるようになります、

 

 こうした挙動は実際に見たほうが解り易いので、YouTubeに実際に動かした動画をアップしておきました。

 

 ■ 今回のロジックを動かした動画         

 

 前回は、こんな感じでディスプレイスメントマップについて書きましたが、今回は、配列のモディファイヤーについて書こうかなと思います。

 

 lenderと座標                    

 

 Blenderを立ち上げると、

 

 

のような画面になりますが、 【 N 】キーデシェルフを開くと、

 

 

のように表示が変わります。これは、構図を決める時にも使用しますが、オブジェクトの情報も表示できます。

 

 

のようにオブジェクトの情報が表示されていますが、この数値を変更してキーフレームを打つと、指定したオブジェクトの状態変化を記録できます。形状の変化が存在しない条件下でのオブジェクトの座標変動はこの数値の変動だけで指定できます。ただし、この時の座標はローカル座標が基準となるので、それに注意して指定することになります。

 

 そして、指定する項目はタブで管理されているので、右にあるタブで選択します。

 

 マテリアルの指定などを行う場合、この右側になるプロパティーで指定します。

 

 

のように項目が並んでいますが、オブジェクトヤマテリアルの設定だけでなく、レンダリングやダイナミクスやパーティクルの設定などもここで行います。また、テクスチャーの登録もここで行う事になります。

 

 そして、今回使うモディファイヤーもここで指定します。

 

 

 ディファイヤー(配列)               

 

 この 【 配列 】 ですが、プログラミング言語のループに該当する処置になります。

 

 プログラミング言語を使った場合に、累積演算をする場合、ループを使います。この処理は、機械に近い低水準言語でも使用しますが、四則演算を行う場合、加算回路を作ると足し算ができますが、補数を割り出して、その補数を使用して加算をすると、引き算ができます。これが電気信号で出来るので、電子回路で加算と減算ができます。掛け算や割り算というのはこれの累積処理になりますから、掛け算の場合には何度足したのか?の計算を効率的に行うための処理ですし、割り算というのは0になるまでループさせて引き算を繰り返す処理になりますから、答えが出るまで引いていくと非効率なので、算数の段階で割り算を学びます。このようにループ処理を条件判定を行う事で、二進数で四則演算を行う事ができますが、レイアウトだと表組を行う場合に中のデータの配置も含めて変数制御をして、その回数分だけループして同じ記述を行う事で、表を記述することができます。表は縦横に延びていますから、多重ループ構造にすることで簡素なコードで表を作れます。この時の表の縦横の数を変数にしておいて、プログラムの先頭で呼び出したり、innファイルやXMLなどの外部参照をおこなうようにして設定ファイルを用意しておくと、設定ファイルを参照してその条件に合った表を記述できます。プログラミング言語を使った制御の場合、こう言う処理は、使用する人が任意に変更できた方がいいですから、このテキストデータを入力して、その数値を保存して書き換えが可能にできたほうがいいので、そう言った物も含めて用意すると、設定ファイルを保存してその条件で意図した表を用意する事ができるようになります。

 

 このようにプログラミング言語では、ループを使いますが、オブジェクトを配置する場合にも、座標が決まっている場合、等差数列のように同じ数で増えて推移する条件だとループで処理を行うとその推移を実現できます。その為、ループは色々な使い道があります。

 

 まず、モディファイヤーのプロパティーのタブを選択し、モディファイヤーを選ぶのプルダウンをクリックすると、

 

 

のように使用できる項目が表示されます。今回は、配列なので、

 

 

のように配列を選択します。すると、

 

 

のように設定する項目が表示されます。

 

 

 列と数値                      

 

配列を追加すると、

 

 

のように通常は、真横に一つ複製されます。

 

 この処理は 【 配列複製 】 なので、オブジェクトは指定した状態で複製されます。この設定ですが、

 

 

のように複製する数と間隔などをしています。オフセットは座標と距離なので、どの軸にどれくらいの間隔で配置するのか?を指定します。画像のように2を指定すると、

 

 

のように 【 オブジェクトのサイズの倍数 】 分だけ間隔があきます。つまり、基準となるオブジェクトから何倍の距離に重心を移動するのか?を決めます。そして、数値を変更すると、

 

 

のように数を増やす事ができます。これを使うと、建物の窓や矢氏らのように一定間隔で配置されている物を用意する時に等間隔で配置する事ができます。

 

 とは言っても、この座標と感覚と数値の指定だと、三軸の直線の設定なので、マイクラでブロックを配置するような状態だと制御ができますが、回転はこの項目では設定できません。

 

 その為、回転複製のような処理だと、別の設定方法を用いることになります。

 

 

 転複製                       

 

 回転複製を行う場合、オブジェクトを基本に動かす事になります。その為に、配列を適応するオブジェクトとは別に、挙動の基準となるオブジェクトを追加します。

 

 まず、 【 SHIFT 】 + 【 A 】 でメニューを出し。任意のオブジェクトを追加します。

 

 

の中から、今回は、モンキーを追加します。

 

 

のように選択するとモンキーが追加できます。Blenderは使う前にプリリファレンスでインストール時に一緒に追加されているアドオンを裕子にする必要があります。メッシュには、

 

 

のように景観生成に向いているアドオンが最初から実装されています。

 

 対象オブジェクトの状態をそのまま反映させる場合、

 

 

の 【 オフセット(OBJ) 】 を使います。ここで、

 

 

のようにシーン内にあるオブジェクトから対象となるオブジェクトを指定します。今回は、モンキーなので、

 

 

のように追加したオブジェクトのZ軸の移動と回転を入れた状態で適応すると、

 

 

のようにらせん階段のように回転しながら移動分だけの座標変動が追加されます。この数値を

 

 

のように変更して、配置する数を増やすと、

 

 

のようになります。基準となるオブジェクトの座標が変わると、

 

 

のようになりますが、このオブジェクトの6DoFの変化で複製時の状態が変わります。

 

 

 ブジェクトの加工                 

 

 配列は計算でこの状態にしていますから、モディファイヤーを適応する前だと、配列を適応しているオブジェクトの形状の変化も適応されます。その為、エディットモードに入り、

 

 

のように面を選択してGキーで移動して形状を変形すると、複製されたオブジェクトにも反映されます。

 

 

その為、

 

 

のような状態になります。更に、

 

 

のようにX軸方向に拡大して、

 

 

のように高さを持たせると、

 

 

のようになります。また、

 

 

のように縮小すると、

 

 

のような感じになります。形状を加工して、

 

 

のような感じにすると、

 

 

のような状態になります。また、 【 E 】キーで押し出すと、

 

 

のようになりますが、これを加工すると、

 

 

 更に、【 I 】キーで加工して、

 

 

のようにします。

 

 

 テリアルを指定する                

 

 オブジェクトは複数の頂点とポリゴンで構成されていますが、指定したポリゴンに異なるマテリアルを指定できます。まず、

 

 

のように新規にマテリアルを追加します。そして、

 

 

のように範囲を指定します。この状態だと、オブジェクトで指定したマテリアルが割り当てられているので、

 

 

のようになっていますが、

 

 

のように追加したマテリアルを指定します。

 

 これを選択した後に、  【 割り当て 】 をクリックすると、

 

 

のようになります。また、この状態で、

 

 

のようになります。その後、状態を指定することになりますが、

 

 

の状態からプロパティーを指定します。

 

 

のようにスクリーンスペース反射を指定し、ポスプロの設定も

 

 

のように行います。Eeveeでは設定項目が多いのですが、事前に設定しないとダメな物もあるので、それについては、次の機会に描こうかなと思います。このままだと、

 

 

の状態になりますが、動画にするのでキーフレームを打ちます。

 

 

 ーフレームでカラーを制御する         

 

 キーフレームは、ビューポート上でオブジェクトを選択して状態変化を加えて 【 I 】 キーを押すと、追加できますが、

 

 

のような感じで、キーフレームを打ちます。最初にベースとなる部分の状態を記録して、挙動を実装しますが、マテリアルで指定した色も変更できます。

 

 

のようにフレーム数を変えて、色を変更してキーフレームを打つと

 

 

のようにキーフレームで制御できます。

 

 

のような感じで、設定できますが、動画については、プロパティーで、書き出しの設定を行います。動画で書き出す場合、ffmpeg動画を選択してコーディックを指定することになりますが、動画で書き出すと、

 

 

のような感じでレンダリングがスタートします。Blenderでは、レンダリングをする場合、ウインドウを最小化して表示しない状態で裏で計算させたほうが速いので、最小化してレンダリングを行う事になります。

 

 今回も動画の話なので、実際に動いてみる物を見たほうが変化が解り易いと思ったので、YouTubeに動画をアップしておきました。

 

 

 ■ 実際に出力した動画               

 

 

回の作業環境                   

 

  ■ Core i5 650

  ■ H55M-Pro 

  ■ DDR 1333 2GBx2+1GBx2(DUAL CH)

  ■ Quadro K620(PCI Express x16 【GEN2動作】)

  ■ SATA HDD

  ■ WINDOWS 10 x64 (1909)

 

  ■ Blender 2.82a (x64) 

     https://www.blender.org/

 

  ■ UPBGE 0.3 Alpha  & 0.2.5

     https://upbge.org/

 

  ■ Gimp 2.10.18 (x64)

     https://www.gimp.org/