3DCG屋さんの活動記録

PROFILE ★★こんな人です

映像制作会社でクリエイティブの修行中。日ごろはMaya&AEを中心にいろんなCGソフトを触りながら、TD寄りの作業が好きで、インタラクティブな体験型空間演出をやりたいと模索中。面白いこと新しいこと大好きな『素直』でいつづける

2017年3月30日木曜日

BGEでRealtimeのPBR  〜お勉強編


仕事でも未だにスペキュラマップとか使ってるので、そろそろPBR始めなきゃと思います。
どうせやるならリアルタイムで、しかもゲームエンジンでやりたい!!


さて、BGEでは「GLSL」に設定すればできるみたいですね。
というか、PBRはマップ(テクスチャファイル)がちゃんと用意されていればできる!
(※PBRとはなんぞ?今までのマテリアルとの違い ←とてもわかりやすい丁寧な説明!!)

BGEでPBRのマテリアル設定チュートリアル

こりゃすごい、透明度とか屈折とかないとかなり早いな。
さて、PBRに使うテクスチャーの種類について
参考になる画像がたくさんあるサイトをいくつか紹介。

◼︎モンスターボール
Color, Metalness, Normal(tangent), AO, Roughness 〜4つ

◼︎単純マテリアル
Albedo、Metalnes、Roughness 〜3つ

◼︎リアルカメラ
Albedo、Microsurface(Roughness?) 細かい傷、Reflectivity、Fresnel、AmbientOcclusion、Cavity(Curvature) エッジの鋭さ 〜7つ ※下図は4つ



と、まあしようテクスチャについては使い方や呼び方いろいろあるみたいですね。
ちなみに冒頭に紹介したBlenderGameEngineのPBRでは、次の6つを使用

Albedo ……反射能、どれだけ光を反射するか (≠Diffuse…拡散反射、色)
Normal ……凹凸
AmbientOcculusion ……隙間 →立体感増す
Metalness(Reflectivity、Metalic) ……反射率、鏡
Roughness(Glossiness、Shiness) ……ざらつき
Cavity(Curvature) ……曲率マップ、凹凸エッジ

おそらく私が制作しようとする体験型コンテンツでは、
リアルタイム、そこそこフォトリアル、ただ超細部が必要ではないと思うので

①Albedo ④Metalness ⑤Roughness
3つだけでも良さそう



キャラクターとか形状がやや複雑なものになったら、②③の形状補完は必要かも。
さらにハードサーフェス系で質感をリッチにしたい時は、⑥で角の擦れ具合UPに。

さて、時間作ってBGEで実際にマテリアル触ってみて試してみよう。

今回の内容というわけではないが、Blenderの情報まとめてある良いサイトありました。

2017年3月25日土曜日

初めてのBGE その2


前回の続き・・・
チュートリアルのステップ2途中から!

前回までで、CUBEの「移動」「ジャンプ」のアクションを追加して
床の上を動くまで。

さて、続きをします。



◼︎まず『コイン』を作成。
 別のビューを選択して、シリンダー作成。
 回転とスケール調整。
 マテリアルを変更で黄色に。
 名前変更でとりあえず完成!


次に、メインビューに戻って、コインの配置場所を設定。

Ctrl + A で Empty/PlaneAxis でロケータ作成&移動。
ここでLogic作成。
Always -> And -> EditObject(objectでCoin指定)

ここで、GameStartすると、ロケータ位置にコインが表示されるのを確認!
ロケータを複製していっぱい配置される。



ここからは、
◼︎「コインに当たるとコインが消える」のアクション作成
CoinのLogicで「当たったら消える」動作を追加。

[Coin]
Logic: Collision(Player) -> Add -> EditObject(EndObject)

[Cube1]
Property: Player と名前を追加

ここでポイント!ゲームを作るにあたっての新しい事実!!
3Dオブジェクト名と、ゲーム内での処理に用いる名前は別!?

Collisionで衝突判定するときは、
Properyでゲーム用の名前を作成する!

以上で、GameStartすると、箱動かしてコインに当たると消えるようになる。

・・・・がなぜか、消えない(エラーがどこかわからない)

というわけで、Blenderに最初から入っているモン吉モデルで作り直したらいけた。
というわけで、今後はCoinをMonkeyに変えて進めます!(すみません、エラー解決する時間なくて。。)



えーと、、箱動かしてモン吉が消えるとこまで出来たので、
次は
◼︎モン吉をとるとポイントゲット!!を表示する
 ➡︎ポイントカウンター設置!

ポイントカウンター用のゲームプロパティを作成。
今回は、擬似プレーヤーの箱に作成します。

 [cube1] 
   Property : Score と名前追加
 Logic : Collision(Monkey) ->   Add -> Property(Add,100)


とここで、上で指定したCollisionのMonkeyが今のままでは反応しません。。
以下を追加します。

 [Monkey]
   Property :  Monkey  と名前追加。

最後に、実行画面でポイントカウンターを表示するために
Scoreと作成たプロパティで 「インフォメーション」ボタンをONにして表示指示。
さらに、BGEのDisplay設定でDebugPropertyを ON にして画面表示を有効にする。

※3Dオブジェクト「Monkey」に、ゲーム用のプロパティ「Monkey」を追加(左下パネル)
 Game実行時に文字表示を有効にするDebugPropertiesのON設定(右上パネル)


とここで、「あれ?」と思いませんか。
ロケータにオブジェクトを呼び出すときはProperty追加してなかったぞ?
詳細は分かりませんが、今回は

『Collision(衝突判定)のときはProperty名で指定』
Propertyなければ追加作成する。

というということを学びました。



ステップ2の最後に、
◼︎モン吉が取られる間、回転している

[Monkey]
Logic: Always -> Add -> Motion(rotateZ -2.0)

これで、Z軸に毎フレーム-2°回転します。



以上でステップ2は終了です。
いや〜なかなか初心者には時間がかかりましたが、
一気にゲームっぽくなってきましたね、テンション上がります。


さておさらい。
ステップ2での作業は

◼︎物理法則を適用して箱がジャンプできるように …前回のブログ
◼︎別のビューアでコイン作成
◼︎コイン(モン吉)に箱が当たるとコインが消える
◼︎コイン(モン吉)をとるとポイントゲット&ポイントカウンター表示
◼︎コイン(モン吉)を待機中に回転させ続ける

そして、キーワードは

● 衝突判定
● ゲームプロパティの追加
● デバッグプロパティ表示

衝突判定がこんなに簡単だとは!涙
デバッグプロパティ(テキスト)表示も簡単!

Sensorのキーボードを外部インターフェースにすれば、Arduinoからシリアル通信できそう。
Actuatorsに外部動画ファイルの再生を当てたり、モーション付きの3Dモデルとか、Alembic再生させるのをつなげれば、リッチなコンテンツできそう。


にしてもBlenderはインターフェースが見やすいなぁ。
何より触るのが楽しい!無料もサイコーですね〜








2017年3月24日金曜日

初めてのBGE その1


やりたいことはいっぱいあるけど、とにかくBlenderGameEngineなるものを触ってみないと何も始まらない。
そもそも僕は、Blenderでのモデリングすらまともにできない。
というか、Blenderはサンプルファイル開くだけしかできない!笑

というわけで、Blenderの使い方、を
『BGEで超シンプルなゲームを作ってみる』チュートリアルを一通りやって学ぶことにした。
いつものように、親切な方が無料でアップしてくれてるので見ながら進めていきます。


キーボード操作で「箱」を移動、コインを集めるゲーム
※BGE基本操作、物理法則(重力)、音(SE)、ゲームの完結までできる入門者最適チュートリアル!!!
ステップ1
BGEで、キーボード押したら箱が動くアクション作成
(ゲームのStart、3大項目 [Sensor, Controller, Actuator] )
ステップ2
物理法則(重力)の適用とジャンプアクション。
衝突判定。
デバッグプロパティの表示。
ステップ3
オブジェクトの影、ライティング。
ポインントカウンターのテキストデザイン。
コインをすべて取ったら次のステージに切り替わる。
ステップ4 
コインとった時の効果音。
メニュー画面と、メニューボタン作成。
Finishシーンとボタンの作成。
ステップ5 
障害物オブジェクトの作成。
トリガースイッチオブジェクトと、トリガーアクション。


今日は『その1』ということで、できるとこまでやってみた。

と、その前にBlender 2.78をダウンロードして、
解凍したフォルダをMacbookProのアプリケーションフォルダに移動(=インストール)。
この時間、ものの10分!サイズも460MBで重すぎないしBlenderって本当に手軽に始められて好き😄

< ステップ1 >
それではチュートリアルを始めていきます。
まずはBGEの操作方法。
Blender開いて、上の「BlenderGameEngine」を選択。
これだけでゲームエンジンモード!感動しませんか!?😭簡単すぎる
そして、操作画面は「GameLogic」にするだけ。
まだまだ簡単!ノード接続の基本的な操作なのでまだ大丈夫。
キーボードのWを押すとY軸方向に進む、という超基礎。わかりやすい簡単。
同様な作業で、上下左右に移動する4つのアクション作成。
ちなみに、右下の「Start」でゲームが始まる!うおー簡単すぎる!!
ステップ1はここまで。


< ステップ2 >
物理法則の選択。Caracterにしとけばリジッドボディに。
CollisionBounceはつまりBoundingBoxでの衝突判定?これは今回BOXで。
無限に落ちないように床オブジェクトを作成。
Actuator新規作成でMotion、Jumpにチェック。
キーボードのSpaceに↑で作ったJumpを適用。うわ!めちゃ簡単なにこれ??



とりあえず、ステップ2の途中ですが、今日はここまで。。
これだけもBlenderとBGEの可能性が見えました!
あと、やっぱり今の僕にぴったりのツールと再認識。
モデリングからできて、ゲームエンジンにシームレスにつながる、作業できるストレスフリーは凄すぎる!!
配布するとした時のGPLライセンス関係がネックですが・・・しばらく考えずに作品作ります!

すごー

2017年3月11日土曜日

Blenderに惹かれる BGE!


NUKEでノードベースコンポジットをする今日この頃ですが、、
なんとBlenderでもノードベースのコンポジットができる!?
知りませんでした、すごい。



※シーンファイルも提供されている親切な方!↑


これなんか、まさにやりたい演出映像。トンネル!いいなあ




標準搭載のレンダラーもキレイだな。全然これはこれで使えそう



で、僕がやりたいのは
インタラクティブな体験型映像演出!
なのです。

そして調べました、、


Blenderってゲームエンジンないのかな?



・・・ありました!


やばい興奮してきた。

なんだかんだCGで一番経験の長い3Dモデルの制作スキルと、
リアルタイムで動かせるゲームエンジン、
インタラクティブに外部とつながれるPython、
ときに絵作りのトライアンドエラーとして重宝する(?)コンポジット機能、

そして無料!

いままでUE4がよさげだなぁ、でもとっかかりにくいなあ、
でもフォトリアルだしやりたいなあ、、

ってモヤモヤしていましたが、
僕がやりたいのは「フォトリアル」にこだわらないので
いままでの経験がまるっとごっそり活かせそうなBlenderはじめます!


よし!

というわけで、Blender始めます宣言。
今やっている「風船ぽんぽん」もBlenderと絡めてやろう。

Arduino&Processingでセンサー確認 とりま終了。
Arduino とBlenderの接続は以前にテスト済み。
 ※シリアル通信で、センサーとモデルをリアルタイム接続できた
       2016.3月・・・ただFacebookに投稿。(もう1年前か!)


というわけで、あとはBlenderで積み木作って、
Arduinoからのインタラクティブ通信で崩れるやつやろ。
その前に、それを想定したBlenderのシーン作成しなきゃだな。

よし!


あ、あとPython実行するだけで、物理シミュレーションのシーン完成。。
これもすごいなぁ。。
http://cflat-inc.hatenablog.com/entry/20130630/1372568992



てか、この人のBlender作品、かっこいい!
https://www.youtube.com/user/T4ch1k0ma


あああ、HoudiniするかBlenderするか悩むむむむ。


とりあえずBlenderGameEngineの情報サイト
BlenderArtist.org
BGEについての解説(日本語)




NUKE 便利Gizmo LightWrap & Erode


NUKE のGizmo、ちゃんと使ってみた!

今回はGizmoツール群のPxFから、
ライトラップのMergeWrapと、アルファ縮小のErodeを試してみた。


すごく簡単!
とくに、MergeWrapで、背景に応じたラップがされるのが嬉しい。
あとオブジェクトの外側にも作成できるのが何気によさそう。

左側にツールが表示されるのが便利ですね!
カスタムツールセット、作っていきたいな。

って、こういうプリレンダー?ポストプロダクション?の作業ばかりだけど
映像制作のスキルはもちろん、画像処理の基礎部分の勉強にもなる。
とくにNUKEは、アルファ(RGBA)のことも考えないと意図した画にならないから
曖昧な理解のままでは作業できない。



参考サイト


PxF






2017年3月10日金曜日

log撮影素材にNUKEでLUT適用


log撮影素材は使ったことありましたが、今まではAftereffectsばかりでした。

今回NUKEで作業することになり、LUTを適用してみたら・・・
なんとAEと結果が違う!?

なんでや?と時間かかったのでメモ。



注意すること

NUKEでReadノードで読み込んだ際、ColorSpace指定。
ここでプルダウンに素材と同じlogがあればいいが、
私の場合なかったため、カスタムでLUTを追加することにした。

ノードを自作する python (超簡単)
http://cgworld.jp/regular/nuke008-2.html

init.py
menu.py
をまずつくる。.nukeに。

ちなみに、init.pyでNUKE起動時にGizmo(python)を読み込むように指定。
menu.pyはノード登録して呼び出し出来るように。

ここで、どちらも記述の際に、文字列の中に" "を入れるときに要注意!
" "のなかに" "いれるときは、' ' (Shift +7)で! ※もしくは' 'の中に" "
これわからず、エラーでNUKEが立ち上がらなかった汗。。。

2017年3月9日木曜日

Python for NUKE ノードサムネイル表示切替


NUKEでやってみたかったPython!
NUKE Pythonお初スクリプトヽ(^o^)丿
つかえそうな処理があったので、勉強もかねてやってみた。


ノードのサムネイルのような画像の表示切替。


postage_stampというKnobのオンオフで切り替えるようです。

あ、「Knob」っていうのは、Mayaでいう「アトリビュート」みたいなものみたいです。

以下作成スクリプト。
選択したノードで、サムネイルの表示切替します。
複数選択対応です!!!


簡単で楽しい。




参考サイト
・お世話になっていますコンポジゴクさん
・5年前からNukePythonされてるなんてすごい!サイト

2017年3月4日土曜日

ブログのアイコン(ファビコン)変更


パッと見てブログの認識につながる四角のアイコン=ファビコンを変えよう!

っていうのは他の方がわかりやす〜く書いてくれているので、詳細はこちらで。

ちなみにBloggerでファビコン変更は簡単。


ただ、ファビコンっていうicoファイルは別途作らないといけないので
こちらのサイトで作りましょう。



ファビコン作成自体がそんなに頻繁に使用することないので、
このサイトも使い方忘れてましたが、

手描きでかける(上記画像はDを描いたつもり)し、
画像ファイルをアップロードしてもファビコン作成できる!

実際、作成したファビコンをアップロードしてみましたが、
すぐに反映はされないんですね。。

以上、メモでした。


----------
2017.3.10補足

今朝ようやく反映されてました。
6日かな・・・約1週間かかるみたいなので注意です!

2017年3月3日金曜日

風船ポンポン 1.入力装置作成


ずっとやりたかった、風船を使ったインタラクティブな作品にとりかかります!
目標は、1ヶ月間でこどもに遊んでもらえるようなカタチまで作る

・・・頑張ります!汗

これ、本当は昨年末のクリスマスに大々的に実践したかったんですが、
当時は公私でバタバタしてて自主制作どころじゃなかったです。。
海外から極小Arduinoとか面白アイテムとか大量に買い込んでたんだけどなぁ、トホホ。
結局、風船にレインボーLED入れて床に置いただけでした。
それはそれで、子供もはしゃいで楽しんでくれたのでよかったですけどね!

 やっぱり「触れる」のって楽しい!
 2016.クリスマス



さて、とりあえず今回は、風船タッチテストに便利なように入力装置作ってみた。
風船の中にショックセンサー入ってます。
空気抜けないように、ホットボンド多用しました。

データの流れは
風船の中のショックセンサー → Arduino → Mac (Processing)

とりあえず今日はここまで笑。



以下は、昨年末のショックセンサー初テストメモ(書きなぐりですが)を転載。
yoppaさんのサイトにはいつもお世話になってます。

---------------------
2016.10.15 memo
---------------------

初のアナログデータのグラフ(プロット)視覚化!!!!たのしい。
ショックセンサーからArduinoにアナログ入力(0~1024)、
それをProcessingでグラフ化!!

今回のミソ
※複数個のデータが1つにまとまったデータ群(時系列データ)のシリアル通信 ★★
→要は、Arduinoで , で区切ってひとまとめにして送信。Processingで , で区切って分解。



【テスト】

目的:
ショックセンサーの入力をProcessingに送信してビジュアル化

手順:
①ショックセンサーから値入力 (アナログ 0~512)
 それをArduinoで 0~255にリマップ

②シリアルでProcessingに通信。 <ここまでArduino処理>
 ・・・例: 0,0 \n 512,255 \n 200,100 

③Processingでグラフにプロット , を読み取り値を分解。
   シリアル通信を読み取る。読み取ったデータをyの値としてsensors[]に一旦格納。
 それをx方向に追加していく。端までいったら新しいページに描画。

以下スケッチ
===========Code: Arduino ===============

===========Code: Processing=============


スケッチと実行結果
横が時間軸、センサーが反応したところで点が上下している。