【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値の高いカメラ側に設定した方が良いです。

【小ネタ】LitMotionを使ってTextMeshの文字をアニメーションさせる

ゲーム作りとは

ゲームを作る時って作りたいゲームシステム(仕様)が先にあってシナリオは後からついてくるものだと思っていた頭の固い皆さんこんにちは。シナリオを目に見える形にしたいのなら小説でいいじゃないかとか思いますが、ゲームシステムは他の人にお任せでシナリオだけ作りたいとかそんな形のゲーム開発があったことにビックリです。とりあえず完成責任果たす能力ないのに安易にクラファン立ち上げたらダメですね。さて何の話でしょう？

フォロワーじゃなくてそのままなゲーム

Steamのストアページの動画を見るとリズム天国フォロワー的なゲームに感じますが、実際購入して遊んでみるとフォロワーじゃなくてほぼそのままなゲームでした。

どのステージもミニゲームっぽい造りで最初に基本リズムを練習するチュートリアルがあってから本編が開始、本編はノーツなどは表示されずチュートリアルで学んだ2～3パターンのフレーズを1,2ボタンで操作する方式でリズム天国の仕様に沿った形となっています。
また、いくつくかのステージをクリアするとそれまでのステージの楽曲と操作リズムを合わせたミックスステージが開放されるというもリズム天国と同じです。

元ネタがハッキリしたゲームなので新鮮味は感じませんが、その分、遊び方やルールに戸惑う事なくゲームを楽しめます。何よりフォロワーゲームだという事を除けばリズムゲームとしてのクオリティは素晴らしいと思います。

それぞれのステージの楽曲、ビジュアルはバラエティーに富んでいるし、入力レスポンスは良好で成否によるアニメーションの違いも面白いです、難易度もあまり高くないので誰でも最後まで飽きずにゲームを楽しむことができると思います。(全部ジャスト判定でクリアを狙い出すと苦行になるけど)

元ネタのリズム天国は新作の発売日が未だ発表になっていないので、それまでのつなぎとして、もしくは練習用としてリズム天国ファンの方は購入を検討しても良いのではないでしょうか？

文字の色を変える

作成中のゲーム内で先頭から文字の色が変わる演出を取り入れてみました。

こう言ったTween系の処理はもっぱらLitMotionを使って実装していますが、実は比較的に簡単に作る事が出来ます。

using LitMotion;
using LitMotion.Extensions;

public TMP_Text TextMeshProText;
public Color TextStartColor;
public Color TextEndColor;

private void ChangeTextColor(float argTime)
{
  for (int iCnt = 0; iCnt < TextMeshProText.textInfo.characterCount; iCnt++)
  {
    LMotion.Create(TextStartColor, TextEndColor, argTime)
      .WithDelay(iCnt*0.1f)
      .WithEase(Ease.Linear)
      .BindToTMPCharColor(TextMeshProText, iCnt);
  }
}

LitMotionはColorもTweenさせることが出来ますが、BindToTMPCharColorを使用するとそれを文字単位で行うことが出来ます。BindToTMPCharColorの第二引数は文字のインデックスなのでそれを入れ替えると、文字の逆から、もしくは指定順に変化させることが出来ます。
上のスクリプトを実行するとこんな感じ。

文字を動かす

先程のスクリプトを少し変えると文字を一文字ずつ動かすこともできます。その際にはBindToTMPCharPositionを使用します。

private void ChangeTextPosition(float argTime)
{
  for (int iCnt = 0; iCnt < TextMeshProText.textInfo.characterCount; iCnt++)
  {
    LMotion.Create(Vector3.zero, Vector3.left * 3.0f, argTime)
      .WithDelay(iCnt * 0.1f)
      .WithEase(Ease.Linear)
      .BindToTMPCharPosition(TextMeshProText, iCnt);
  }
}

実行結果はこんな感じ。

文字をジャンプさせる

LMotionには値を指定の値へ徐々に変化させる以外に、反復動作(Punch)や振動動作(Shake)させて変化させることもできます。

private void TextJumpPosition(float argTime)
{
  for (int iCnt = 0; iCnt < TextMeshProText.textInfo.characterCount; iCnt++)
  {
    LMotion.Punch.Create(Vector3.zero, Vector3.up * 1.5f, argTime)
      .WithDelay(iCnt * 0.1f)
      .WithFrequency(1)
      .BindToTMPCharPosition(TextMeshProText, iCnt);
  }
}

上のスクリプトのWithFrequencyはPuchの振動数を指定してします。
実行結果はこんな感じ。

【ゲーム制作】浮き沈みが激しかった2025年

携帯電話

昨今の○○詐欺を警戒して知らない番号からの電話は出ないようにしていたらそれが取引銀行からの電話で後々大変だった早計な皆さんこんにちは。まさか今頃Steamにリリースしているソフト(W.T.)に売上があるとは思いませんでした。アーリーアクセス版を出して以降、売上確認とか放置状態でしたごめんなさい。「Under A Groove」に掛かり切りでこちらは牛歩の速さでしか開発を進めていませんが、ちゃんと完成版を出せるよう頑張ります。

今年を振り返る

年内最後の更新になるので今年の活動を振り返ります。
ゲーム制作については去年に引き続き今年もリズムゲーム「Under A Groove」の作成が主な活動となりましたが、アルファ版とも言える去年のバージョンをベースにして順調にブラッシュアップできたのではないかと自負しています。

今年は技術面での最適化、効率化の他にゲーム性やビジュアル面での強化を狙って制作を進めていき、未だ課題は残るものの製品版に向けてのベース、方向性を固める事が出来ました。
幸いにもCGWord.jp様からインタビューを受けさせて頂き、「Under A Groove」を紹介してもらう事も出来たので、この方向性で間違いのがないと確信が持てましたし、自信を深める事も出来ました。本当にありがとうございます。

cgworld.jp

まぁ、それでも年始の頃は展示会に出展しても思うようなリアクションを貰えなかったり、メディアにも個人サイトにもどこにも取り上げられることがなかったり、と落ち込む事も多かったのですが、そこから持ち直してそれなりに良いリアクションを頂けるようになった浮き沈みが激しい年だったと思います。

展示会への出展

今年は「TOKYO INDIE GAME SUMMIT 2025」「東京ゲームダンジョン9」「OSAKA INDIE GAME SUMMIT 2025」「CEDEC+KYUSHU 2025」の4つの展示会に出展することができました。

www.karvan1230.com

www.karvan1230.com

www.karvan1230.com

www.karvan1230.com

これら全て「Under A Groove」の出展でしたが、全ての展示会で違うバージョンを試遊版として遊んでもらえました。4つの展示会全てでこのゲームを試遊された方はいないと思いますが、毎回新しい形を提供できたことで、このゲームの表現の幅の広さを具現化できました。
今年は各展示会毎に新しいステージを披露するという目標は一応達成する事が出来たので(CEDEC+KYUSHUはTOKYO INDIE GAME SUMMITのブラッシュアップ版)、来年も同様に各展示会を目途にした開発スケジュールで制作を進め、ステージの数を増やしていきたいと思います。

・TOKYO INDIE GAME SUMMIT 2025／CEDEC+KYUSHU 2025で披露したステージ

youtu.be

・東京ゲームダンジョン9で披露したステージ

youtu.be

・OSAKA INDIE GAME SUMMIT 2025で披露したステージ

youtu.be

「W.T.」について

冒頭でも触れた「W.T.」ですが今年も新作「Under A Groove」の制作に時間が取られ、予定した製品版のリリースまでには至りませんでした。申し訳ございません。

store.steampowered.com

このブログでもほとんど進捗を取り上げることがありませんでしたが、少しずつながらも開発は進めています。
ただ今後も制作に取れる時間の比重は「Under A Groove」の方が多くなりそうなので、完成時期も含めて制作スケージュールは正直なところ未定です。
完成版は必ず作り上げますがちょっと長いスパンでの開発になりそうです。

来年の予定

既に来年2月に開催される「東京ゲームダンジョン11」への出展は決まっているので、現在はそれに向けて「Under A Groove」の新しいステージを制作しています。

来年は東京・大阪が会場となる展示会にはそれぞれ2回ぐらい出展したいですし、地元の福岡でも来年は大きな展示会が予定されるようなので、そちらにも出展したいと思っています。
そして来年こそはインディーゲーム制作者として色々な場面で「ゲームクリエイターです」と自己紹介ができるような成果を上げて行きたいと思います。

今年一年、本当にありがとうございました！

【アセット紹介】インスペクタの補完ツール：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は出展が無料で且つ、出展者は各講演を自由に聴講する事が可能なので結構お得なイベントだと思います。(今回は都市伝説のパブリッシャーさんも講演していた）
また展示会の後には交流会(食事会)が設けられていたり、福岡から遠方に拠点を構えている方でも積極的に出展を考えても良いイベントではないでしょうか。
私もまた来年も出展することが出来たら幸いです。その時は正門の工事も終わっているでしょうし。