Quantcast
Channel: historia Inc –株式会社ヒストリア
Viewing all 984 articles
Browse latest View live

[UE4] マテリアルファンクションCustomRotatorノードについて

$
0
0

どうも、渡邊です!
本日はマテリアルファンクションノードの、
CustomRotatorを紹介したいと思います。

基本的なRotatorノードとは異なり、1の値は360度となるので、非常に便利!
回転
軸も自由自在!

201611036

↑CustomRotatorの中身はこんな感じ

UVs
テクスチャの既存の座標を受け取る

Rotation Center(V2)

 回転の中心の位置を2つの座標から受け取ります。
Rotation Angle(0-1)(S)
 0-1の値を入力します。1が360度となります。

 

201611035

角度で値を入れたいので、Rotation Angleを360で割っておきます。

マテリアルインスタンス化して、

201611034

↑0度

201611033

↑90度

201611032

↑180度
好きな角度に回転できます。

 

201611037

45度など、テクスチャが斜めになると、繰り返しが見えてしまいます。

201611038

繰り返しが見えてほしくない時は、テクスチャ設定のWrapをClampに変更すればOKです。
201611039

ちゃんと見えなくなってます。
正確な値が必要な場合、非常に便利なノードですね!

他にもテクスチャベースの動作の処理ノードはたくさんあります。
覚えると表現の幅が広がりますね!
詳しいマテリアルの処理はこちらです。


設立3周年を迎えて

$
0
0

代表の佐々木です。

株式会社ヒストリアは2016年10月31日に3周年を迎え、4年目へ突入しました!

設立から3年、1人ではじめた会社でしたが、いまでは20人となりました。

このような形で3周年を迎えられたのは、取引先の方々をはじめとした、日々お世話になっている皆様のおかげです。

また、Epic Gamesの方々、そしてUnreal Engine コミュニティの皆様のおかげです。

深く、深く、感謝を申し上げます!

 

第三期は人数もプロジェクト数も増え、会社としての立ち回りを覚えていく1年となりました。

同時に、自分も社長としての役割を本格的に求められ始めた年でした。

また、多数のVRタイトルの開発、UE4によるアニメーション制作、コンソールゲーム開発、モバイルゲーム開発、ノンゲーム作品など、面白いことを次々とやらせていただいた年でもあります。

 

そしてちょうど3周年となる10月31日に、弊社がアップデート開発を行った「ナレルンダー!仮面ライダーエグゼイド」がリリースされました。

初代「ナレルンダー!」は弊社のほぼ初仕事でして、3年前に開発会社であるランド・ホー様に出向し、自分もいちプログラマーとして参加させていただきました。

それから2年が経ち、今回ランド・ホー様にご縁を頂きアップデート開発を弊社で引き継がせていただきました。

 

会社を立ち上げたときの中間目標に、「自社でまるっとゲームを制作できる体制を作る」というものがありました。

ちょうど3周年のその日にこの目標が達成できたというのは、なかなか出来すぎているなあと思ってしまいます。

 

 

次の3年はまた新しいフェイズに突入です。

ヒストリアメンバーのクリエイティビティを発揮したタイトルを世に出し、ユーザーの皆様に楽しんでいただき、会社のビジョンである「人生観を変えるような作品」を目指します。

そして、ノンゲーム部門は「人の生活を直接豊かにするコンテンツを」という目標に向かって走り出します。

 

この3年間で集まったメンバーはひとりひとり人として魅力的で、皆強力なスキルを持っています。

組織としてはまだまだ未熟ではありますが、その土台は整いつつあります。

このメンバーと、次の3年間、アグレッシブに攻めていきますので、ぜひ今後のヒストリアにご注目ください!

3rd_anniversary

[UE4] VolumeDecal (Experimental) を使ってみる

$
0
0

バージョン 4.9 で追加された VolumeDecal (Experimental) について。

 

4.13時点での情報です。

Experimentalということもあり、今後のアップデートで大きく変わる可能性もありますのでご注意ください。

 

概要

Decalと名前についていますが、いわゆるDecalとVolumeDecalとはかなり異なります。

レイマーチング法によって3次元形状をレンダリングします。

ポリゴンと異なりピクセル単位の精度で曲面が描かれます。

ピクセル毎にかなりの繰り返し処理が行われるため、処理負荷には要注意です。

 

レイマーチング法について少しだけ

(詳しくは解説しません、分からない人はぜひ調べてください!)

視点から仮想的な光線(レイと呼びます)を視線方向に進めていき、物体表面の位置をとらえるレンダリング手法の一種です。

レイを段階的に進めていくのでレイマーチングというわけです。

現在の位置から物体表面までの距離を求める関数(距離関数)によって形状が定義されます。

 

こういうのが出てきます

なめらかな球体 ノイズ (Simplex)
vd_sphere vd_noise

マンデルブロ集合 Tglad’s formula
vd_mandelbrot vd_tglad

 

 

使い方

マテリアル設定

マテリアルを作成し、プロパティを以下のように設定します。

vd_materialsettings

 

グラフの作成

次はグラフの作成です。

OpacityMaskにつながる部分について、VolumeDecal特有のルールがあります。

最も単純な、球体を作るためのグラフは以下のようになります。

vd_graph

より複雑な図形を作るには Custom ノードを用いる方が便利です。

 

入力情報

vd_lightvector

LightVectorとしてレイの現在の位置が渡されます。

この位置はDecalComponentのDecalSizeで定義される境界内の座標が(0,0,0)~(1,1,1)となるよう正規化されています。

つまり中心の座標は(0.5, 0.5, 0.5)ということになります。

(実は、通常のDeferredDecalでもこの部分は同じです。

これを用いて、テクスチャを平行に投影する以外にも色々なことができます。)

 

出力情報

OpacityMaskにレイを進めるべき距離を渡します。

いわゆる「距離関数」を定義する部分です。

vd_sphere_distancefunc

例えば上のように「(0.5, 0.5, 0.5) を中心とした半径0.3の球」を描く距離関数を定義できます。

 

曲面上で現在位置から最も近い点までの正確な距離を計算できる場合はそれを用いますが、

不可能な場合はそれを超えない範囲でなるべく大きな値を求めます。

この距離だけレイが進み、次の繰り返しに移ります。

 

 

プレビューする

レベルにDeferredDecalを配置する(Decal設定のマテリアルをD&DするだけでOK)のが手っ取り早いです。

マテリアルパラメータで動的に形状を変えたい場合等はアクターブループリントにDecalComponentをアタッチするのがよいと思います。

DecalComponentの設定

vd_settings

DecalMaterialに前の手順で作成したマテリアルを設定し、

DecalSizeをいい感じに(デフォルトではX軸方向に平べったいです)すれば出来上がりの形を見ることができます。

 

色々な形を作る

以下のページに基本図形の作り方やその合成・変形等についてのレシピが紹介されています。

これを組み合わせて色々な形を作ることができます。

http://www.iquilezles.org/www/articles/distfunctions/distfunctions.htm

このページに記載されていない合成の仕方としてはLerp(線形補間)がおすすめです。

vd_cubesphere

球と立方体の距離関数をLerpで補間するとこうなります。

補間係数を動かすことによってなめらかに変形する様子は一見の価値ありです。

 

 

おすすめテンプレート

vd_templateグラフ版

vd_template_customCustom版

使える領域が(0, 0, 0)~(1, 1, 1)では不都合な場合がよくあります。

あらかじめ中心が(0, 0, 0)になるよう(0.5, 0.5, 0.5)を引き、Scaleをかけておくことで使い勝手がよくなります。

Scaleはあとで除算し元のスケールに戻す必要があります。

Custom版にはHLSLで書かれた距離関数を大体そのまま入れられます。

ただし、元の関数内で別途定義された関数が用いられている場合、展開したコードを書く必要があります(アンリアルエディタでシェーダー関数を定義することができないため)。

 

ブーストする(取り扱い注意!)

レイを進める繰り返し回数はハードコードされており、300回になっています。

Engine内のシェーダー(DeferredDecal.usf)を編集して繰り返し回数を変えることができます(“Ctrl+Shift+.” でシェーダーを再コンパイルできます)。

これによって描画の緻密さや奥行きの限界が変化します。

 

まとめ

VolumeDecalの使い方についてざっくりと説明しました。

工夫次第で独特の表現が可能になる面白い技術です。お試しください。

[UE4] ミップをマテリアルから制御する

$
0
0

今回の記事ではテクスチャのミップ(Mip)レベルをマテリアルからコントロールする方法をご紹介します。

 

映像用途では、2K4Kなど高解像のテクスチャを使用するケースが多々あります。

 

特にキャラクター関係のアセットでは、ノーマルマップなど非常に細かい凹凸が描かれていて、見せ方によってはジャギーが目立ってしまうことがあったりします。

20161118_blog01

上図の球体には4Kのノーマルマップを割り当てています。

 

クローズアップでは質感がきれいに出ていますが、下図のように少し離れるとテクスチャの細かい部分にジャギーが目立つようになり、これではせっかく高解像度のテクスチャを使用しているのに残念な結果です。

20161118_blog02

このような場合、ノーマルマップを複数用意しておきカメラの距離に応じてブレンドするなどの方法でも解決できます。

 

ただ、やはり複数のアセットを作成・管理するのは手間が掛かりますし、修正時のことを考えるとなるべく低コストに対応したいものです。

 

そこで、マテリアルからテクスチャのミップレベルを制御し、意図的にテクスチャをぼかしてジャギーを目立たなくしてみましょう。

 

マテリアルエディタでTexture Sampleノードを選択します。

DetailパネルのMipValueModeMipLevelに切り替えます。

20161118_blog03

すると、ノードのインプットにLevelが現れます。

20161118_blog04

ここに数値を入力することでテクスチャのミップレベルを調整することが可能です。

 

試しにいくつか数値を入れてみましょう。上から下へ0から3の変化です。

20161118_blog05a

入力する数値が大きいほどミップレベルが上がる(低解像度になる)ことがわかります。

 

では、今回はアクターとの距離に応じてミップレベルを変化させる――近いと高解像度、離れると低解像度になる――というマテリアルを組んでみます。

20161118_blog09

アクターとカメラの距離を除算し、Texture SampleLevelへと入力しました。

これで前述したような問題の対策になります。

 

以上、ミップをマテリアルから制御する方法でした。

何かのご参考になれば幸いです。

[UE4] Catmull ClarkとPN Triangles

$
0
0

こんにちは!テクニカルアーティストの黒澤です。今回は一般的なDCCツールに搭載されているCatmull Clarkによるサブディビジョンサーフェイスと、UnrealEngine4のPN Trianglesの比較をしてみたいと思います。

UE4のPN Triangleですが、MaterialのDetailsのTessellationの項目で、D3D11 Tessellation ModeをPN Trianglesに変更することで適用できます。

2016-11-22_19h43_17

以外のTessellationとして、Flat Tessellationがありますが、こちらは適用しただけではメッシュの外観は変わることはありません。
メッシュの外観が変わらないことを活かして、平らな壁などに適用し、World Displacementと併用することで凹凸を与えるといった使用法になります。

 

PN Trianglesの分割数設定

PN Trianglesの分割数はMaterialのTessellation Multiplierによって決まります。(無制限に細かくはなりません)

また関連する項目として、Project SettingのRenderingのTessellationの項目にAdaptive Pixel Per Rriangleの設定があります。
こちらはマテリアルのAdaptive Tessellation(カメラからの距離に応じて動的に分割数が変わる設定)が有効なときに、何ピクセル以下で分割し始めるかをプロジェクト全体で定義します。
マテリアルの
Adaptive Tessellationが無効なときにはこの値に関係なく、常に指定した分割が行われます。

addaotivetessellation3Adaptive Tessellationの様子)

 

それでは本題に入ります。

Case 1 四角ポリゴンに対するテッセレーション

2016-11-22_19h52_52

立方体にCatmull Clarkを使用した場合、制御メッシュに内接する形でかなりきれいな球に近い形状が生成されます。
Mayaでは2キーで制御メッシュと生成されたメッシュをプレビューできます。
PN Trianglesもそれなりに球に近い形状にはなるのですが、やや角張りが目立ちます。
滑らかさ以外の大きな違いとして、Catmull Clarkは制御メッシュよりも小さくなるのに対し、PN Trianglesは法線ベクトルをみて膨らむことによりなめらかになります。

addaotivetessellation4

 

Case 2 制御メッシュに抑えのエッジを入れた形状に対するテッセレーション

2016-11-22_20h23_39

立方体のエッジ周辺にエッジループを追加し、Catmull Clarkをかけた状態です。Catmull Clarkでは適度な丸みのある角ができますが、PN Trianglesでは、法線ベクトルをみて膨らむため、細いポリゴンの部分が盛り上がってしまいます。

 

Case 3 ハードエッジを含む形状のテッセレーション

2016-11-22_20h39_41

円柱の蓋の部分をハードエッジに設定し、Catmull Clarkをかけた状態です。Catmull Clarkではハードエッジの設定は無視されます。
PN Trianglesではハードエッジの設定は有効になりますが、膨らまないために意味はありません。三角の中心に頂点を追加していくような挙動なので、ハードエッジやポリゴンの周辺エッジは頂点は増えないのです。

Case 4 三角ポリゴンで最適化された形状のテッセレーション

2016-11-22_20h54_44

最後にPN Trianglesに最適化されたポリゴン分割を考えてみたいと思います。PN Trianglesでは「ゼルダの伝説」の『トライフォース』のように三角ポリゴンを4つの三角ポリゴンへと分割していきます。そのため、Trisphereに近い形状分割(いわゆる天球体)であれば、テッセレーションの中間状態であっても非常に滑らかに分割されます。

trisphere3

 

PN Trianglesに合わせたモデリングのコツ

  • Catmull-clarkで有効な抑えのエッジは、エッジを追加しただけでは逆に膨らんでしまうため面取りを行う。
  • PN Triangleではハードエッジは設定するとメッシュの周辺と同じく膨らまなくなるので設定しない。
  • なるべく天球体に近いポリゴン割りでモデリングする。

リアルタイムでのポリゴンのテッセレーションは一時期注目されましたが、実際には殆どの場合でモデルを分割したほうが描画コストを抑えて表示できてしまいます。
そのため、ほぼ無視されてきた機能でしたが、最近ではVRで非常に有効なため(VRではノーマルマップがとても嘘っぽくみえてしまう&プレイヤーが自由に近づけるためにポリゴンの角が目立つ)再度、注目されてきました。
描画コストの高い表現には変わりないので、容量用法を守って正しく付き合いたいですね。

[UE4] UMG:AnimationのAudioTrackとEventTrackを触るついでにアトラス化しちゃおう♪

$
0
0

今回はUMGのAnimation内機能で遊びます。

■UMGのアニメーションで音を鳴らす

ネコちゃんがジャンプした時に音が鳴るように、
ジャンプしてるAnimationを1つ作ります。
1

Animationを作成して、TimeLineの【+Add】から
【Audio Track】を選択すると、
TimeLineにAudioが追加されます。
2
【+Audio】から必要なサウンドデータを選択して
4
好きなタイミングで音を鳴らすことができるようになりました。
3
カンタン!
波形も見れて分かり易いです。

ここではネコがジャンプした時に鳴るように
0.00から再生しています。

■Animation内にEventTrackを追加してキーを打つ

ネコちゃんが画面をスライドする間の
理想のタイミングで何かをさせたいとします。
6

TimeLineの【+Add】から
【Event Track】を選択すると、
TimeLineにEventsが追加されます。
5

アニメーション内の好きな場所でキーを打ち、
キーを右クリックしてPropertiesから
KeyのValueに名前を付けます。
ここでは【Jump1】としました。
7

Graphに移って【CustomEvent】を追加して
名前を先ほどキーにつけた名前【Jump1】を記入します。
8

これでEventが呼べるのでPGさんとの連携のしやすさが
上がったりと幅が広がります♪
今回は最初に作ったネコのジャンプアニメーションを【PlayAnimation】ノードで呼びました。

■アトラス化

今までUMGではアトラス化された画像を扱うのが困難でしたが、
Paper2Dの機能がUMGでも使えるようになり、大変便利です!

今回は【ドォーン!】という文字を自動で
【ド】【ォ】【ー】【ン】【!】に分けます。

Photoshopでテキストを作成して、
背景の表示を非表示(または削除)にした状態で保存します。
10

保存したPSDデータをそのままドラッグしてUE4にぶち込みます。
右クリックしてSprite Actionから【Extract Sprites】を選択すると
11

こんな画面が出るので、今回はこのまま右下の【Extract】します。
12

するとこんな感じでSpriteが追加されます。
13
【ン】や【!】が分割されてしまっているので、直します。

Spriteをダブルクリックして開き、
右上の【Edit Source Regin】で分割範囲を調整すれば完成です!
14
ありがたい。。。ありがたい。。。ありがたい。。。

最初のPSDデータ内の素材をスマートオブジェクトにしておけば後での編集も楽々です。
ドォーン!ニャーン!

使い方いろいろです!!

 

[UE4] レベルの切り替えとコリジョンの検知タイミング

$
0
0

UE4にて皆さんは状況に応じてサブレベルを切り替えるような処理を行っている場合もあるかと思います。
今日はそのサブレベルの読み込みに関して、知らないと思わぬバグを招いてしまう内容をご紹介したいと思います。

例題

例えば、あるゲーム内で時間経過によって状況が変化するステージがあるとします。ゲーム上で昼にしか起きないイベント、夜にしか出現しない敵などです。
このように昼間、夜間によって全くイベントの内容が異なる場合、管理のしやすさから夜用イベントのサブレベルと昼用イベントのサブレベルというように、一つのステージにイベント起動用のサブレベルを複数に分ける場合があると思います。
そして、イベント起動はどれもトリガーボリュームなどのイベント用アクターのコリジョンで判定するとします。

ここまでは、とくに問題ないはずです。あとはゲーム中に昼になったら夜用のサブレベルを破棄し、昼用のサブレベルを読み込む。そして夜がきたら昼用のサブレベルを破棄し、夜用のサブレベルを読み込めば、それぞれの時間帯に応じたイベントが起動できるようになるはずです。
hiru yoru
しかし、このような作りになっていた場合、コリジョンの検知タイミングをよく把握していないと、次のような問題が発生します。
昼間に夜用のイベントが発生する場所にいた場合、そのまま夜になったとしても、夜のイベントがきちんと発生しないのです。

 

検証

実際に検証してみましょう。

まずサブレベルに昼用イベントの「Event_Day.umap」、夜用イベントの「Event_Night.umap」を追加します。

level

次に各レベルにそれぞれのイベント起動用にトリガーボックスのアクターを配置します。
今回は単純に、レベルブループリントでトリガー内に入った時と出た時にデバッグ表示をするようにします。

event

あとは任意のタイミングでサブレベルを切り替れるようにパーシスタントのレベルに処理を書きます。

pl

そして、実際に起動して挙動を確かめてみると、トリガーがある場所にでサブレベルを切り替えると、トリガー内にも関わらずイベントは発生しない事が確認できます。
一度トリガーの外に出て再度入ると、きちんとBeginOverlapのイベントが起動することがわかります。

 

さて、ではサブレベルを切り替えた直後に、トリガー内にいるならBeginOverlapを走らせたい場合はどうすればいいのでしょうか。
方法はいくつかあります。

 

対策

一つ目は、トリガー側もしくはプレイヤー側(判定の対象となる側)のどちらかのコリジョンを一度無効にして、再度有効にすることです。
BeginOverlapイベントは、コリジョンの中に入った瞬間以外にも、コリジョンが有効になった瞬間にその中に既に入っている場合も呼ばれるからです。
もしサブレベルの切り替えにプレイヤー側のコリジョンを無効にする場合は、専用のコリジョンを用意し、それの有効無効を切り替えることをお勧めします。何の対策もしないままコリジョンを無効にするとそのキャラクターは地面をすり抜けてしまいますからね。
また、トリガー側のコリジョンを予め無効にしておき、BeginPlayなどの任意のタイミングでコリジョンを有効にする方法も効果的ではあります。ですが、各トリガーのブループリントごとに設定しておく必要があるなど、ワークフロー的にデメリットがありそうです。トリガー用のブリープリントが1種類か、もしくは基底クラスのブループリントを用意しておくなどの対策はありますが…

 

二つ目の解決策は、トリガー用のブループリント内のBeginPlayなど、任意のタイミングでOverlapping判定を使って自力で今トリガーの中に入っているか判定することです。

overlapping
イベントが飛んでこないなら自分で調べようというやや強引な手法になります。
他にもGetOverlappingActorsというノードを使えば、現在トリガー内に入っている全てのアクターをクラス指定で複数取得することもできるので、こちらも有効です。
overlapping2

 

そして二つ目ですが、実はこの記事を書くにあたって色々と検証していた際に偶然発見した機能です。
なんとUE4.13から指定できるようになった、アクターの詳細の「GenerateOVerlapEventsDuringLevelStreaming」をTrueにしておくことでこの問題をずばり解決できます。下手に対策を打つよりは素直にこちらの設定を有効にしておいた方が安全そうです。(むしろこのフラグで解決できる単純な話でした…)
goedls

 

まとめ

コリジョン判定のタイミングは、ゲームを作る上でとても重要なのは皆さんも知ってのとおりです。
アクターがどの状態になっていたらBeginOverlapやEndOverlapが走るのか、きちんと把握してコリジョン周りのバグを無くしていきましょう。

[UE4] 「UE4で実現できた理想のゲーム開発ワークフロー」スライド公開

$
0
0

こんにちは。代表の佐々木です。

先日2016年12月3日に関西ゲーム勉強会で、ヒストリアのワークフローについて話してきたスライドを公開します!

トークでのプレゼンテーション前提の資料なので少しわかりづらいところもありますが、要は「Blueprintによって実装ベースのワークフローが出来たよ!」という内容です。

講演タイトルは見栄えが良くなるように少し盛ってます(笑)

話のポイントは、3つです。

  • こだわりたい人がしっかりこだわるフローを組むことにより、特にプロトとプリプロフェイズのイテレーションを早くする
  • ゲームデザイナー(もしくはそのパートにおいてこだわりがある人)がBlueprintでやりたいことを実装ベースで示し、プログラマーが清書する
  • 実装ベースのワークフローを作るためには、組織作りから考える必要がある

 

カオスを乗りこなすプロトタイプ・プリプロダクションフェイズ

ゲーム制作はプロト・プリプロフェイズが非常に重要であり、そのフェイズは仕様書ベースのフローや、形式ばったマネージメントでは速度が出ません。このフェイズはアイディアを何回試すことが出来るかが重要であり、速度=クリエイティビティの発揮につながります。どのゲームも少なからずとも新規性があるため、ここで作り手自身もそのゲームに対する発見と学習を繰り返さねばなりません。如何にカオスを乗りこなすかが重要なフェイズです。

 

そのフェイズに対して、ツールのアシストと各々のスキルにより「コミュニケーションが必要な状況を排除する」ことはとても重要です。この考えは新しいものではなく、今まで企画職が好きにいじり倒せるようにパラメータを外に出したり、処理をスクリプトから行えるようにしていたことの延長線上にあります。

 

そのための組織づくり

チームメンバーの大半が自分の本職以外の部分も(スキル的に十分とは言わないまでも)実装が可能であると、自分のこだわりどころを他人に頼ることなく実現でき、さらにお互いのタスクを拾いあい、発想も自分の職種の中で閉じこもらずに、アイディアを次々と実装していくクリエイティブなチームになれます。これはUE4の各ツール群とBlueprintが可能にしたワークフローで、ヒストリアでは文化として根付きつつあります。

 

この開発体制が取れると、特に小中規模の開発はスピードとクオリティを一気に押し上げられることを実感しています。そして、何より、突き詰めた先にあるのはチームメンバーみんなの「”いい感じ”にする力」=「ゲームデザイン力」によるのだなと強く感じています。(大規模開発への適用は少し考える必要がありますが、それも少し前に小規模向きだと多く論じられていて結局大規模にもアレンジして適用できたスクラムのように、大規模にもアレンジ次第で適用できると思っています)

 

今回社内のいくつかのプロジェクトで手ごたえを感じてきたのでいったんまとめましたが、まだうちも模索中です。ゲームエンジン時代になってマネージメントも変わってきたので、このあたりに興味ある人はぜひ語り合いましょう!


[UE4]Widget Interactionコンポーネントを使ってVRで触れるUIを制作してみる!

$
0
0

みなさん、こんにちは!クボッチです。

今回はVRテンプレートを使用して、VRで触れることができるUIを制作してみます!

 

▼3DWidgetで表示するWidgetを用意する

ボタンを押したら、本日の日付と時間を表示させます。

umg_01

widget_01

▼3DWidgetを作成する

新規にBlueprintクラスを作成し、Actorを選択します。

Add ComponentでWidgetを選択し、先程作成したWidgetをUserInterFaceのWidget Classに入れます。

このままだと表面した描画されない為、裏面も見えるようにRenderingのTwo Sidedにチェックを入れます。

そして、レベルに配置できるようにします。

widget_02

 

公式ドキュメントはコチラ!

[3Dウィジェットを作成する]2.Actorブループリントをセットアップする。

※ドキュメントではActorに対してMax Interactionを決めることができたようですが、

今回のバージョン(4.14.1)で作成した際に、項目が無くなっているので、ご注意ください。

 

▼右手と左手の作成

まず、右手を作成しましょう!

VRテンプレートに入っているBP_MotionControllerの子を作成し、BP_MotionController_Rightを作成します。

右手からはボタンを押すためのセンサーを出したい為、今回は4.13で追加されたWidget Interactionコンポーネントを使用します。

widget_03

そして、右手からどれくらいの距離のWidgetに反応できるかを決めるInteraction Distanceの値を入力します。

widget_03_1

 

公式ドキュメントはコチラ!

[3Dウィジェットのインタラクションの作成]

 

次に左手を先程と同じ方法でBP_MotionController_Leftを作ります。

左手からはモーションコントローラーのボタンを押したら、Widgetを表示させます。

位置調整用のSceneコンポーネントの下にBP_MainMenuをドラック&ドロップします。

widget_04

そして、指定のボタンを押したら、表示、非表示にするようにします。

widget_04_1

 

作成した、右手と左手をSpawnさせる為にテンプレートに入っている
MotionControllerPawn内の左手の右手を生成している部分のClassを置き換えます。

widget_05

 

これで実験できる環境が整いました!

・・・だがしかし!実際に試してみると…反転した状態でWidgetが表示されてしまいました!!

widget_04_2

どうやら、左手は右手を反転させて生成されているみたいですね!

作成した左手にScaleをかけます。

widget_04_3

widget_04_4

このようにお手軽にVR上でUIを作れました!

[UE4]BPで、HUD込みのスクリーンショットを取る方法

$
0
0

みなさん、こんにちは!

本日は、建築プレゼン用等でUE4を用いた時に、

BPでHUD込みのスクリーンショットを取る方法のお話です。

 

□スクリーンショットを取る方法

スクリーンショットを取る方法はいくつかあり、

公式ドキュメントや、弊社ブログにも載っています。

○公式ドキュメント

https://docs.unrealengine.com/latest/JPN/Engine/Basics/Screenshots/index.html

○弊社ブログ

http://historia.co.jp/archives/3478

今回は、スクリーンショットをさらにBPを用いて使ってみます。

 

□BPでスクリーンショットをとってみる

 

今回は、例として建築ビジュアライゼーションで、

ウォークスルー用に作成したマップを想定して進めてみます。

同じマップは、UE4サンプルのRealisticRendering内にありますので、ダウンロードできます。

start

さらに、プロジェクトの中で、プレゼン資料に用いるHUDを作ってみます。

present

準備ができましたので、スクリーンショットを取ってみます。

公式ドキュメントに、コンソールコマンドを用いてスクリーンショットをとる方法がのっていますので、

こちらをBPのExecute Console Commandを用いて、実行してみます。

consoleshot

今回はTボタンを押すと、スクリーンショットが取られます。

すると、HUDが無視されて、ビューポート内の映像がそのまま保存されてしまいます。

screen1

どうやら、Execute Console Commandノードを用いてスクリーンショットを取ると、

HUDが無視されてしまうようです。

せっかく作成したHUDを取れなくては、苦労のかいがありません。

この問題はC++を用いて作成したBPノードで、解決することができます。

 

□C++で関数を作成する

C++で、適当なクラスを作成し、スクリーンショットをHUD込みでとる関数を作成します。

記述は下記の通りになります。

UFUNCTION(BlueprintCallable, Category = "ScreenShot")
void Screenshot(const FString & InFilename, bool bInShowUI);

void AScreenShot::Screenshot(const FString & InFilename, bool bInShowUI)
{
FScreenshotRequest SR = FScreenshotRequest();
FString savelocation = FPaths::ConvertRelativePathToFull(FPaths::GameDir());
FString filename = savelocation + FString(TEXT("/Saved/Screenshots/")) + InFilename + FString(TEXT(".png"));
SR.RequestScreenshot(filename, bInShowUI, false);
}

実装部5行目の、FString filename内で指定している /Saved/Screenshots/ 

で指定したプロジェクト内のパスへ、スクリーンショットが保存されます。

 

save

 

□ScreenShotノードを使ってみる

今回はActorクラスを用いて作成したので、まずマップ上にScreenShotクラスをドラッグします。

insert2

すると、作成したScreenShotクラスを使えるようになります。

次に、作成したScreenShotノードを、先程のExecute Console Commandを用いた処理に

置き換えます。

newscreenshot

FileNameに、保存時の名称を記入し、

Show UIにチェックをいれて、Tボタンを押してみます。

present

無事にスクリーンショットが保存されました。

また、C++でのプロジェクトの作成方法も、公式ドキュメントや、

弊社ブログでも紹介されています。

○公式ドキュメント

https://docs.unrealengine.com/latest/JPN/Programming/Introduction/index.html

○弊社ブログ

http://historia.co.jp/archives/282

 

スクリーンショット機能を使って、建築プレゼン等で、

動画、ウォークスルーだけでなく、UE4をフル活用してみましょう!

 

追記(12/28)

今回のブログで扱った内容を、プラグインとして公開しました。
下記アドレスに置いてありますので、ご活用ください!

https://github.com/historia-Inc/Blog_CaptureScreenShot

新年のご挨拶 2017年

$
0
0

新年、あけましておめでとうございます!

 

昨年中は大変お世話になりました。2016年は「アーガイルシフト」「ネコぱらいぶ」から始まり、「ナレルンダー」、「シン・ゴジラVR」、「Project LayereD」、「GRID VRICK」、「UnrealStage」と、関わらせていただいたタイトルが多く世に出せた年でした。また、自社タイトル「スペースペンギンズ」(Androidのみ配信中。iOSはもう少々お待ちください)のリリースで年を締めくくることが出来ました。

 

イベントごとも、アンリアルフェス2016大阪・横浜への展示や、自社イベントの「出張! ヒストリア」(京都・東京)、そしてぷちコン(第5回・第6回)と、楽しく開催させていただきました。

これもひとえに、取引先の皆々様、そして応援して頂いている皆様のおかげです。ふりかえると、これだけ楽しいことをやらせていただいているのは幸せだなあと実感します。

 

2017年も昨年よりさらにパワーアップし、先日発表させていただいた弊社企画・開発の「Airtone」をはじめ、様々なタイトルを皆様にお届けできるようスタッフ一同邁進して参りますので、ご期待ください。

本年もどうぞよろしくお願いいたします!

 

historia Inc.
代表取締役 佐々木 瞬

[UE4] アクターをターゲットの方に向ける方法

$
0
0

今回は対象に向かって徐々に向きを変えるような処理をいくつか紹介します。

それぞれに、利点と欠点があるため状況に応じて使い分けてください。

R Interp toとFind Look at Rotation 対象の方向へ徐々に向く

まずは以前ご紹介したRotatorまとめ記事で言うところの補間ノードRInterpToとFindLookAtRotationを使って

対象へ徐々に向きを変える処理を作成します。

この方法では、動く対象を常に追うような回転処理に向いています。

findrotation

FindLookAtRotationに回転させたいアクターの現在位置と対象の位置を入れると、ターゲットの方へ向くRotatorを返してくれます。

このRotatorをRInterpToのTargetに入れて返ってきた値をSetActorRotationに入れると徐々に向きを変える事ができます。

RInterpToのInterpSpeedによりTargetへ向く速さを調整できます。

 

ただし、このRInterpToによる回転は、必ずしも対象までの最短の軌道を通って向きを変えるものではありません。

以下のようにArrowを回し、そのArrowの回転の軌道を表示してみると

rotatearow

rinterptorotation

開始時Rotation(X=0,Y=0,Z=0)からTarget(X=0,Y=90,Z=90)までの回転ですが、上のように見た目にはかなり遠回りをしていることがわかります。

これはRotatorの補間が各軸の値ごとに補間しているからでこの時の軌道をログとして出力すると数字的には正しくTargetに向かっていることがわかります。
rotationlog

この方法は対象をざっくりと向くという感じの使い方になると思います。

 

Ease 向きを変える速度の調整がしやすい回転

この方法はこの向きからこの向きまで向かせたいというように、事前に2つの方向が決まっている時に使います。

向きを変えるスピードの調整にTimeLineを使うことができるのが特徴です。

easerotate

※4.14ではEaseノードでWARNINGが出るようですがバグトラッカーによると4.15で直るようです Ease node not considered Pure function but has no exec pins

TimeLineの編集方法などは公式ドキュメントが参考になります。また、Easeノードはこちらの記事で紹介しています。

TimeLineに0~1まで増加するカーブを入れEaseのShortestPathにチェックを入れると以下のような軌道になります。

ease

TimeLineの調整やEaseの調整により向きを変える速度を切り替えるのが容易なので演出的な要素を入れやすいのが特徴です。

また、ShortestPathにチェックを入れるとRInterp toよりも遠回りが少ない軌道での回転になります。

 

Rotate Vector Around Axis Quaternionによる回転

EaseでShortestPathにチェックを入れても下の赤い軌道のような最短にはなりませんでしたが、この方法を使うと対象まで最短の軌道を通って向きを変えることが出来ます。そのため対象へ向きを変える方法の中では一番きれいに向きを変えることが出来ます。

rinterptorotationex

この方法による実行結果は以下のとおりです。

quaternion

Quaternionによる回転はブループリントのRotateVectorAroundAxisで行います。

RInterpToと同じ用に使えるよう以下の関数を作成しました。

quaternionBP

RotatorをGetRotationXVectorで一度Vectorに変換し、2つのVectorの外積を取ることで垂直なベクトルを取得し、これを任意軸として回転させます。

また、2ベクトルのなす角を内積で求め、なす角を超える角度の回転をクランプしておきます。

これでTargetを超えて回転するのを防ぎます。

 

通常のRInterptoでは値によってはTargetまで向くことが出来ない場合がありますがそれを防げるのも利点です。

rinterpto左がQuaternion 右がRInterpTo

右の方はTargetまでたどり着けず真下向き辺りで止まってしまう。

[UE4]共有テクスチャサンプラを利用してマテリアル内で使えるテクスチャの数を増やす

$
0
0

UE4のマテリアル内でテクスチャを利用する場合、”TextureSample”というノードにTextureをアサインして使用しますが、

2017-01-18_14h24_00

DX11の仕様で、単一のシェーダー内で使用できるユニークなTextureSamplerの数は最大16個と決まっているため、

17枚以上のテクスチャを使用するとエラーとなり、マテリアルが正しく表示されません。

 
■TextureSampleを16個使用(ギリギリセーフ)

2017-01-18_13h08_16

■TextureSampleを17個使用(アウト)

2017-01-18_13h09_40

キャラクターやランドスケープなど、複数の質感を単一のマテリアルで表現する必要がある場合、16枚という制限は中々煩わしいものです。

今回は、共有テクスチャサンプラー(Shared Texture Sampler)という機能を利用して、

17個以上のTextureSampleを使えるようにしてみたいと思います。

 

TextureSampleノードを選択し、”Sampler Source”を“Shared:Wrap”“Shared Clamp”に変更します。
(“Shared:Wrap”はタイリングしたときに繰り返し。”Shared:Clamp”はタイリングしたときに繰り返さない。)

2017-01-18_14h12_29

 

↓20個のTextureSampleすべてを”Shared:Wrap”設定にした結果がこちらです。

統計情報では、TextureSampler数は1/16となっており、もちろんエラーは出ていません。

2017-01-18_14h14_03

 

この方法であれば、DX11の単一シェーダー内のテクスチャ数の限界である最大128枚までいけるようですが、

処理速度を考慮するのであれば、TextureSampleの数は少なければ少ないに越した事はありませんので、ご利用は計画的に!

[UE4] 非同期処理を実装する

$
0
0

今回はちょっとプログラム寄りのお話です。

非同期処理の話になりますが、概念を理解していて実装だけを知りたい人は前半部分は読み飛ばして下さい。

 

ゲームの更新処理にかけられる時間について

ゲームやインタラクティブコンテンツではリアルタイムで状況が変化していきます。

それらはプレイヤーの入力によって変わる事も多く、そういったものは事前に処理を行う事ができないため、その時々で更新処理を行う必要があります。

ゲームの場合だとモニターの再描画間隔(リフレッシュレート)に合わせて秒間60回もの画面更新を行うため、1回の描画にかけられる時間は 16.6ms 程度です。

この「単位時間辺りの画面更新回数」をフレームレートと呼び、「秒間に何回更新できるか」を fps(frames per second)で表現します。

秒間で60回画面更新を行う場合は 60fps と表現できます。

また、最近流行りのVRでは 90fps が必要です。

つまりは1回の描画にかけられる時間はたった 11ms 程度ということになります。

 

ではプレイ中に何か重い処理を実行してしまって、画面の描画更新が間に合わなくなったらどうなるでしょうか。

その場合は画面が更新されず、ゲームが一瞬止まったように見えます。

これがいわゆる “処理落ち” と呼ばれるものです。

ParallelTest01

処理落ちはプレイヤーの体験に影響を与え、没入感を削いでしまいます。

ゲームが面白いというのが一番大事な事ですが、どれだけ面白くても画面が何度もカクついてしまうゲームはプレイヤーも遊びたくなくなります。

 

処理をメインスレッドの外に逃がす

各種ハードウェアは別々の処理を同時に実行する仕組みを持っています。

1つの処理の実行単位のことをスレッドと呼びますが、ゲームで画面描画処理を実行するスレッドをメインスレッドと呼びます。

メインスレッドはリフレッシュレートに合わせて60秒に1回ゲームループを実行します。

先程、「画面の描画更新が間に合わなくなったら」と書きましたが、これは「メインスレッドの処理が間に合わなくなったら」に言い換えることができます。

メインスレッドが止まらないようにすることは良質なゲーム体験に繋がります。

 

ではどうしても重い処理を行いたい場合はどうすればいいのでしょうか。

その場合は処理をメインスレッドでやらなければいいのです。

スレッドはあくまで一つの処理の実行単位であり、ハードウェアが許す限りはメインスレッドとは別のスレッドを利用することが可能です。

ParallelTest02

このように処理の実行を呼び出すだけで、処理の完了を待たずに次の処理を始めることを 非同期処理 と言います。

ではこれを実際にUE4で行うにはどうすればよいのかをご説明します。

 

重い処理をメインスレッドで行った場合

ひとまず重くなりそうな処理を作ってみます。

 

static void ExecSample()
{
    // なんか重い処理
    TArray<FString> NumberStrings;
    for (int32 Number = 0; Number < 10000; ++Number)
    {
        NumberStrings.AddUnique(FText::AsNumber(Number).ToString());
    }

    // 終了通知
    if (GEngine)
    {
        GEngine->AddOnScreenDebugMessage(INDEX_NONE, 2.0f, FColor::Red, TEXT("Finish"));
    }
}

 

特に意味もない処理ですが、これは重そうです。

これを以下の様にして普通にメインスレッドから実行するとどうなるでしょうか。

 

void AParallelTestGameModeBase::ExecSampleBlocking()
{
    ExecSample();
}

 

結果はコチラ。

ParallelTest05

 

こちらは「stat UnitGraph」コマンドで処理負荷を可視化したものですが、重い処理の実行タイミングでグラフに大きな変化が見られます。

今回は重い処理の実行タイミングで 53.7ms もの時間がかかってしまったようです。

60fps を目指すと1フレームに 16.6ms しか使えないので大きくオーバーしています。

もちろんこの処理を実行したタイミングでは画面が急に止まったように見えてしまいます。

これでは問題があるので、この重い処理を別スレッドで実行してみます。

 

重い処理をメインスレッド以外で行った場合

UE4には自前でスレッドを用意しなくても、必要になった時に手軽に別スレッドで処理を実行できる FAsyncTask という仕組みがあります。

FAsyncTask に実行したい処理(タスク)を指定しつつ実行リクエストを呼び出すことで、指定されたタスクが別スレッドで実行されます。

今回は FAsyncTask と同等の機能を持ちつつ、タスクの完了時に自動で削除される FAutoDeleteAsyncTask を使って重い処理を実行してみます。

 

class FAsyncExecTask : public FNonAbandonableTask
{
    friend class FAutoDeleteAsyncTask<FAsyncExecTask>;

public:
    FAsyncExecTask(TFunction<void()> InWork)
        : Work(InWork)
    {
    }

    void DoWork()
    {
        // コンストラクタで指定された関数を実行
        Work();
    }

    FORCEINLINE TStatId GetStatId() const
    {
        RETURN_QUICK_DECLARE_CYCLE_STAT(FAsyncExecTask, STATGROUP_ThreadPoolAsyncTasks);
    }

private:
    TFunction<void()> Work;
};

 

非同期実行タスクを定義したので、これをメインスレッドから呼び出してみます。

 

void AParallelTestGameModeBase::ExecSampleParallel()
{
    auto AsyncTask = new FAutoDeleteAsyncTask<FAsyncExecTask>(ExecSample);
    AsyncTask->StartBackgroundTask();
}

 

結果はコチラ。

ParallelTest06

 

同じ重い処理を実行したにも関わらず、全く処理落ちが発生していません。

このように重くなって処理落ちを発生させてしまう可能性がある処理に関しては、別スレッドで行った方が良いです。

 

注意事項

これだけ聞くととても使いやすいように思えますが、複数のスレッドを利用するプログラム(マルチスレッドプログラム)は注意深く利用する必要があります。

例えば複数のスレッドから同時に同じリソース(とあるクラスのメンバ変数など)にアクセスした場合、競合が発生して意図しない動作となってしまう可能性があります。

そのため特に何も考えずに処理を組んでしまうとクラッシュの原因になったりもします。(例えば別スレッドでアクターのTransform情報を書き換えようものなら高頻度でクラッシュします)

このあたりは排他処理を組むことでできることが増えるのですが、その辺りはまた別の機会でご紹介しようと思います。

[UE4] AndroidManifest.xmlをカスタマイズする

$
0
0

今回はAndroid開発において必ず必要なAndroidManifest.xmlをUE4での編集方法をご紹介いたします。

 

○AndroidManifest.xmlとは

Androidでアプリを開発する際必ず必要になるxmlでここにアプリのパッケージング名やバージョン番号、使用するActivityなどなど重要な情報を記載するものです。(※1

しかしAndroidに関しての公式ドキュメントではAndroidManifest.xmlについて触れていません。というのもUE4ではこのAndroidManifest.xmlはパッケージングする際に必要なものを記載して自動で生成してくれます。なんと便利な…

なので基本的には必要になるまで気にする必要はありません

 

○パッケージングしたAPKが使用してるAndroidManifest.xmlの場所

プロジェクト名/Intermediate/Android以下

-ARM名_-指定API名_AndroidManifest.xmlという名前であります。

 

○UE4がAndroidManifest.xmlを生成してるコード

Engine\Source\Programs\UnrealBuildTool\Android\UEDeployAndroid.cs

にあるUEDeployAndroidクラス内のGenerateManifestで確認できます。

 

 

○カスタマイズする:エディタ

まずはエディタ上で編集できるものをご紹介いたします。AndroidManifest.xmlに関する設定は

プロジェクト設定(Project Settings)/ プラットフォーム(Platform)/Androidで確認できます。

 Android/カテゴリー名 エディタ上の名前

AndroidManifest.xmlでの記述

 内容説明
 APKPackaging InstallLocation

android:installLocation

アプリのインストールする場所を指定します。

・internalOnly

デフォルトで指定されてる設定で内部ストレージにのみインストールします。

外部ストレージにインストールできず、内部ストレージに空きがない場合でもインストールできません。

・auto

基本内部ストレージ優先でインストールします。内部ストレージに空きがなければ外部にインストールしようとします。両方インストール可能なので一度インストールされた後に移動する(内部から外部へなど)こともできます。

・preferExternal

外部ストレージを優先してインストールするようにします。しかしこれは保証はされてなくもし外部ストレージが存在しないか空きがないときは内部ストレージにインストールされる(はず)です。

インストール後の移動は可能なのでSDに入れたいのならこれを設定することで移動させることができます。

 APKPackaging StoreVersion

android:versionCode

GoogleStoreにアップするために最新か判定するために必要な数値

新しくアプリをアップデートしたい場合は、この番号が以前のアプリより大きくないといけません。

インストールした端末上では確認することができません。

 APKPackaging VersionDisplayName(usually x.y)

android:versionName

 バージョン名です。
こちらはユーザーが見ることができる値です。なのでStoreVersionを更新したか確認するためにもこちらも一緒に変更することが多いです。
 APKPackaging Orientation

android:screenOrientation

アプリが対応するデバイスの向きを設定します。4.14時点で対応してるのは8種類です。

portrait
reversePortrait
sensorPortrait
landscape
reverseLandscape
sensorLandscape
sensor
fullSensor

 APKPackaging Minimum SDK Version

uses-sdk android:minSdkVersion

APIの対応できる最低バージョン値 (※2)指定したバージョン以上ならアプリが動作できる(はず)

未満の場合は非対応としてインストールできなくなります。

 APKPackaging Target SDK Version

uses-sdk android:targetSdkVersion

 動作保証されてるAPIバージョン値(※2

以下の属性はすでにUE4側で追加してあるので指定しなくで大丈夫です

name

label

theme

configChanges

launchMode

screenOrientation

debuggable

 Advanced APKPackaging  Extra Tags for <application> node applicationタグに追加する属性を指定できます。(※3

hasCodeだけすでにUE4が自動生成する際必ず追加してるので不要です。

 Advanced APKPackaging  Extra Tags for UE4.GameActivity <activity> node  InGame用Activityタグに追加する属性を指定できます。(※4
 Advanced APKPackaging  Extra Strings for <activity> section 文字列でInGame用Activity以下の階層に記述することができます。

Intentfilterなどをここで指定することで追加できます。

ただし、注意点としてここに書いたものがそのままAndroidManifest.xmlに書かれるので文法には注意が必要です。

あとandroid.intent.category.LAUNCHERとandroid.intent.action.MAINはすでにInGame用のActivityで使用してますので指定できません。

 Advanced APKPackaging  Extra Strings for <application> section 文字列でapplication以下の階層に記述することができます

別のActivityを追加するなどといった場合はここで追加ができます。こちらもここに書いたものがそのままAndroidManifest.xmlに書かれるので文法には注意が必要です。

 Advanced APKPackaging  Extra Permissions 使用するパーミッションを追加します (※5)

すでに追加されてるものがあるので以下のものは指定しなくても大丈夫です

uses-sdk android:minSdkVersion

uses-sdk android:targetSdkVersion

uses-feature android:glEsVersion

android.permission.INTERNET

android.permission.WRITE_EXTERNAL_STORAGE

android.permission.ACCESS_NETWORK_STATE

android.permission.WAKE_LOCK

android.permission.READ_PHONE_STATE

com.android.vending.CHECK_LICENSE

android.permission.ACCESS_WIFI_STATE

android.permission.MODIFY_AUDIO_SETTINGS

android.permission.GET_ACCOUNTS

android.permission.VIBRATE

Launch Images Show launch image これにチェックするとスプラッシュ用のActivityを自動で生成しアプリ起動時遷移させてくれるようです。

splashscreen_landscape

新規プロジェクト作成時、Androidを起動させると出て来るやつ

チェックを外すとInGame用のactivityにそのまま遷移させてくれます。演出など加えたい場合などはUMGなどで自前したほうが編集しやすいです

プロジェクト設定(Project Settings)/ プロジェクト(Project)/パッケージ化(Packaging)

Project/カテゴリー名 エディタ上の名前

AndroidManifest.xmlでの記述

 内容説明
Packaging ForDistribution

android:debuggable

アプリのデバックモードの切り替え

チェックする= デバックオフ

チェックをはずす = デバックオン

DeveloperConsoleにアップする場合はデバックオフにしてないとアップできないのでtrueを設定する必要があります。

 

○カスタマイズする:テキストで

ほぼ編集はエディタから設定可能ですが一部テキストファイルからの指定も可能になっているのでそれについても紹介していきます。

配置位置は[プロジェクト名/Build/Android]以下の階層に配置することでパッケージングの際使用されます。 また内部では以下の名前で判定していますのでスペルミスには注意してください。

 

・ManifestActivityAdditions.txt

上記の項目[Extra Strings for <activity> section]で、できることをテキストファイルでも指定できるものです。

[Extra Strings for <activity> section]とは別に処理されるので同じものを指定すると2重定義なってしまいます。

なので使用する場合はどちらか1つに統一して管理するのがいいです

 

・ManifestApplicationAdditions.txt

上記の項目[Extra Strings for <application> section]で、できることをテキストファイルでも指定できるものです。

ManifestActivityAdditions.txt同様に別に処理されるのでどちらか1つに統一して管理するのがいいです。

 

・ManifestRequirementsAdditions.txt

上記の項目[Extra Permissions]で、できることをテキストファイルでも指定できるものです。

ManifestActivityAdditions.txt同様に別に処理されるのでどちらか1つに統一して管理するのがいいです。

 

・ManifestRequirementsOverride.txt

こちらは自分でアプリが使用するパーミッションをすべて記述するものです。

上記の項目[Extra Permissions]でもありますがアプリの中には全く使用しないものなどもあったりするので

必要なパーミッションがわかっている場合はこちらでパーミッションを指定してあげるのがいいと思います。

 

 

※1 AndroidManifest.xmlとは?

http://nobuo-create.net/manifest/

http://androidgamepark.blogspot.jp/2013/11/androidmanifestxmlmanifestxml.html

※2 APIバージョンについて

https://developer.android.com/guide/topics/manifest/uses-sdk-element.html#ApiLevels

※3 applicationに設定できる属性について

http://www.giblock.jp/labo/androidmanifest_app_props.html

※4 activityに設定できる属性について
http://www.giblock.jp/labo/androidmanifest_activity_props.html

※5 指定できるパーミッションについて

https://developer.android.com/guide/topics/manifest/uses-feature-element.html#permissions
http://pentan.info/android/app/permission_list.html


[UE4] スぺペンで採用!広告プラグイン「Universal Mobile Ads」のご紹介!

$
0
0

今回は技術的な記事ではなく、現在配信中の「スペースペンギンズ」でも採用した広告表示プラグイン「Universal Mobile Ads」をご紹介いたします

 

〇UE4の広告機能

UE4にも標準機能として広告表示機能が存在しています。UE4での広告表示に関しましては↓の公式ドキュメントの記事をご覧ください。

インゲーム広告を使用する。

しかし、UE4の広告機能ではバナー広告しか対応しておらずインタースティシャル広告やビデオ広告を表示しようとすると独自に広告のSDKを導入する必要があり、実装コストが高く、プログラマも必要になってしまいます。

「ダンジョン&バーグラー」でもインタースティシャル広告を表示しようという話になりましたが、結局はバナー広告のみとなりました。

「スペースペンギンズ」の時にはすでに「Universal Mobile Ads」が販売されていたので、試験的な意味も含めインタースティシャル広告の表示を行いたかったので採用しました。

 

〇Universal Mobile Ads

「Universal Mobile Ads」はgameDNA様が提供しているプラグインであり、バナー、インタースティシャル、ビデオの3種類の広告に対応しています。

↓ちなみにマーケットプレイスでも配信されています。

Universal Mobile Ads 2nd Edition

とても導入が簡単であり、広告の表示までスムーズに進められると思います。

※今回は長くなってしまうので導入手順の説明は説明は行いません。プラグインに同梱されているドキュメントが英語ですがとても分かりやすい内容となっていますのでそちらをご覧ください。

 

□UniversalMobileAdsの特徴

特徴、長所をいくつか挙げましたので見ていきましょう。

 

1.バナー、インタースティシャル、ビデオの3種類の広告が使用できる。

これはそのままの通り、3種類すべて使用できます。

 

2.複数の広告ネットワークを使用できる。

↑の画像を見てください。14にも及ぶ広告ネットワークを選択できます。

Google Admobのメディエーション(※)を使用するので複数の広告ネットワークを配信できます。これにより、広告掲載率を最大化して収益アップを図ることができます。

選択した広告ネットワークごとに使用できる広告の種類は変わってしまいますが、ネットワークを複数使用することによってすべて使えるようになります。

※Google Admobのメディエーションについては↓をご覧ください。

AdMob メディエーションについて

 

3.とにかく簡単。

同梱されているドキュメントがとても分かりやすいです。英語のドキュメントなのですがとても丁寧に説明されているので特につまずくことなく導入することができます。もしも、英語がわからなくても翻訳サイトを活用しましょう。意味が分からない文章になることはないと思います。

そして、実際のブループリントでの実装でもLoadノードで読み込んでShowノードで表示するだけなのでとても簡単です。

※↓の画像はシンプルに表示した場合。

一番ネックになるのは広告ネットワークを使用するための登録や設定作業ですが、パージョン2以降あたりから日本語ドキュメントが多く存在しているGoogle Admobを使用するようになったことにより、日本人にとってはかなり使いやすくなったと思います。

 

以上、駆け足気味に紹介していきましたがいかがだったでしょうか?

使ってみた感じ特に短所はないように思います。一つ上げるとすれば価格が高めな点ですね。個人で買おうと思うとかなり高く感じます。

ですが、UE4で広告を表示するとなると「Universal Mobile Ads」がとても使いやすく良いと思っています。

[UE4] Asset Localizationで多言語対応

$
0
0

今回はAsset Localizationについて解説を行いたいと思います。
この機能を使うとアセットのローカライズに対応することができます。

 

ローカライズとは、ある国の言語もとに作られた製品を別な国に対応させることで、
ただ単に翻訳するだけではなく、言語特性にそった機能が対応されなくてはいけません。

 

通常のローカライズでは

  • 言語ごとのデータを用意する
  • 言語ごとに使うデータを選択
  • 表示する
    の手順で行われます。

この切り替える処理を自力でやると文字が表示されている画面があるたびに作業が発生してしまいます。
UE4ではこの作業をアセット管理の仕組みで解決してくれる機能があります。

 

使い方
コンテントブラウザで右クリック→Asset Localization→Create Localized Assetにカーソルを合わせると
初期状態では、エディタに設定してある言語のみしか表示されません。

Contentフォルダ直下に「L10N」フォルダを作成し、更に使用する言語の名前のフォルダを作成します。

英語なら「en」
日本語なら「ja」
その他の言語を対応する場合は以下を参考にしてください。
フランス語「fr」
イタリア語「it」
ドイツ語「de」
スペイン語「es」
スペイン語(メキシコ)「es-MX」
ロシア語「ru」
アラビア語「ar」
ポルトガル語「pt-BR」
ポーランド語「pl」
韓国語「ko」
中国語「zh-CN」

フォルダを追加した状態で言語別にロードを分けたいアセット(テクスチャなど)で
右クリック→Asset Localization→Create Localized Assetにカーソルを合わせると
以下のように他の言語が選択できる様になります。

これらの言語を選択するとL10Nフォルダに作成した各言語のフォルダにアセットファイルが作られるので、
それぞれの言語に翻訳されたアセットに変更するだけです。

アセットがうまく適応されているか確認するためには、Execute Console Command「culture=(言語別フォルダ名)」を使用後、
レベルをロードし直すことにより言語が切り替わっていることを確認することができます。
※ただし、スタンドアローン起動でしか確認できないので注意です。

この機能はアセットのローカライズですのでテクスチャだけに限らず、マテリアル、パーティクル、データテーブルなどを切り替えることが可能となります。

この機能を使って世界中の人々にあなたのコンテンツを届けて見てはどうでしょうか?

 

[UE4] UE 4.15 の新機能!ポーズのスナップショットについて

$
0
0

今回は、UE4.15 の新機能である『ポーズのスナップショット機能』について書いていきたいと思います。

『ポーズのスナップショット機能』は、ランタイムで保存した Skeletal Mesh のポーズを、Animation Blueprint で利用できるというものです。

ノードの説明

ポーズの保存は、Save Pose Snapshot ノードもしくは Snapshot Pose ノードで行います。

どちらも実行時点での Skeletal Mesh のポーズ情報を保存するノードですが、Save Pose Snapshot ノードはポーズ情報に名前をつけて保存する形となるのに対し、Snapshot Pose ノードはポーズ情報を PoseSnapshot 構造体に格納します。

保存したポーズの再生は、Pose Snapshot ノードで行います。このノードは、Snapshot Name 入力ピンのみが表示されている状態で Anim Graph に追加されます。Save Pose Snapshot ノードで保存したポーズを再生するには、この Snapshot Name に名前を入力します。

Snapshot Pose ノードで保存したポーズを再生する場合は、Mode を Snapshot Pin に切り替えた上で、Snapshot 入力ピンを表示させる必要があります。

利用例

『ポーズのスナップショット機能』を利用して、操作キャラクターと同じ位置に同じポーズの Skeletal Mesh を配置する処理を組んでみます。Third Person Template をベースに作っていきます。

まず、CopyCharacter という名前の Actor 継承クラスを作ります。Skeletal Mesh Component と、PoseSnapshot 構造体の変数 (Expose on Spawn のチェックをオン) を持つだけの構成です。

次に、CopyCharacter の Skeletal Mesh で利用する Animation Blueprint を作成します。CopyCharacter の持つ PoseSnapshot 構造体を保持し、Pose Snapshot ノードで再生するだけの構成です。

最後に、ThirdPersonCharacter の Event Graph に CopyCharacter の Spawn 処理を記述し、P キーを押したときに実行できるようにします。直前に保存したポーズ情報と位置情報を渡すことで、ThirdPersonCharacter と同じ位置に同じポーズの CopyCharacter が Spawn されるようにしています。

実行するとこのようになります。一定時間経過で CopyCharacter を Destroy したり、Material を工夫したりすることで、残像の表現ができそうです。

また、ラグドールと組み合わせて使用するとこのようになります。アクションゲームなどで、前回ミスした位置に自分のキャラクターを倒しておいたりできます。

『ポーズのスナップショット機能』は簡単に扱える機能ですので、UE 4.15 を導入したら是非試してみてください。

[UE4] レイヤー分けとグループ化で散らかったアクタを整理整頓!

$
0
0

こんにちは!
昨年の12月に入社いたしました、プランナーの浅井と申します!

UE4の知識ほぼゼロにも関わらず、どうしてもUE4の開発に携わりたくて
その界隈では有名なこの会社にアタックをかけた無謀者…それがこの私です。
ただいま、UE4を扱えるようになるために絶賛奮闘中です。

そんな超初心者の私が、この4か月間でなんとか覚えたTipsをここでは披露させていただきます。
自分自身へのフィードバックと、これからUE4を始めようという方の励みになれば幸いです。

 

さて。UE4上では、レベルにたくさんアクタを配置してゲームを構築していきますが
あれもしたい、これも設定しよう!と各レベルにアクタを追加していくと
レベル上にモノがあふれかえってどれがどのレベルのアクタなのか
よく分からなくなってしまうことはないでしょうか?
…私はあります。部屋を片付けるの苦手じゃないかって?はいその通りです。

そこでUE4の標準機能である「Layers」と「Group」機能で、すっきり収納して、作業環境を整えちゃいましょう。
PhotoshopやIllustraterを使っている方たちにとっては、なじみのある機能なのではないでしょうか?

設定は簡単です。

 

①Windowから「Layers」を選んで、まずはタブを表示します。

 

 

②「Layers」タブ上で右クリックして「Create Empty Layer」を選択

 

 

③できたLayerにわかりやすい名前を付けます。

 

 

これで準備OK!

 

 

③次に、WorldOutlinerに表示されている整理したいアクタを選択します。

 

④選択したものを纏めてドラッグ&ドロップでLayerの中に収納!

 

これで、Layerの中に入ったアクタは一括で表示のON/OFFが可能になります。
同じ系統のアクタ同士を纏めておけば、いざというときに把握もしやすいと思います。
そしてこの「Layer」機能、さらに「別Layerにわたって同じアクタを登録」できちゃうところがミソ。
例えば「椅子」を「家具」と「背景」両方で管理したい場合、前述のように2つのLayerにわたって存在することが可能なのです。

 

…ところで、さらにこんなことを考えませんか?
「ああ、このレイヤー分けしたアクタ達……同時に編集できたらなぁ…」

 

出 来 る ん で す。
ここで「Group」機能の登場です。
文字通り、アクタ同士をグルーピングして、一括で移動や伸縮といった編集が可能になります。
プランナーの皆さんはPowerPointをよく使うと思いますが、「グループ化」機能と要領は同じです。

 

①まず、レベル上(もしくはWorldOutLiner上)でGroupにしたいアクタを複数選択します。

 
②選択した状態で右クリック!出てきたウィンドウの項目「Group」を選択。

 

 

たったこれだけ。ね、簡単でしょう?

Groupにしたアクタを1つでも選択すれば、Groupにしたアクタすべてが自動的に選択されます。
その状態でアクタの伸縮・拡大・向きを簡単に変更できます。

 

こんな風にね。

 

 


グループでずらしたり…

 

グループで回したり…

 


グループで拡大したり…

 

例えば、カフェテラスや、植え込みなどのアクタをある程度セットにして量産したい時など
Layerでアクタを整理したのち、Group化で一括管理すると管理もしやすくて、とても便利ですよ。

 

 

 

ちなみに解除方法も簡単です!

①解除したいアクタを選択して右クリック

 

②Groupから「UnGroup」選んで解除

 

LayersとGroupを使って、片付け上手な開発環境を手に入れましょう!

 

 

[UE4] RotateAboutAxisでオブジェクトを回転する

$
0
0

こんにちは!テクニカルアーティストの黒澤です。
今回はRotateAboutAxisでオブジェクトを回転する方法について書きます。

UnrealEngine4にはRotateAboutAxisというオブジェクトを回転させる便利なノードがあります。さっそく使って見ましょう!

  • NormalizedRotationAxisには回転する軸をいれます。
    RGBがXYZにあたりますので変数化して調整できるようにしました。
  • RotationAngleには回転させたい角度をいれます。
    時間とともに回転させたいのでTimeに変数をMultiplyして調整できるようにしました。
  • PivotPointには回転の中心をいれます。
    オブジェクトのピボットポイントを使いました。
  • Positionにはオブジェクトの位置をいれます。
    通常はWorldPositionを入れます。

パラメータを接続したノードをWorldPositionOffsetにつなぎます。

グレーマンに使用してみましょう。


予想通り回転しました。

しかし陰影がどこか変です。
実はRotateAboutAxisで回転した場合、法線の再計算は行わないので陰影は元のメッシュに焼き付いたようにみえてしまうのです。

そこで法線にも処理を加えてRotateAboutAxisで回転した結果を法線に加えてみます。
基本的にはRotateAboutAxisと同じ処理ですが、PositionにはVertexNormalWSを使用します。
RotateAboutAxisは出力する値は元の座標からの差分なので、絶対座標ではありません。そこで元のNormal(VertexNormalWS)を加算して現在の法線を求めます。その値をNormalizeし、さらにWorldSpaceからTangentSpaceに変換することで、回転した結果に合わせた法線を作りました。
こちらの値をNormalに接続します。

マネキンはレイヤードマテリアルを多用しているので少しわかりにくいですが、通常はNormalMapと合成してNormalに接続します。


正しい結果になりました。

ブログをまとめている際に気がついたのですが、じつはFixRotateAboutAxisNormalsというマテリアルファンクションがありました…
ファンクションの中身を見てみましたが、処理は全く同じですね。特に問題がなければこちらを使うのがいいでしょう。
レイヤードマテリアルを使用していないケースで、FixRotateAboutAxisNormalsを使用した場合は以下のようになります。

ーーー おまけ ーーー

> 猫ドリル <

ちなみに弊社で開発中のAirToneでは音楽に合わせて様々なものを動かしています。

今回紹介したRotateAboutAxisも使用しているので、ぜひ注目してみてください!

Viewing all 984 articles
Browse latest View live


<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>