test

マテリアルのノードのメモ（波テクスチャ、カラーランプ）

プロシージャルなマテリアルの勉強中です。まだまだざっくりした理解のため、ノードネットワークと出来上がるイメージがなかなかつながらないので、作業中のメモを残していこうと思います（随時更新）。

波テクスチャを使ったパターン生成

波テクスチャは、線状（バンド）または円状（リング）に…→白→黒→白→…のパターンを作る

波を重ねることでパターンができる

UV座標を取得し（※要UV展開）、マッピングノードで回転や位置をずらすと、様々なパターンができる

同じ入力でも、ミックスの仕方で結果が変わる

ノコギリ波を逆位相で入力、位置のオフセットをとって加算すると、シャープなパターンも作れる（実際には灰色部分に濃淡は発生しているので、2値マスクっぽいものが必要ならばPower→Clampをかけるなどするといい）

Photoshopなどでのレイヤー合成モードがイメージできればなんとなく理解できると思う

カラーランプについて

カラーランプは値のマッピング、入力された画像の濃淡に対しカラーバンド（グラデーションみたいになってるやつ）上の色を割り当てていく…みたいなイメージ。最も暗い黒にカラーバンドの左端の色、最も明るい白に右端の色がマップされる。グラデーションを作るノードではない（グラデーションは「テクスチャ＞グラデーションテクスチャ」ノード）

カラーバンド上の色の範囲と補間方法を変更することで、色の適用範囲を調整することができる。

内積をカラーランプにつなぐと簡単なトゥーン表現ができる

（参考1）Blender(cycles)で法線を利用したセルルックマテリアル

（参考2）Normal - Blender Cycles memo

SceneCaptureComponentとRenderTargetで雑なクロマキー

この記事はUnreal Engine 4 (UE4) その2 Advent Calendar 2017の23日目の記事です。

Unreal Engine 4 (UE4) その2 Advent Calendar 2017 - Qiita

---

やりたかったこと

youtu.be

小ネタ。説明が難しいですが、キャラクターのアニメーションと同期してUIのキャラも動かしたい、そういう機能です。いいやり方がわからなかったので、SceneCaptureComponentとRenderTargetでクロマキー処理してなんとなく実装しました。

やったこと

1：撮影準備

SceneCaptureCamera2DアクターとRenderTarget用のテクスチャを準備。

現場に影響のない場所に撮影場所を用意し、被写体アクターとSceneCaptureCamera2Dアクターを移動。撮影場所は後々型抜きしやすいよう、Unlitなマテリアルでできた壁で囲んでおきます。

２：各設定

UI配置するため、UI用のマテリアルを作ります（マテリアル属性をUserInterfaceに）。RenderTargetの画像からクロマキーのキーカラーの差を取り二値化することで、そこそこきれいな切り抜き画像が得られます。

Widgetを用意し、先ほど作ったマテリアルをimageに貼り付けます。ボックスのサイズはRenderTargetの設定によるので、必要に応じて調整します。

 あとはトリガー作ってアニメの再生設定するだけです。お疲れさまでした。

顧客が本当に必要だったもの

本当はRenderTargetにMaterialを適用するものをやってみたかったのですが、FindCollisionUVノードが思うように動作せず諦めました。AnswerHubに類似の件はありましたが解決が見えず、どうしたものか…

"Find Collision UV" always returns zero for Skeletal Meshes - UE4 AnswerHub

Find Collision UV node doesn't work - UE4 AnswerHub

---

お読みいただきありがとうございました。

明日はdonbutsu17さんの「NavMesh/NavSystem」です。よろしくお願いします。

SE制作イベントレポートその2

前回の続きです。

ミキサーを使ってみる

今回ミキサーで使用することになるのは、ミキサーウィンドウのエフェクトスロットの部分のみです。各Slotの「右向き▼」の辺りをクリックすると、ステップシーケンサでインストゥルメントを選択したときのようなメニュー（チャンネルラック）が出てくるので、そこから必要なエフェクトを選択していくことになります。

この記事では、当日使用した、エフェクトの中でも特に主要なものを取り上げます（が、この辺りから、僕がついていくのに手いっぱいになってメモがあんまりとれてなかったり、専門用語を勘違いして覚えてたりしてますので、内容が不十分だったり間違っていたりしたらすいません。可能な限り補足したつもりですが…）。

ディレイ

同じ音を遅延して重ね合わせる感じの効果です。重ね方次第では、元の音が思わぬ音色を出したりすることも。当日は「Fruity delay 2」エフェクトを使いました。

• INPUT：入力する元の音のPANや音量の変更。
• FEEDBACK：ディレイする音の数（VOL）やしきい値以上の周波数のカット（CUT)。「NORMAL/INVERT/P.PONG」は入力音のPANに対してどうディレイ音を返すかを指定するもの（入力PANに偏りがある状態でP.PONGを選ぶと、左右交互に<ピンポンするような>音になる）
• TIME：ディレイ音を遅らせる時間（TIME）と、左右の音のズレ（OFS=オフセット）
• DRY：エフェクトをかけた音をどのぐらい通すか

リバーブ

残響効果。反響音を加えて空間の広がりを与えます。今回使用したものは「Fruity Reverb 2」。

左側の円筒は、リバーブを適用する仮想的な空間の図です。たくさんのパラメータが並びますが、影響が大きいのはSIZEとDRY/WET。

• SIZE：空間を広げたり縮めたりします。円筒のサイズも変わります。
• DRY/WET：原音とエフェクトをかけた音をどれぐらい通すかを調整します。WETが大きいと、円筒のビジュアルもエミッシブが強くなります。

フィルター

音の特定周波数をカットします。使用したものは「Fruity Filter」（More Pluginsから選択する必要あり）。

Cutoffする周波数の値を決め、LowPass/BandPass/HighPassでカットする程度を調整することになります。

• Cutoff freq：この周波数を基準にカットする帯域を決めます。
• Resonance：共振、共鳴。カットオフ付近の音を強調してハウリングっぽさを出します。
• Low pass / High pass：Cutoff周波数より低い / 高い音のみ通します。
• BandPass：Cutoff周波数からバンド幅分の周波数を通します。

イコライザー

周波数を分割し、特定の部分を持ち上げたり抑えたりするエフェクトですが、波形をビジュアルで確認することもできます。当日はフィルターの効果を確認するため、「Fruity parametric EQ 2」を使用しました。

ディストーション

歪みを与えるエフェクトです。「Fruity Blood Overdrive」というエフェクトが紹介されましたが、いまいち8bitサウンドでは効果を実感しづらいとのことでカットされましたのでこちらも割愛します。

その他

Create Automation Clip

ダイヤルをぐりぐり回す感覚の入力をそのまま音として使いたいというとき、便利なのがCreateAutomationClip機能です。

ダイヤルの上で右クリックして選択します。

プレイリストにこんな感じのが出てきますので、広げたり点を増やしたりします。

波形のとおり入力が再現されます。

ボイス素材の使い方

FL12でのボイス素材は、コンテンツブラウザから流用する形で使えます（FL10にはspeech synthesizerがあったのに…）。

読ませたいテキストや声質、音階などを選んでAcceptを押します。カスタムすると保存ダイアログが出ますので、任意の場所に保存してください。

まとめ

大体のイベント内容はこんな感じでした（後はVocorderの説明もあったんですが、自分の古いFLとインターフェースが変わってて追えなかったので、そこはいつかフォローしたいところです）。わかりやすく、楽しい、いい内容だったとおもいます。

「サウンドエフェクトは難しくないからどんどんやってみよう、素材を拾ってきてもそのまま使うのでなく、混ぜたり加工したりしてそのまま出さないようにしよう！」というのが大福さんの言ですので、ぜひこれを生かして自作に挑戦したいものですね。

SE制作イベントレポートその1

大福さん（@dfk_ohnuma）が主催のサウンドエフェクト制作イベントがありました。SEだけでなく、DAWの使い方としても勉強になりました。そのときのメモ起こしです。

nagogebu.connpass.com

準備

• 今回使うDAWは、FLStudio（https://www.image-line.com/flstudio/）。Free版には、保存したファイルを読み込めなかったり、終了時毎回製品版への案内が入ったりしますが、それ以外はほぼ制限はないので、SE制作についてはこれでも十分有用。なお、ライフタイムフリーアップグレードという独特のライセンス形式をとっており、約3万円ほどの投資で一生使えるので、懐に余裕があれば買いきってしまうのも手。あと公式マスコットFL-Chanがかわいい。
• 簡単にピコピコサウンドを作れるmagical 8bit Plug（http://www.ymck.net/download/magical8bitplug/index.html）というVSTプラグインを使います。ダウンロードのうえ解凍し、magical8bitPlug3.dllをプラグインフォルダ（32bit版は「C: > Program Files(x86) > VstPlugins」、64bit版は「C: > Program Files > Common Files > VST2」がたぶんデフォルト）にコピーします。要管理者権限。
• 上記プラグインを使えるようにするため、Refreshを行う必要があります。FLStudioを起動し、メニューバー「ADD > MorePlugins」からSelect generator pluginウィンドウを呼び出し、ウィンドウ下部「ManagePlugins」からPluginManagerを起動します。そのウィンドウ左上「StartScan」を実行し、処理が終わるまで待ちます。
• 今回使う範囲でのUIの大雑把な理解

  

音を出してみる

1. インストゥルメントにmagic8bitPlugを設定します。インストゥルメントのボタンの上で右クリックしたメニューからInsertを選べばチャンネルが増えます（Replaceならチャンネルを増やさず置き換えに）。ここのメニュー（チャンネルラック）にmagic～がない場合はmore pluginsから選べばOK。チャンネルラックに常設したいときはADDします（こちらの記事など参照）

   

2. FLStudioは、パソコンキーボード配列に鍵盤の配置が模してあります。適当に1音鳴らしたいときは好きなキーを叩いてみるといいです（音がならない場合は実在しない黒鍵部分だと思います）。
3. ステップシーケンサの右半分に並ぶ16個のボタンは、1小節を16分割したリズムエディタです。ここを左/右クリックでオン/オフぽちぽちやるだけでリズムが出来上がる優れもので、これだけでのも楽しいですが、音の高さも同時に変更するならピアノロールが便利。先ほどインストゥルメント上で右クリックしたときに出たメニューの、一番上にある「Piano roll」を選ぶとピアノロール画面が出てきます。
4. 1でインストゥルメントを設定したときに出てきたシンセサイザー（正確な言い方ではないかもしれません…）とピアノロールで、簡単な1小節の音を作ってみます。なお、SEに関していえばテンポは（作りたいものにもよるでしょうが）超ハイテンポくらいでちょうどいい聞こえ方するみたいです。当日は500くらいで設定してました。

   

5. magic8bitPlugのシンセサイザーにおけるツマミでは、大体次の調整ができます。色々いじっていい感じの音にしましょう。
   
   • OscKind：波形そのものの変更
   • Volume：音量、そのまんま
   • Attack：最大の音量に達するまでの時間
   • Decay：次のSusLevelまで減衰するまでの時間
   • SusLevel：最大音から減衰後、維持される音量
   • Release：音の入力がなくなってからゼロになるまでの時間
   • BendRange（当日説明なくってちょっとわかりません…）
   • SweepSwitch：同じ音入力のまま途中で波長を上げたり下げたりする
   • SweepTime：上のSweepSwitchが機能しはじめる時間
   ポイント：ポジティブに感じるSEは音を尻上がりに、ネガティブはその逆がベタな定石だとか。
6. 必要に応じて書き出します（メニューバー「FILE→Export」）。今回はwavの例ですが以下に変更した点を書いておきます。
   • Project typeのMode：ステップシーケンサで作ったパターンを書き出すか、（今回は使ってない）Playlist上で編集しているFull songで出力するかを選択します
   • WAV Pitch depth：16bit、24bit、32bitが選択できますが、一般的なサウンドは16bit設定でOK
   • Quality：デフォルトは16point sincとかになってますが、もっと高品質に出力できます。高すぎる設定だと処理に時間かかるかもよ、みたいな警告は出ますが、今どきのPCなら512-point sincで余裕とのこと

   

---

これで作曲→出力ができました。ここまでの操作でも特徴のあるサウンドが作れますが、これをミキサーにかけることで、さらに濃い味付けができます。（気力があれば）次回はミキサーを使って変調するところのメモを書く予定です。

関西UE4GamaJam参加顛末記～その２

というわけで忘れないうちに前回の続きです。GameJam2日目、果たしてプロジェクトはどうなってしまったのか…？！

１．宿題作業

GameJam1日目は終わっても、自分の作業は引き続き進めます。クラナガさんのラフをもとにスプライト作り。3アクションを5スプライトで実現するという割と無茶なオーダーでしたが、クラナガさんのラフがよく、3コマアニメでも動きがはっきり出るイラストとなっていました。そこで、後の使いまわしと、ゲーム世界観との相性を考え、今回はベクターデータとして作成することにしました。

基本のポーズはこんな感じ。1体制作時点で2時間経過。翌朝のこともあり、この日作れたのはここまで。

…いや実はこの時点で5つできてるはずだったんだ…。ベクターなんで各パーツは使いまわしできるし、差分パターンなんてちょいちょいとできると…思ってたんだ…。アクションが結構激しくて使いまわしできないってことに気付くまでは…（失敗その5）。

２．2日目朝作業～昼

「翌朝にはスプライト入れてアニメのタイミング作りできるかも」とか言ってた手前、戦犯気分の会場入り。状況を説明して、昼までに何とか仕上げる約束をし、ひたすら作業に没頭。この間、他の方の作業を見る余裕なくなっており、後の悲劇に…。

12時も30分を過ぎたところでようやく全パターン作成終了。チシさんにスプライトを渡して一息。同じくらいの時間に村瀬さんが別件で退場。合間を見てつくってくださったタイトルロゴとBlender製モデルを託される。

３．昼～作業終了まで

残りのタスクを書き出し、マージ作業への取り掛かりを16時30分からとして各作業の詰めに入ってもらう。

まずスプライトによるアニメーションをどう実装するか検討する。UE4にはPaper2Dがあるのだが、今回はチーム内に使用経験者がおらず、残り時間での解決が難しいとのことで断念。代わりにアクターにスタティックメッシュを数枚セットし、コンポーネントのvisibilityを切り替えることで疑似的なアニメーションを行うことにした。

また、マージに備えて分担作業中のレベルをサブレベルに分ける作業を始めてもらう。サブレベルについての質問があったので、持参していた極本の当該箇所を示して読んでもらうよう指示する（ドヤ顔で）。このとき、ついでに説明をちゃんとしておけば後の悲劇の一つが避けられたのだが…。問題が発生。この日、ノートPCを所持していない学生の方がバンタンのPCを借りて別館で作業をしていたのだが、その方の行方がわからなくなり探し回る羽目に。そちらの対応をしているうちに理解の確認を怠ったことが失敗その6。

自チームから離れているうちに、alweiさんからチーム進捗について「マージ作業に取り掛かるの遅すぎ！」と重大な懸念を指摘される。ここで、この日昼からの作業見積もりの甘さが露呈する（失敗その7）。急遽、その時点での作業を停止しマージにかかるが、これによりアセットやゲーム性が大部分

• タイトル画面は作りこみが間に合わず仮塗りをそのまま採用することに
• 本来、ビルを破壊しストレスゲージを０にすることでステージクリアする条件のはずがカウンターのバインドに失敗し飾りになってしまったため破棄
• 必殺技の演出のためのカットインがサブレベル化できておらず作業も間に合わないということで没
• 効果音はほぼ未実装
• その他時間があれば実装するはずだったステージレベルについても軒並み没

それでもそこからなるべく間に合う要素を盛り込んだり、タイトル画面をさくっと（チシさんが）作ってくださったりしながら、時間ぎりぎりでパッケージング完成し、作業終了。なんとかプレゼン発表へと駆け込むことができました。

---

そんなわけでずいぶん味気ない感じですが今回はここまで。次回、これを振り返ってのまとめを書きます。

関西UE4GamaJam参加顛末記～その１

2015/10/11-12にバンタンゲームアカデミー大阪校で開催された、関西UE4GameJamに参加しました報告。

作ってたのはこれ↓

社畜ちゃん！#KansaiUE4Jam https://t.co/TvfYUTldub

— alwei (@aizen76) 2015, 10月 12

どんな感じのイベントやってん？

ゲームエンジンUnrealEngine4を使って2日間でゲーム1本作っちゃおうぜってやつです。一般参加の二十数名とバンタンの学生さん合わせて四十余名が、最終的に6チームに分かれていろんな作品に取り組みました。詳しくはハッシュタグ（#KansaiUE4Jam）か、栗坂こなべさん（@kurisaka_konabe）によるTogetterまとめなど。

で、君は何やってたの？

今回はリーダー役を拝命しましたので、見よう見まねでまとめ役やってました。自分のチーム構成は

• ワイ（リーダー、UE、デザ）
• チシさん（@tishi_Za、UE）
• 村瀬さん（@murase_syuka、UE、Blender、デザ）
• アオさん（@_YoshioAo、学生、デザ）
• カワノさん（学生、UE）
• ナガクラさん（学生、デザ）

という比較的バランス構成。今回は学生さんに主体的な役割を振りたかったのと、なんでもやる人が不在だったために、当初から自分はほぼ雑用としての立ち回りを意識していました。

どんな流れで進んだの？＆やらかした件は？

聞きかじりのワークフローを無理くり回しました（いろいろ失敗しました）。今回のGameJamが終わってから投稿されたこなべさんの下のエントリがとても模範的な解答になっているのですが、ひとまずうまくいかなかったことも含めて当日の進み方を書いてみます。

１．自己紹介とブレスト

軽く自己紹介と保有スキルの確認をしました。その後ブレストへ。当日、自分の所有するLeapMotionを持参していたので、サンプルを試して想像を膨らませつつ、ガジェットに引っ張られすぎないように、ゲームで行う体験の抽象化や自分が過去遊んだアナログゲーム、ゲームとは関係なく今やってみたいことなどを思い思いに語り、系統ごとに整理しました。そのうち「ブラック企業」「叩き潰す」のワードを中心にチームの関心が集中したので、2要素をベースに作成に取り掛かることを決定（この時点でまだ主人公が社畜ちゃんかどうかとか、ゲーム仕様、コンセプトアートなど一切決めてなかったことが失敗その１）。

ちなみに紳士的発言とか男の夢とか連呼していたのはチームを盛り上げるためのやむを得ない手段なのであって僕は悪くない。

２．ゲーム仕様と必要アセットの確認、作業分担

午後に入ってさあ作業を分けようとしたところで、ようやくゲーム仕様や必要アセットのピックアップが必要だと気付く。コンセプトアート代わりにプレイ画面のラフ画を村瀬さんが書き、基本の動きが決まったところでチシさんにホワイトボックスの作成をお任せしました（が、この時点でまだ「ブラック企業を物理的に叩き潰すのか、書類のようなものにハンコを押すと会社が倒産する（のを視覚的に見せる爆発が起こる）のか」といった視覚演出やカメラ位置、プレイヤーキャラとビルの大きさの対比についてとか話してた。コンセプトにこだわる意見も多かったけど、GameJamで厳密な定義が必要かというとやや疑問。これも早いうちに切り捨てておくべきだったかも。失敗その２）。

シンプルなゲームロジックを採用し2Dスプライトを選び、UEで行わなければならない作業を減らしたことで、UEを使えないデザイナにもアセット制作で活躍してもらうことができるようになったが、反面、肝心のアセットができなければ絵面ができあがらないという時間勝負のプロジェクトとなってしまいました（もちろん代替で済ませる方法も考えてはいましたが…。また、シンプルさゆえにプログラマが持て余し気味になり、アセット制作に回ってもらうことになったことは、チーム特性に対して適正なゲームの複雑さの検討が必要という次回以降の課題だと思う。失敗その３）。

この時点での作業分担は次のとおり。

• ワイ：背景制作（のちに没）、SEなどアセット探し
• チシさん：ホワイトボックス（のちにプロジェクトのベースファイル、メイン実装）
• 村瀬さん：Blenderでアセット制作、素材探し
• アオさん：UI作成
• カワノさん：サブシステム（カットイン）制作
• ナガクラさん：キャラクタースプライト（ラフ）作成

 3．1日目終了まで

作業は分担したもののそれぞれの過程で疑問が噴出することに…。例えば

• GameJamで二次創作はどうなのか
• バックストーリーに対しゲームクリア条件がこれでいいのか
• 背景が五月蠅くなって目標が視認しにくいのでは

など。逐次それらを検討していくものの、手戻りや没アセットをかなり出してしまう（失敗4）。本来そのように投げかけてくださった疑問は自分がもっと早い段階で意思決定しておくべきものだったのだと猛省。

 終了1時間前時点でキャラクタースプライトのラフができあがるも、当日作業の続行は無理と判断し、線画起こしを自分が引き取り、持ち帰っての作業に決めました。ナガクラさんには引き続きタイトル画像の作成を依頼してこの日は終了。

また、UIの仮アセットをプログラムと連動させるため、チシさんとアオさんがこの段階から共同作業の様相となりました。

そんなこんなで1日目終わって、進捗は依然ホワイトボックス状態、アセットの大部分が間に合うかどうかで完成度が変わるという、かなり遅れの目立つ流れに。

ここまでのまとめ

細部のつめが甘いまま進めたため、大量のムダを生んだ。

---

その２に続くかも