原カバンは鞄のお店ではありません。

Unityを使ったゲーム制作のあれこれを綴っていきます。

【アセット紹介】Spriteに厚みをつけて立体化する『厚み付けUnityスクリプト』

ショートメール

携帯のショートメールに送られてくる「〇〇からお得なお知らせ」はちっともお得じゃないと思うキャリア携帯被害者の皆さんこんにちは。あれって通知を停止することはできないんでしょうか?やっぱりスマホは白ロムに限りますね。

 

BitSummit

既に発表になっていますが、5月22~24日に京都の「みやこめっせ」で開催される【BitSummit PUNCH】に開発中のリズムゲーム「Under A Groove」が出展されます。

単独で参加するいつもの展示会とは異なり、今回は電ファミニコゲーマー様のブースで紹介していただく形となっているので、開催期間中に私が試遊される方をお出迎えするという事はありません。なので訪れた方の感想やリアクションを直接頂くという事はできませんが、期間中のどこか一日は会場を訪れてブースの様子を視察したいと思っています。
BitSummitは国内で開催されるインディーゲーム展示会の中では最大級の展示会と言ってよい大型イベントで、期間の長さや参加費用の高さ等でこれまでは参加を断念していたのですが、こうした形で参加することが出来て大変有難く思います。
出展内容はまた改めてお知らせしますが、より多くの方に楽しんでいただける物を展示したいと思っていますので当日会場に足を運ぶ予定の方は電ファミニコゲーマー様のブースを何卒宜しくお願い致します。

電ファミニコゲーマー様のブースでは私のタイトル以外にも15タイトル程インディーゲームが展示される予定らしいので、このブースだけでも結構バラエティーに富んだゲームが披露されるのではないでしょうか、上のマップを見るとかなり大きなブースなのでどんな展示になるのか今から楽しみです。

 

気になるアセット

自身がゲーム制作を行っている事もあり、Unity関連、ゲーム制作関連のSNSを頻繁にチェックしていると、思わず気になるアセットに行きついたりします。
今回は「2Dスプライトに厚みを持たせて3D化する」というアセットに行きついたのでそのご紹介です。

Thick Sprite Mesh

assetstore.unity.com

■厚み付けUnityスクリプト

shishou.booth.pm

同じ作者の方がUnityのアセットストアとBOOTH両方で販売していますが、アセットストアがドル建て、BOOTHが円建てとなっているので円安の現在ならBOOOTHの方が圧倒的に安いです。
機能としてはアセット名の通り2Dスプライトに厚みを付けて3D化させることができます。

 

使い方

アセットを導入したらシーン内に空のオブジェクトを作成し、そこに「Thick Sprite Mesh」コンポーネントをアタッチします。

Inspector内のFront>Spriteの項目に厚みを付けたいSprite画像を設定すると自動的に3Dメッシュが生成されます。

厚みの幅はSide>Thicknessで変更可能で、表面や側面の色はFront、SideそれぞれのMaterialを指定することで変更することができます。
(側面の場合はColorのModeで色指定することも可能)

 

Materialを設定すると・・・

正面、側面の色を変えられます

ただ、側面のMaterialについてはUV指定が特殊なので、付随している日本語のドキュメントを参考にすると良いと思います。

 

メッシュ化の精度

作者の方によるとこのアセットでは2Dスプライトから3Dメッシュを生成する際にPolygonCollider2Dを元に輪郭を抽出して厚みをつけているようです。
このためColliderの精度(形状)によっては思った通りの形でメッシュ化されないケースがあります。

下の図では左の車のSpriteと比較すると窓の形が歪んでいるのが分かると思います。

PolygonCollider2Dは基本的にSpriteのアルファ情報から生成されるため、Collderの精度を上げるにはSprite画像の解像度を上げる事になりますが、それでも満足する結果が得られない場合はSprite EditorによりColliderの頂点を修正します。

Projectフォルダから対象のSpriteを選択してInspector内に「SpriteEditor」のボタンを押下します。

その後、SpriteEditorでCustom Physics Shapeを選択すればコライダーの編集画面になります。

Outline ToolのOutline Detailをスライダー調整しGenerateボタンを押して頂点を増やします。

その後、「Thick Sprite Mesh」コンポーネントの右上「…」の欄をクリック⇒Refreshを選択

頂点を増やしたColliderを元にSpriteの輪郭が抽出され3Dメッシュ化します。

 

【Unity】プロジェクト内のアセットの名前を一括変換できるツール「Unity All Renamer」

送別会

「今月で退職される方に贈るプレゼントのカンパを募ります」のメッセージを返信期日を過ぎて読んだ薄情な皆さんこんにちは。ごめんなさい、色々あってメッセージを見落としてました。ああ、来週の送別会に出席するのが辛い。

 

出資金付きコンテスト

最近XのTLで「出資金(賞金)付きコンテスト」が減ったか増えたかの議論になってましたが、確かに他業種からゲーム参入という形での出資金付きコンテストは減った気がしますね。きっと出資してゲームを作っても利益にならなかったり、そもそもリリースまで至らないケースもあったりで継続して続けよう、という形にならなかったのでしょう。非常に残念ですが、そういった指摘を上げると「嫉妬してる」の一言で片づけられてしまうのが大変口惜しい。まぁ実力の世界ですからね。

 

色々と優しいゲーム

2年ぐらい前の展示会で試遊させてもらい、それ以降気になっていたゲームが最近リリースされたので早速購入して遊んでみました。

タイトルからゲーム内容が大体イメージできると思いますが、体からロープが伸びる「ロープくん」を操作して、敵を捕縛したり電気を送電したり光線を反射させステージを攻略していくアクションパズルゲームです。
幾種類かのロープを使い分け設置と解除を駆使して進路を切り開いていくシンプルなゲーム構造で、ロープが燃えるのを避けたり、敵の移動ルートを読みながら支点を設置したりと、考えさせられる要素が多いものの、全てのステージにはいつでも確認可能なヒントが用意されており、ゲーム初心者でも詰まりにくい優しい設計になっています。

通常のモードだと3回のミスでゲームオーバーとなってしまいますが、難易度で「やさしい」を選ぶとロープくんは無敵状態になるのでパズルは好きでもアクションが不得手な方、もしくは小さなお子様のファーストゲームにも最適だと思います。
現にゲーム中に表示されるストーリーパートの文章は全て平仮名&カタカナで、子供向け絵本風の内容なのでメインターゲットを小学校低学年ぐらいに設定しているかと思われます。

8つのステージで1ワールドの構成となっており、最終ステージではボス戦が用意されていますが、いずれも3回ダメージを与えればクリアとなる難易度で厳しいアクションは求められません。全体的な難易度はかなり易しめで、コアゲーマーな方には物足りないかもしれませんが、全10ワールドにエクストラステージとして3ワールド用意されているので全ステージクリアを目指すと結構なボリュームがあります。
最近はインディーゲームでも多機能&高難易度化が顕著ですが、こういったミニマムな機能で低難易度ながらも十分楽しめる作品というのはゲーム制作者として瞠目に値するものだと思います。

 

地味に面倒臭い

日頃からUnityのアセットストアを漁ってゲーム制作に必要な素材を購入していますが、アイコンで使用する画像のアセットって総じて内包するアセット数(画像数)が500個とか1000個とかで非常に多く、購入しても使い切れないことが多いです。
先日は6000個以上収納されたアイコンのアセットを購入しました。

色々とジャンル別にIcon用の画像が揃っていて大変有難いアセットなんですが、なんせ数が多い上に一部のファイル名が


上の画像の通り数字の連番となっているので、アイコン画像を探す際に検索バーにキーワードを入力して絞ることができず、画像を見つける苦労します。

できればファイル名の頭に検索用のキーワードを付加したい所ですが、Unityエディタ上でファイル一つ一つをRenameするとか気が遠くなる作業になるので実質的に無理。
Windows上でBatchを使えば一括置換できますが、その場合は一度metaファイルを削除した後にUnityエディタ上へリネーム後のファイルをDorp&Drag→画像ファイルをSpriteに変換する作業も必要でこれも地味に面倒臭い。
Unityエディタ上でアセットの名前を一括変換できるツールがないか探したところBTOOHにて「Unity All Renamer」というツールに辿り着きました。

booth.pm

 

Unity All Renamer

その名前の通りUnityエディタ上でHierarchyやProject内の複数アセット・オブジェクト名を一括で変更できるツールです。選択順維持や子オブジェクトの一括リネーム、プレビュー確認が可能です。
BTOOHからダウンロードしてpackageファイルをimportするとメニュー内に「TakedaTools」の項目が追加されるので、そこから「TakedaTools > All Renamer」を選択、

ツールウィンドウを開きます。

ツールウィンドウ内でリネームモードを選択し、各種設定を行います。
今回はリネームモードに「文字列の追加」、追加する位置「前へ」を設定し、先ほどのアイコンアセットからOtherフォルダ内のファイルに対して一括で先頭に文字列を追加します。

Otherフォルダ内には1000以上のファイルがありますが、それらを一括で名前の変換ができました。

変換後(前に「Icon_Flat_」を追加)のファイル名

 

リネームモードには「文字列の追加」以外にも

文字列の置換

 

大文字・小文字変換

 

番号の整形

 

などがあります。どの変換方法でもプレビューに変更後の名前が表示されるのを確認し、「変更」ボタンを押してください。

【Unity】ポストエフェクトの「Color Grading」について

大寒

最高気温が10℃以下とか法律で禁止すべきだと思っている寒さに弱い皆さんこんにちは。加えて阿保みたいに空気が乾燥するのは何の嫌がらせでしょうか、加湿器使っても朝のどが痛くて目が覚めるし。もうそろそろ寒さによる欠勤とか認められても良いこと思う。公約に掲げている政党ないかな。

 

誰がそのレトロ感を望んだのか

最近巷では平成レトロがブームですがその流れに乗ったかのようなゲームが発売されています。


一見するとモノクロ時代のゲームボーイを意識した粗目なドットの2Dゲームのようですが実際は3Dのボクセルで構成されている3Dパズルアクションゲームです。RPG的要素もありますがおまけ程度で、ちょっと斬新なパズルシステムが最大の売りのゲームとなっています。


カメラを回転させることで死角を作り、その死角の部分に重なったオブジェクトは敵を含めて「存在しない」というルール。例えば障害物で道が阻まれていてもカメラを動かして高い壁などで隠すとその障害物は「存在しない」ことになるので通れるようになる、という仕組みになっており、それを生かした謎解きがいろいろな場面で提示されます。


ゲームの展開は散らばってしまった「月の欠片」というアイテムを集めるという事を目的に主人公が色々なフィールドを探索、各フィールドには謎解きが必要なダンジョンと主人公を襲う敵や最深部にはボスが存在し、フィールドのクリア報酬として「月の欠片」がもらえるという、ある種ゼルダライクの王道的展開となっていますが、正直アクション性は高くないので探索と謎解きがメインのゲームと考えて問題ないと思います。

「死角に隠れて物は存在しない」というルールを生かした種謎解きは単純なルールながら楽しいもので、難易度もそれほど高くないので少しの閃きがあれば誰でもクリアできると思います。ストーリーの途中で入手する「隠れたものが見える」「小さくなる」といった能力を生かした謎解きの展開も面白かったです。
全体的に満足度は高いのですが、レトロ感を出すための「モノクロ」「粗目のドット(ボクセル)」といったビジュアル要素がゲーム画面の「見づらさ」を強くし、段差やスイッチなどのギミックを見逃す要因となっている点と、探索を必要するストーリーながら各イベントへの導線が弱く「何をして何処へ向かったらよいのか?」と悩む場面が多かった事は非常に残念でした。
また、初期ゲームボーイ時代のゲーム仕様を再現したかったのかマップやファストトラベルといった機能が無いも関わらず、「"ダンジョンA"で取得したアイテムで"ダンジョンB"の途中にある扉が開く」といった面倒臭い展開がそこそこあって「そのレトロ感って必要?」と思うこともありました。
ともあれメインのパズル要素は斬新で楽しむことができますし、値段分の価値はあるゲームだと思います。

 

Color Grading

Unityでポストエフェクトを実装するために公式が配布しているアセット「Post Processing」には色々なエフェクト効果が提供されていますが、その中でもゲームのビジュアルイメージづくりに最も重要だと思われるが「Color Grading」だと思います。

Color Grading」ではUnityが生成する最終的な画像の色と輝度に変更を加えるため、ゲーム空間全体の色を自由に設定することができ、空間表現がより豊かになります。

今回は以下のようなゲーム画面を使って「Color Grading」のエフェクト効果を見ていきたいと思います。

 

Color Gradingの設定

Color GradingのInspectorを見ると多くの設定項目があることがわかります。

■Mode

このうち最初に設定すべき項目は「Mode」になります。

これはColor GradingによるPCへの負荷を考慮するものでローエンドプラットフォーム向けの「Low Definition Range(LDR)」とハイエンドプラットフォーム向けの「High Definition Range(HDR)」を決めます。

HDRの方が当然効果は高いのですが、HDRを使いたい場合はプロジェクトの「Color Space」の設定をGammmaからLinearに変更する必要があります。

ちなみにColor SpaceはProject Settings→Player内のOther Settingsにあります。

 

■White Balance

・Temperature
こちらは色温度で補正をするモードになります。
数値を+側にずらせばずらすほど赤みがかり、-側に行くほど青くなります。 


・Tint
「色合い」を補正します。
数値が+100に行くほどマゼンタ(赤紫)寄りに、-100に行くほど緑寄りの色合いになります。

 

■Tone

こちらは空間の色調を調整するモードです。主に明るさ、彩度、色相を調整できます。

 

・Color Filter:空間全体にカラーフィルターをかけることができます。

 

・Hue Shift:色相を変更します。

色相を+180~-180まで変更

・Saturation:彩度を変更します。

彩度を+100~-100まで変更

・Brightness:輝度を変更します。

輝度を+100~-100まで変更

・Contrast:コントラストは明るい箇所と暗い箇所の差を調整します。

コントラストを+100~-100まで変更

 

■Channel Mixer
Channel Mixerは、RGB(赤、緑、青)にそれぞれ分かれていて上部のタブで選択した色が入力されたRGBに対して、どれだけの影響を与えるのかを設定するモードです。


■Trackballs
Lift(暗い部分)、Gamma(中間の部分)、Gain(明るい部分)のそれぞれについて色相環の真ん中にあるトラックボールを操作して調整していきます。
真ん中のトラックボールが色相環に近づくほど、その色の影響が強くなっていきます。

 

LookUp Texture

Color Gradingの項目について色々と説明しましたが、手っ取り早く画面の色を変えたい場合にはLookUp Texture(LUT)を利用するのが簡単です。

LUT は色をほかの色にマッピングするテーブルテクスチャのことで自力で作成するのは手間ですがアセットストアに有料・無料関わらず多く取り扱われているので、そこから好みのテクスチャを利用するのがお勧めです。

設定は簡単でLookUp Textureの項目にLUTテクスチャを設定するだけ、Contributionでその効果の強さを設定します。

 

モノクロ化

 

特定の色を残してモノクロ化

 

ポスターイラスト化

 

テクスチャを変えだけで画面の雰囲気もそれに応じて変わるので非常に便利。

【Unity】カメラ毎に違うPostProcessを適用する(Built-in)

ゲーム制作者

ゲームを作っていると言うと何故かアニメと漫画にも詳しいとレッテルを貼られる被害者の会の皆さんこんにちは。そりゃ鬼滅ぐらいは知ってますが呪術廻戦もチェンソーマンも観てないのでキャラクターの名前とか出されても答えようがないです。何だレゼって?「今期おすすめのアニメは何ですか?」とか聞かれても何が放送されているのかすら知らないので聞かないでください。でもフェルン可愛い。

 

東京ゲームダンジョン11

2/8(日)に東京・浜松町の東京都立産業貿易センターで開催される東京ゲームダンジョン11に制作中のリズムゲーム「Under A Groove」を出展します。
今回は2,3Fの2フロワーで開催されていますが、私のブースは2Fの【2G-13】となっています。

東京ゲームダンジョンへの出展は去年夏の東京ゲームダンジョン9以来、通算4度目となるので出展自体はかなり慣れてきましたが、今回は私のブースの周りに有名なタイトルが多くていつも以上に埋没してしまわないか心配です。
隣や眼前のブースにパブリッシャーやらマスコミやらサークルのファンやらが集まって和気あいあいと談笑しているのを横目にポツンと座っている姿が想像できますが、今回の出展を終えると次の出展まで大きく間が空きそうなので、とりあえず配布用に用意したクリアファイル、缶バッチをすべて配り終える程度に頑張りたいと思います。

 

PostProcessingStack

今回はRender PiplineにBuilt-inを指定している時のお話となります。
Unityではカメラ映像に対してPostProcessingStackを利用してグレイスケール化やBloomなどのエフェクトをかけることが出来ます。

手順としてはエフェクトをかけたいカメラ側にPost-Process Layerのコンポーネントをアタッチし、任意のオブジェクト(空オブジェクトでも可)にPost-Process Volumeのコンポーネントをアタッチ、Post-Process Volumeのコンポーネント側に「Grayscale」や「Bloom」などの効果を追加して行きカメラにエフェクトを掛けていきます。
ここら辺の手順はこのブログでも紹介しているので参考にしてください。

www.karvan1230.com

UnityのPostProcessingStackはとても便利で使いやすいですが、あくまで「カメラが描画した映像に対してエフェクトを適用される」ものなので、基本的には映像の一部だけとか特定のオブジェクトだけを絞ってエフェクトを適用することはできません。
もしポストプロセスの効果を限定的にしたい場合は映像を撮影するカメラを別にしてカメラ単位にポストプロセスを分ける必要があります。

例えば下のようなゲーム画面にて

 

遠くのオブジェクト(山や空)に対しては距離感を出すためにFogエフェクトを掛けたいが、手前のオブジェクトに対してはコミックチックな表現のためにエッジ検出したいと考えた場合、一つのカメラで捉えた映像でそれを賄うことはできないので、遠景用と近景用でカメラとオブジェクトを分け、それぞれでポストプロセスのエフェクトを掛けることになります。

近景用カメラで捉えた映像

 

遠景用カメラで捉えた映像

 

レイヤー分けとプロファイル分け

しかしカメラを分けてそれぞれにPost-Process Layerのコンポーネントをアタッチ、Post-Process Volumeのコンポーネントをアタッチしたオブジェクトを作成しただけではエフェクト効果を別々に掛けることはできません。
カメラ単位にエフェクトの効果を分けるにはその設定ファイル(プロファイル)とレイヤーを分ける必要があります。

 

■設定ファイル(プロファイル)

ポストプロセスのエフェクトは場面毎にその効果を使い分け出来るように、設定ファイル(プロファイル)に保持する必要があります。今回の場合は近景と遠景のカメラそれぞれで使いたいエフェクトが異なるため、近景用と遠景用それぞれで設定ファイル(プロファイル)を用意します。

Post-Process VolumeのInspector内にProfile項目がありその右側にNewボタンがあるのでクリックして設定ファイル(プロファイル)を作成します。

 

■レイヤー

カメラにアタッチされたPost-Process Layerコンポーネントには、シーン内に存在するどのPost-Process Volumeコンポーネントのエフェクト定義を採用するのか、を定義します。

そのためには

  1. Post-Process Volume側のオブジェクトのレイヤーを近景用のレイヤー(Post-Process)と遠景用のレイヤー(Far-Post-Process)それぞれに設定
  2. Post-Process Layerコンポーネントの「Layer」の項目に「近景用のレイヤー(Post-Process)」「遠景用のレイヤー(Far-Post-Process)」を指定

します。

 

Post-Process Volumeのレイヤー

 

Post-Process Layerの設定

上記の設定を行った後に近景用のPost-Process Volumeにはエッジ検出のポストプロセスを追加し、遠景用のPost-Process VolumeにはFogのポストプロセスを追加。それぞれで別のエフェクトを掛けることが出来ます。

 

それを重ね合わせるとこんな感じになります。

 

注意すべき点

近景用と遠景のカメラはDepth値によって近景>遠景となるように設定し、遠景の映像の上に近景の映像が重なって描画されます。
その為、近景側のエフェクト効果は遠景の映像にも掛けられてしまう事になるので、Color Grading(色調補正)などの画面全体に関わるエフェクトはDepth値の高いカメラ側に設定した方が良いです。

【アセット紹介】インスペクタの補完ツール:Wingman

あと二週間

今年もあと2週間だと気づいて驚愕している日常が呆けた皆さんこんにちは。今年は異様に夏が長くて急に冬になったのでいつも以上に一年が短い気がします。今年はゲーム開発でもプライベートでも色々とイベントが多かった年でしたが気づけばアッという間に年末になってた。

 

オシャレさに全振りしたゲーム

現状(12/12現在)日本語未対応なんですが以前からその音ゲーらしからぬビジュアル面に注目していたので購入しました。

このゲームはADVゲームパートも含むストーリーモードと一般的な音ゲーを遊ぶアーケードモードがありますが、前述のように日本語未対応なので今回はアーケードモードだけのレビューとなります。
上のタイトル画面からも分かるようにJet Set Raido風のアートスタイルですが、音ゲーパートはMuse Dashのフォロワーといった感じで上下の2レーンをそれぞれ割り当てられたボタンで押し分けていくスタイル、音ゲーらしく長押しや連打もありますが上下の割り当てとは逆のボタンを押すノーツがあったり、左右両側からノーツが流れてくる場面があったりと、難易度調整や操作が単調にならない為の独自仕様が盛り込まれています。

Steamのレビューを見ると「非常に好評」の評価となっていますが、個人的にはお洒落さの為の演出やエフェクト、配色などに力を入れすぎて視認性や利便性が低いゲームに感じました。
ゲーム中で上下の割り当てボタンは特に表示されないので慣れないと混乱する、通常ノーツと長押しノーツの瞬時の見分けが難しいが長押しノーツは最初の入力を失敗すると途中から復帰不可、ポストエフェクトやカメラの揺れが大きすぎて人によっては酔うかもしれません。

また、メニュー画面やオプション画面も項目ごとにフレームで区分けされている訳でもないのに同系色で統一されているので、お洒落だけどごちゃごちゃして使い勝手が悪い印象でした。

ボタンの表示が極端に小さいのは何故?

今回はアーケードモードだけの感想で辛いレビューとなりましたが、日本語に対応された後のストーリーモードも含めると違う感想になるかもしれないので、その時に再度プレイして改めてレビューを書きたいと思います。

 

Wingman

インスペクタの補完ツールとしては「Odin Inspector and Serializer」が有名ですが、そちらは各コンポーネント個別の設定作業を補完するツールで使いこなすには各コンポーネントのスクリプトを変更する必要があります。
今回紹介するWingmanは多数のコンポーネントがアタッチされているケースでそのインスペクタの表示を整理し利便性を向上されるツールです。

アセットストアから購入してプロジェクトにインストールするとスクリプトの変更不要で全てのオブジェクトのインスペクタの上部にWingmanの機能が追加されます。
例えば通常の3Dモデルの場合、インスペクタを開くとTransform以外にもMeshFilterやMeshRenderer、場合によってはColliderやRigidbodyがアタッチされていてインスペクタの表示が長くなっていますが、それらはボタンとして纏められてインスペクタ上部に表示されます。

このインスペクタの場合

 

上部に各コンポーネントがボタンで表示されます。

 

Wingmanの機能

■コンポーネントの分離表示
インスペクタ上部に追加されたコンポーネントのボタンを選択すると表示するコンポーネントを制限することができます。ShiftキーやCtrlキーを使って複数選択することもできます。

編集したいコンポーネントだけを表示できるので作業ミスを減らし利便性が向上します。

■コピー&ペースト

表示するコンポーネントを制限した状態で、左上のコピーボタンを押すことでコンポーネントをまとめてコピーでき、別のGameObject上でペーストボタンを押すことでコピーしたコンポーネントをペーストできます。

 

■ドラッグ&ドロップ

コピー&ペーストのボタンを押さなくてもコンポーネントのボタンをドラッグし、別のGameObjectへドロップすることでもコンポーネントをコピーすることができます。
また、ヒエラルキー上の何もない箇所へドロップするとドラッグしたコンポーネントをアタッチした新しいGameObjectが作成されます。

 

最後に

Wingmanでは大量のコンポーネントを持つGameObjectを扱う際に、インスペクタ上での煩わしい作業を大幅に効率化できます。
ゲーム制作を進めていく使用するコンポーネントの数が徐々に増えていくので、こういったアセットは非常に手助けになります。
導入にソースの修正は不必要ですし、Odin Inspectorなどの別のインスペクタ系アセットとも競合しないので気になった方は購入を検討してみてください。

【アセット紹介】多機能なアニメーション制作用アセット:Timeflow Animation System

コミュ障

年末にインディゲームの勉強会が開催されることを知るもアジェンダに「参加者PRタイム」が含まれていることが分かり参加を断念したコミュ障な皆さんこんにちは。なるだけ人の前に立つ事を避けてきた人生なのでスピーチとかプレゼンテーションとか超苦手。

 

Timeflow

ゲーム制作の中でもカットシーンやイベントシーンの作成は結構骨の折れる作業ですが、その作業に手助けとなりそうなアセットが半額セール中だったので購入しました。

 

オブジェクトのほぼすべてのプロパティをタイムライン上で制御することでアニメーションを作ることが出来ます。Unity標準のTimelineではカメラの切り替えやAnimation,AudioClipの再生などは行えましたが、Transformなどを直接制御することはできませんでした。

Timeflowではそれらのコンポーネントのプロパティもタイムライン上で制御できるので、例えば音楽と同期したオブジェクトの移動やカメラの移動などが設定できるようになります。
またシーン内に3D ベジエ曲線を使用し、パスや地形上にオブジェクトを動的配置できたり、オブジェクト間でプロパティをリンクしたりと、Unity Timelineの拡張版といっても良いぐらい多くの機能を備えています。

上のようなデモシーンの場合、以下のようなタイムラインの設定により実行されています。

 

導入及びサンプルシーンについて

多機能なアセット故にそれを把握するためのドキュメントが大事になりますが、Web上に専用のページが設けられておりそちらを参照することになります。
メニューのToolからTimeflow>Documentationを選ぶとWebブラウザが開き導入用のページが開きます。

 

下の図はWebページを日本語に翻訳したものです

導入ページの中ではWebGL版でデモアプリを確認する事が出来ます。

 

また、サンプルシーンも膨大になるためか、アセットを購入して直ぐの状態ではサンプルシーンはプロジェクト内にダウンロードされていません。
サンプルシーンを導入する為には、Package Managerを開き「Packages - Axon Gensis」から「Timeflow Animation System Samples」を選び、Built-in/URP/HDRPなど環境に応じたサンプルシーンを導入してください。

 

少し触ってみた

Timeflowを導入するには最初にTimeflowのInspectorを開きます。メニューのWindowからTimeflow>Timeflow Inspectorを選択してTimeflowのTabを開きます。

TimeflowのTab内の「Add Timeflow to this scene」を押してシーン内にTimeflowのオブジェクトを生成します。

するとTimeflowのTabがタイムラインを設定するウィンドウに変わるのが分かります。

Timeflowオブジェクトには上のタイムラインを制御するための設定がInpector内に表示されています。

 

Timeflowでオブジェクトを制御するためには先程のTimeflowのタブに制御対象のオブジェクトをドラッグします。Timeflowのタイムライン上にオブジェクトが追加され、オブジェクト側にはTimeflowのコンポーネントが自動でアタッチされます。

 

次にオブジェクトの動作を設定します。例えばオブジェクト(Cube)が1秒後にY方向に1m移動し、Y軸に90度回転させる場合はオブジェクト(Cube)のInpector内でTimeに「1」を指定し、PositionとRotationにそれぞれの値を設定、その後、それらプロパティの横にあるオレンジのマークをクリックします。

上の図の赤丸の箇所

 

するとTimeflowのタイムライン上に設定が反映されるので、後はそれと同じ要領で時間ごとの位置や回転などを設定していきます。

各動作の変化量はカーブで指定する事が出来ます。ここら辺はUnity標準のAnimationを設定する時と同じ操作感になるでしょうか。

 

設定後はTimeflowタブの再生ボタンを押すと動作を確認することが出来ます。

 

中々高機能なアセットですが、まだよくわからない点も多いため、色々と調査した後に詳しい使い方を記事にしたいと思います。

 

【レポート】CEDEC+KYUSHU 2025に出展しました

裏門

「正門は工事中で入れないので裏門に回ってください」と丁寧に地図まで渡されて案内されたのに周辺の幹線道路を二周ぐらいした挙句、裏門までの路地が狭すぎて終始ビビり散らかしながら駐車場を探した運転下手な皆さんこんにちは。福岡市香椎周辺の路地の狭さと複雑さを軽く見てました、一歩間違えるとUターンできないし。ちなみに帰りはその裏門が施錠されていたため他の出口(こっちが正式な裏門だったらしい)までの経路がわからず学内を少し彷徨いました。

 

CEDEC+KYUSHU 2025

という訳で今回はそんな福岡市東区の九州産業大学で開催されたCEDEC+KYUSHU 2025のインディーゲーム展示コーナーにリズムアクションゲーム「Under A Groove」を出展してきたので、そのレポートとなります。

cedec-kyushu.jp

CEDECはゲーム開発者向けカンファレンスイベントでゲーム業界関係者による登壇・講演が主なイベントとなっていますが、CEDEC+KYUSHUでは会場内にインディーゲームの展示コーナーが設けられており、来場者の方が各公演の合間などに展示作品を遊べるようになっています。

我がStab of Bee Projectは去年に引き続き二回目の出展で、展示した作品「Under A Groove」も二回連続の出展となりますが、展示内容としては3月に開催された東京インディゲームサミットに展示したステージのブラッシュアップ版を展示させて頂きました。
なお、どちらのバージョンもYuhei Komatsuさんの「君はレトロ」を楽曲として使用しています。

www.youtube.com

 

改修点

東京インディゲームサミット版ではステージ内で表示される映像(アニメーション)を優先して作ったため、プレイヤーがただ映像を眺めているだけの時間が長くなる、という結果になっていました。
また、最適化の甘さから所々で処理が遅延する場面が見られ、プレイヤーに快適な操作を提供することが出来ていませんでした。

その為、それら問題点を解決するべく

  • プレイヤーが操作を行う範囲を増やす
  • プレイヤーに爽快感やリズム感を感じてもらえる演出を増やす
  • 処理の最適化を行う

以上の三点を改修点して掲げブラッシュアップを行いました。

 

・プレイヤーが操作を行う範囲を増やす

前回は特に序盤のはノーツが表示される間隔が長く手持ち無沙汰感が強かったので、少し無理やりにでもプレイヤーが操作する回数を増やしました。
下の動画にある円形のウィンドウや星形の三連符の箇所などは本来映像の内容とはあまり関連がありませんが、プレイヤーの操作をお願いしている箇所です。

 

・プレイヤーに爽快感やリズム感を感じてもらえる演出を増やす

Under A Grooveでは白枠内にアイコンが重なるタイミングでボタンを押すというルールで、プレイヤーにはそのタイミングを計ってもらうために殆どのアイコン(ノーツ)は直線に沿って等速運動させていました。
しかし、そればかりだと無機質で機械的な操作感になってしまうので、一部のノーツには多少タイミングが計り辛くても楽曲のリズムを感じるような動作を採用しました。

星形のノーツが跳ねながら移動する

 

・処理の最適化を行う

内部ロジックの見直しも色々行いましたが一番大きな効果があったのはシーン中で使用しているRenderTextureの解像度を半分にした事でしょうか。下のシーンは東京インディゲームサミット版で一番遅延が発生した場面ですが、今回のバージョンでは遅延はほとんど見られず快適に遊んでいただく事ができました。

 

成果は上々

色々不安があったのですが当日実際に試遊された方の様子を見ると手持ち無沙汰で飽きてしまうといった姿は見られず、遊んでいる方もその様子を見ている方からも「楽しい」「(映像が)可愛い」といった感想を聞くことが出来たので、色々と改良した成果が見られて良かったと自負しています。

また色々な方から試遊の感想と共にSteamページやSNSでの情報の有無を聞かれ、特に伝えらえるような情報が無いためその場限りの交流となってしまったのですが、気に掛けてもらえたようで嬉しかったです。今後の励みになりました。
改めまして、試遊いただいた皆さん、本当にありがとうございました。

当日の展示ブース(やっぱり前回と場所が同じだった)

 

会場の様子

前回もそうでしたが、CEDECに来場される方の殆どは各講演の聴講が目的のため、インディーゲームの展示コーナーは閑散と盛況の差が非常に激しい会場となっていました。

展示会場の様子(閑散期)

 

それでも最終的には50~60人ぐらいの方に試遊していただき、用意したクリアファイルも缶バッチも配布し終えたので出展した成果はあったと思いますが、もう少し寒暖差が緩やかになればなぁ、とも思います。(朝10時から開場しても11時過ぎないと人が来ないし、16時を過ぎると殆ど人は来なくなります)

またCEDECがゲーム業界の勉強会イベントという事もあってか、客層が他のインディーゲーム展示会と比較して大きく異なり、一般層や子供連れの家族層は皆無、就職先にゲーム系を希望していそうな学生かゲーム業界に従事している方々が大半で、昨今のインディゲーム展示会によく見かける動画配信者のような方も見かけることはありませんでした。

その中でも試遊に積極的なのは学生の方々で試遊台をワイワイ囲みながらアレコレ感想と分析を語り合っているのは他の展示会ではあまり見られない光景だったのではないでしょうか。

 

最後に

色々と書きましたがCEDEC+KYUSHUは出展が無料で且つ、出展者は各講演を自由に聴講する事が可能なので結構お得なイベントだと思います。(今回は都市伝説のパブリッシャーさんも講演していた)
また展示会の後には交流会(食事会)が設けられていたり、福岡から遠方に拠点を構えている方でも積極的に出展を考えても良いイベントではないでしょうか。
私もまた来年も出展することが出来たら幸いです。その時は正門の工事も終わっているでしょうし。

 

◇プライバシーポリシー

●個人情報の利用目的

当ブログでは、メールでのお問い合わせ、メールマガジンへの登録などの際に、名前(ハンドルネーム)、メールアドレス等の個人情報をご登録いただく場合がございます。

これらの個人情報は質問に対する回答や必要な情報を電子メールなどをでご連絡する場合に利用させていただくものであり、個人情報をご提供いただく際の目的以外では利用いたしません。

●個人情報の第三者への開示

当サイトでは、個人情報は適切に管理し、以下に該当する場合を除いて第三者に開示することはありません。

・本人のご了解がある場合
・法令等への協力のため、開示が必要となる場合

個人情報の開示、訂正、追加、削除、利用停止
ご本人からの個人データの開示、訂正、追加、削除、利用停止のご希望の場合には、ご本人であることを確認させていただいた上、速やかに対応させていただきます。

アクセス解析ツールについて

当サイトでは、Googleによるアクセス解析ツール「Googleアナリティクス」を利用しています。

このGoogleアナリティクスはトラフィックデータの収集のためにCookieを使用しています。このトラフィックデータは匿名で収集されており、個人を特定するものではありません。
この機能はCookieを無効にすることで収集を拒否することが出来ますので、お使いのブラウザの設定をご確認ください。

●免責事項

当サイトからリンクやバナーなどによって他のサイトに移動された場合、移動先サイトで提供される情報、サービス等について一切の責任を負いません。

当サイトのコンテンツ・情報につきまして、可能な限り正確な情報を掲載するよう努めておりますが、誤情報が入り込んだり、情報が古くなっていることもございます。

当サイトに掲載された内容によって生じた損害等の一切の責任を負いかねますのでご了承ください。

●プライバシーポリシーの変更について

当サイトは、個人情報に関して適用される日本の法令を遵守するとともに、本ポリシーの内容を適宜見直しその改善に努めます。

修正された最新のプライバシーポリシーは常に本ページにて開示されます。