妹でもわかるUnrealEngine4

毎日更新? 妹に説明するために書いてるけど、たまにわかってない場合もあるUnrealEngine4を中心としたゲーム制作の話。略すとイモリアル

毎日更新? 妹に説明するために書いてるけど、たまにわかってない場合もあるUnrealEngine4を中心としたゲーム制作の話。略すとイモリアル

UE4のHTML5パッケージ化でも日本語変数名が使える(けどタイムラインノードには少し問題が)

f:id:una_unagi:20180605224238p:plain

imoue.hatenablog.com

「昨日HTML5に関しては調査が終わってなかったんだけど、あれからさらに確認して、プロジェクト名とcontentsフォルダ内のアセット名・フォルダ名以外は日本語使っても大丈夫そうという感触が得られた。昨日その状態でもHTML5で上手く動かなかったけど、それはまた別の原因だった」

妹「なんだったの?」

「タイムライン(Timeline)ノードってあるでしょ」

f:id:una_unagi:20180605224659p:plain

「このタイムラインがGameModeの中に存在してるとエラーが起きるということがわかった」

妹「どこにもつながってないのに?」

「どこにもつながってなくても、動かしてなくてもなるんだよ。不思議なことに。つながっててもなるけど」

妹「不思議すぎる」

「さらにGameModeからタイムラインを含んだアクターをスポーンしても駄目で、GameModeからスポーンされたアクターからタイムラインを含んだアクターをスポーンしても駄目なことが確認できた」

妹「なんでタイムラインにそんなタタリが……」

「あれは見た目より複雑なノードだから、色々中でトラブルが起きたんじゃないかと。ただ日本語の問題じゃなさそうだった。名前とは関係なく起きるから」

妹「でもそうすると今度はタイムラインが使えないということに……」

「何かをスポーンさせたい時は、ゲームモードからじゃなくて、見えないアクターとかをレベル上に置いてからやった方がいいかもしれない。あとGameModeからディスパッチャーとかを使って、別のアクターにあるタイムラインを動かすのはセーフ

妹「ゲームインスタンスとかは?」

「GameInstanceには元々タイムラインが作れない仕様になってるから。スポーンした時にどうなるかまでは試してないけど、それはあんまりやらないだろうし」

f:id:una_unagi:20180605230203p:plain

「ちなみにHTML5でパッケージ化した場合のエラー。1フレーム目が始まる前にエラーが起きると、ずっと起動中みたいな表示になる。でもいくら待っても無駄。日本語のアセット名とか、ConstructionScriptやBeginPlay、あるいは存在自体が問題のノードがある場合はこうなる」

f:id:una_unagi:20180605230215p:plain

「いったん起動した後のエラーはこんな感じ。意味はわからないから、何かエラーが起きたということしかわからないんだけど。時間差でGameModeからタイムライン有りのアクターをスポーンするとこうなる。あとはNullの変数を読み込んでもこういう感じのエラーになる。空の配列から中身をGETしたりしてもこうなる」

UE4.19でデフォルトの設定の場合なので、バージョンが変わったり、設定によってはこれと違う結果になる可能性もあります。完成前にちょくちょくパッケージ化して確認しておくと、どこの何が原因でおかしくなったか特定しやすいです。

UE4のAndroidパッケージ化で、日本語アセット名や変数名などが使えるようになっている、かも

「大変なことがわかった。なんか……UE4で日本語変数使っても大丈夫な気が」

妹「えっ! 使ってもいいの!?」

「完全に大丈夫というわけじゃないんだけど、前に調べた時よりもかなり状況がよくなってる。まずスマホ(Android)の場合だけど、これはプロジェクト名以外のどこに使ってもまず大丈夫

妹「プロジェクト名は駄目なんだ。まあそれぐらいならいいけど。一番困ってるのは変数とかだし」

「変数名とかアセット名とかは大丈夫だと思う」

www.youtube.com

f:id:una_unagi:20180604232949p:plain

「これが妹が最初に作ったゲームのやつなんだけど、中身がこれ以上ないぐらい日本語で、スマホで動かそうとしても無理だった。だけど今試したら普通にパッケージ化できて、ちゃんと動いた。ちゃんとと言っても、タッチにちゃんと反応しなかったりはするんだけど、そこはスマホ用に作ってないからしょうがない」

妹「UE4がバージョンアップしたから日本語でもよくなったのかな」

「正確なことはわからない。ただ1年ぐらい前に試した時は無理だったはずだから、UE4か、その付属してるアプリのどっちかの処理が変わったんじゃないかと」

妹「じゃあスマホはそれでOKとして、ブラウザで動かせるようにするやつは?」

「そっちはまだ研究中。HTML5の場合だとプロジェクト名とアセット名は駄目というのはわかっている。たぶんフォルダ名も

妹「そっちは結構駄目なんだ」

「日本語にしても大丈夫なアセット名もあって、たぶんブループリントから呼び出すかどうかってのが関係してそうなんだけど、とりあえずアセット名は駄目とおぼえた方が早そうだから」

妹「変数名は使っても大丈夫ってこと?」

「使っても大丈夫な場合があるのは確か。ただ日本語関係かどうかわからないけど、他にも動かなくなる条件があるらしい。ミラールートの中の、このブループリントを実行するとバグるって箇所が見つかったから、そこをもう少し調べて原因特定しないといけない」

Blenderでドーナツ作り(2) アイシングのマテリアル

f:id:una_unagi:20180603005201p:plain

youtu.be

「ドーナツ作りの続き。動画でいうとpart4の部分。この動画からは字幕がないから、動画を見ながら取ったメモを載せとくことに。他のドーナツ職人にも役立つかもしれないし」

妹「そんなにドーナツ作る人いるんだ」

「結構人気あるみたい。形状がシンプルだからキャラクターとかと違って作れそうな気がするし、見栄えもいいから」



この動画でやることは

  • ドーナツとアイシングのマテリアル設定
  • アイシングの下の方を自然な感じにするところ

前回の続きから

f:id:una_unagi:20180603005214p:plain

前回作った、ドーナツとアイシング(ドーナツにかかってる砂糖)の、2つのオブジェクトがある状態のデータを使う。

レンダリングエンジンの設定

レンダリングエンジンは色々あるという話があって
色々出来ることとか機能とか違う

右側中央、カメラのタブを選んでからRenderボタン
(ショートカットキーでやってもいいと思う)
ESCキーで元の画面に戻る

レンダリング画面のSlotは何かよくわからないけど、ここではそんなに重要じゃなさそう

画面上部のメニューから、Cycles Renderを選択。
これは新しい……新しいっていっても結構経ってるけど、綺麗な絵が作れる。

*オブジェクト非表示の説明と、ライトの移動

選択中のオブジェクトをHで非表示できるという機能の説明
ALT+Hで非表示にしたオブジェクト全てを元通りに戻せる

で、それを使って、前回作ったアイシング(ドーナツにかかってるやつ)を非表示にする
ドーナツ本体のマテリアル設定をする時に見やすいようにという意図だと思う

初期設定のライトをクリックして、移動(Gキー)を使って、ドーナツの真上あたりに移動させる
理由はよくわからないけど……見た目が違うと、ライトの違いか手順の間違いかわからないので、だいたい動画と同じ感じにしておく

ドーナツ本体のマテリアルを設定する

オブジェクトモードでドーナツ本体を選択
右側中央にあるタブで、マテリアル欄に切り替える
最初はマテリアルが何もないからNewボタンで新しいマテリアルを作る

Colorの横の白い部分をクリックして色を変える
イエロー・オレンジと言ってるけど、RGBでいうと0.8, 0.5, 0.2 ぐらいの数字
これもライトと同じで、なるべく同じ数字にしておきたい(でも動画だと早すぎて見にくい)

色を設定してもビューポートには反映されないけど、レンダリングすると色が変わってるのが確認できる
(Hキーで消した部分もレンダリングには出てくる)

ビューポートの設定を変えることで、レンダリング画像と同じ物が出るようにも出来る。この場合はHで隠した分は隠したままに出来るメリットも

スムーズシェーディングの設定はビューポート左側の設定欄(ツールシェルフ)にある
Tキーで出したり消したりできる

最初にやった時はモディファイアによる曲面化が効いてなかったけど、モディファイアの中の目玉ボタンがOFFになってたのが原因だった。初期状態ではONだけど、前の動画で色々やった時に戻してなかったらしい。

アイシングのマテリアルも設定する

アイシングの方にも同じように、スムーズシェーディングと、新しいマテリアルを設定する
マテリアルの色はピンク。0.75, 0.35, 0.8ぐらい。
ただこの色はすぐに変わるから適当でいい。

レンダリングで色が違ってたんだけど、ライトとの距離が違ってたのかも
ライトを下にもってきて、近づけるとだいぶ動画に近い絵になった

マテリアルとノードエディタ

マテリアルのサーフェイスタイプを、初期設定のDiffuse BSDFから変更するとどうなるか? という見本。同じ色だけど質感がかなり変わる

ビューポートにノードエディタを表示する
すると選択中のマテリアルをノードで編集できる画面がでてくる

UE4のやつとかに似た感じで、ピンとピンをつないでいって最終的な色を決める

でも新しいノードの追加が右クリックからじゃなく、ノードエディタ下部のメニューのAddから
もしくはSHIFT+Aキー

Mix Shaderというのが、UE4でいうLerpあたるらしい
ノードをヒモの上に動かすだけで、その中間にはさまる感じでつないでくれるのは便利

GrossyとDiffuseを混ぜた出力をしている

Diffuseを赤にしてるけど、この色も後で変わるから適当でOK
Grossy側は初期値の白のまま

赤と白が混ざって、かつ光沢みたいなのも混ざる

出力ピンのBSDFというのがなにかわかんないけど、Grossyと混ぜて光沢が出るということは、このピンにRGB以外の色情報以外のも入ってるっぽい気がする
Vector3とか4とかではなさそうな

アイシングのマテリアル調整

ビューポートを3Dに戻す

ノード編集とレンダリング画面を同時に表示するため、ビューポートを分割する方法の説明。

これはBlenderの操作の根幹になる部分で、他のソフトにないやり方だし、変になってもUndoで戻せないから、混乱しないように日本語の資料を見た方がいいと思う
(他の操作についても、細かいとこは他の資料で見た方が早そう)

ドーナツのDiffuseをピンクに戻す
HSVで0.9, 0.3, 0.9 ぐらい

Grossyを混ぜてる分、ドーナツ本体よりもちょっと反射が強くなって、材質が違うとわかるようになってる

f:id:una_unagi:20180603013606p:plain

アイシングがたれてる感を出すためのポリゴン加工

アイシングの下のラインがまっすぐなのはおかしいから、垂れる感じに加工する

ポリゴンの形状を変えるため、TABキーでエディットモードに移行する

Gキーで1箇所ずつ移動するのは大変だし、自然な感じにするのは難しいので、プロポーショナル編集のrandomを使う。

(ホイールを回転させて)範囲をひろげてから下方向に引っ張ると、同じように引っ張られる部分と、そうでもない部分があって、自然に変化する

でもそうすると変化しなくていい上の部分まで変化しちゃうのが問題

そこで上の部分のポリゴンはHキーで非表示にする
(カメラを正面にして、ワイヤーフレーム表示にする等して、裏になってるポリゴンも選択する)

非表示になってる間は、その部分がプロポーショナル編集の範囲内でも反応しなくなる

プロポーショナル編集がconnectedだと、内側の線がまっすぐのままなので、enabledに設定する

伸ばした部分がドーナツから離れすぎてるので、全体的に縮小してドーナツに合わせる
ただしドーナツにめりこまない程度に

ALT+辺を選択によるエッジループ選択を使う
縮小時にはプロポーショナル編集を無効にする

おまけ

最後はこれまでの動画同様、完成する前に飽きないためのお遊びで、アイシングの材質をエミッシブに変えてみるというもの。絶対ヤバイ物質だから食べたくはないやつ


「という感じだった」

妹「結構長いね」

「今までの動画で一番長い。よくわからないところは行ったり来たりして見直してたから余計に。でもドーナツ感を出す上で重要な回だと思うので真面目に」

妹「色とかはちゃんとこれにしないと駄目なの?」

「目分量で決めてるみたいだし、テキトーでも作れるとは思うんだけど、あとで出来上がりが違った時に、何が原因かわからなくなるから。微妙においしくなさそうなドーナツを作りたいわけではないので」

妹「同じように作れば、同じ見た目になるのかな?」

「原理的にはそうなんだけど、実際にはアイシングをたらす部分とかは、どれぐらいたらすか目分量だし、そもそもランダムで変化を加えてるから、完全に同じってわけにはいかないんだけど」