2017-12-21

【UE4】初心者が頑張る建築ビジュアライゼーション：ライティング編

おっすすみさきです。

今日の投稿はUnreal Engine 4 (UE4) Advent Calendar 2017 - Qiitaの21日目の記事になります。

qiita.com

UE4のライティング勉強したい！

いやまあぶっちゃけ公式ドキュメント見ろ、でだいたい片付けられてしまうもんですが。
それだけUE4のドキュメントが優秀ってことだね。

それだとあんまりだーっていう僕みたいな初心者のため（主に自分のため）に、ライティングなしの状態からそれっぽい状態にするチャレンジをします。

これアドカレで良いのかなぁ…？（汗

まずはライトの確認

UE4には色んな種類のライトがあります

Point Light
点光源、オムニライト、全方向性ライトとも。
UE4では電球の形をしています。
このライトから出る光は、このライトを配置した「点」から照射されます。
Spot Light
円錐型のライトです。
PointLightに絞り機能をもたせた感じですね。
Spot Lightの光線幅は円錐角（UE4：Inner Cone Angle）、光線の周りのエッジの柔らかさは半影角（UE4：Outer Cone Angle）によって決まります。
Directional Light
指向性ライト。太陽などの非常に遠方にある光源からの照明に使います。
「位置」は関係なく「向き」のみが影響します。
Sky Light
環境光に使用する特殊な光源です。
遠方の色をサンプリングして、その色で照らします。
２次光源に使用することが多いでしょうか？
（多分扱いは難しい…）

なお、UE4にはエリアライト（面光源）に相当するものはありません。
使いたい場合は発光するマテリアルを設定したStaticMeshを使いましょう。
（今回は対象外な）

では、ライトを置いてみる

ライティングのコツは、一気にいろんなライトを置かないことかなと思います。
どのライトがどこに影響を与えているのかわからなくなりますからね。

あと、出来ればライトの数は少ないほうが良いのかなと。

今回はサンプルの部屋を使いますよー

ライトなし

流石にライトがないと見えないのでUnlit表示です。 f:id:T_Sumisaki:20171220225252p:plain

太陽光を設置

太陽光となるDirectionalLightを配置します。
一番確定しやすいかな。 f:id:T_Sumisaki:20171220225505p:plain

天球を設置

今回は昼の想定で行きます。
UE4にはBP_Sky_SphereというActorが用意されていますので、これを使いましょう。
同シーンにあるDirectionalLightと紐付けると、太陽の方向をエミュレートして空の色をいい感じに変えてくれます。

f:id:T_Sumisaki:20171220230114p:plain

BP_Sky_Sphereを使わない場合は、Atomospheric Fogを調整して使うのかな。

Reflectionを使う場合は、この時点で雑に（大きめに）置いておくと良いですよ

２次光源を設置

そのままではあまりにも部屋が暗いです。
デフォルトでグローバルイルミネーションによる反射が行われているとはいえ、ちょっと窓から離れた位置が暗すぎますね。

今回はSkyLightを置きました。

f:id:T_Sumisaki:20171220230553p:plain

置き方が雑過ぎますが、まあええやろ。

f:id:T_Sumisaki:20171220232101p:plain

室内にSkyLightを置いた際、外からの光が入ってくるところ（主に窓）に、Lightmass Portalを設置しておきます。
SkyLightの品質が上がりますよ。

PostProcessを設定

とりあえずこんな感じ、ってなったらPostProcessVolumeを設置しましょう。

f:id:T_Sumisaki:20171220232548p:plain

BloomとAutoExposureを弄ります。
ほかはまあ…今じゃなくてもいいかなって。

PostProcessVolumeにはInfinite Extent(Unbound)のチェックを入れておくと領域指定が不要で楽です。
部屋ごとに印象を変えたい場合でもなければ複数置くことも無いですし。

結果

f:id:T_Sumisaki:20171220232823p:plain

ところどころムラが出てますが…まあええやろ。
ちなみにこの視点の裏側はまだ結構汚いので要修正です。

f:id:T_Sumisaki:20171220233245p:plain

なお、World SettingsのLightmass Settingsを色々弄ると色々変わるようです。
設定項目多すぎ…

どれがどれかまだ勉強中なので、ここはサンプルと勘を信じて弄っておきました。

f:id:T_Sumisaki:20171220233211p:plain

補足

建築ビジュアライゼーションでは、図面があったりするので、図面通りにライトを設置したくなりますが、
省略出来るものは省略したほうが良いです。

現実のライトに合わせすぎると、ライトが集中して重なり、ライトに×マークが付き、StationaryLightではなくMovableLightとして扱われてしまい、処理が重くなります。
（特にSpotLight、PointLightあたり）

ライトの形をReflectionで床に出す、とかでなければ、ある程度マージしたほうが良いでしょう…

参考資料

公式ドキュメント

docs.unrealengine.com

Lightmass Deep Dive vol.1のスライド

Lightmassの仕組み ~Lightmap編~ (Epic Games Japan: 篠山範明) from エピック・ゲームズ・ジャパン Epic Games Japan

www.slideshare.net

今回は頑張った。

今後も頑張って勉強していきますよ。
（ちょうどお仕事で使ってますし）

ではでは。

2017-12-14

SlackのSlash Commandsをとりあえず実装してみる

すみさきです。

最近気が緩みすぎてるのかSAN値が減りすぎてやる気が起きないのか、いろんなことが進んでないです。

というわけで息抜き回。
SlackのSlash Commandsを簡単に使ってみます。

api.slack.com

前提

今回はAWSを使用しています。

AWS API Gateway
AWS Lambda

あと、Serverless Frameworkも使います。

serverless.com

もちろんSlackのアカウントも必要です。

処理部分

まずはSlackからのリクエストを受け付ける部分を作りましょう。

新しいサービスを作成します

sls create -t aws-python3 -p SlackAppService

中にserverless.ymlというファイルがあるので以下のように編集しましょう

service: SlackAppService

provider:
  name: aws
  runtime: python3.6
  stage: dev
  region: ap-northeast-1


functions:
  hello:
    handler: handler.hello
    events:
      - http:
          path: helloworld
          method: POST

（例では配置先を東京リージョンにしてますよ）

次はhandler.pyを以下のように書き換えます

import json
from urllib.parse import parse_qsl

def hello(event, context):

    # Slackからのリクエストをパースする
    params = dict(parse_qsl(event['body']))

    # レスポンスを作成
    res_body = {'text': 'hello <@{0}>'.format(params['user_id'])}
    response = {"statusCode": 200, "body": json.dumps(res_body)}

    return response