この記事ではclusterクリエイター・Galupenoさんが制作したゲームワールド「ロボファイトチュートリアル」の仕組みの一部を解説します。
「CCKで工夫次第ではこんなギミックもつくることができる」ことが知れるコラム的な内容になっているので、CCK触る方もそうでない方もぜひ読んでみてください!
執筆者 Galupeno
主にclusterでゲームワールドなどを制作し、意見交換会などのイベントも積極的に開催。
こんにちは、Galupenoです。
主にclusterで遊べるゲームワールドを作って公開しています。
今回は私が制作したゲームワールド「ロボファイトチュートリアル(以下、本作)」の中身がどうなっているのか、その仕組みをざっくりと解説していきます。
本作は、ロボットに乗って他のプレイヤーと対戦できるゲームワールド「Cluster RoboFight Arena(以下、本編)」における、ロボット操作を学ぶためのチュートリアルワールドです。
ここでは移動方法や戦闘方法を段階的に習得していき、ロボの操作をマスターすることが最終目標となります。
今回の解説記事をお読みになる前に、実際にチュートリアルをプレイしていただくことで、より深くご理解いただけるかと思われます。
今回の解説記事は、ワールドに入室してからチュートリアルを完了するまでの流れに沿って、主にどんな仕組みが本作にあるかざっくりと説明するものです。
一つ一つのギミックに着目した詳細な解説記事ではありません。
工場見学のような気楽さで読み進めていただければ幸いです。
オープニング演出
ワールドに入室すると、プレイヤーの目の前をロボットの3Dモデルが動き回って本編のバトルを再現するオープニング演出が始まります。
ここではバーチャルSNSで見られるパーティクルライブに影響を受けたもので、VRゲームのオープニングとして印象に残るものを目指しました。
ロボットの動きは全てアニメーションで制御しています。
アニメーションはUnityでも設定できますが、私はBlenderでのアニメーション制作に慣れているので、Blenderで付けたアニメーションをFBXにエクスポートし、それをUnityへインポートしています。
ただし、ソフトウェア間でキーフレームの補間方法が異なるため、完全に同じ動きにはならない点に注意です。
入室時に再生されるアニメーションはプレイヤー間で同期しないことを逆手に取り、後から入室したプレイヤーであっても最初からオープニングを楽しむことができます。
「遊んでいて心地良い」体験づくり
今回はステージやロボットの仕組みよりも、Player Local UIに多数のアニメーションを使って「遊んでいて心地良い」体験づくりを目指しました。
例えば、これから習得する操作のタイトルが出てくる際には、右からスライドで登場し、定位置に着くとボヨン!と伸び縮みするようなアニメーションを加えて、優しい手触り感やコミカルさを表現しました。
また、達成目標が新しく追加された際は、星のマークが大きく登場してから通常のフォントサイズに固定され、その後もずっと星マークが回転し続けることで、プレイヤーの注意を引きます。
Player Local UIの表現以外にも、ワープする際は画面を暗転させるフェードアウト/フェードインの演出を追加し、いきなりワープしてプレイヤーがびっくりしないように配慮しました。
ワープ時のフェードイン/フェードアウト表現については、同じ仕組みを解説されている熊猫土竜さんの記事をご参照ください。
GAMEJAMなど制作を急ぐ際は後回しになってしまいますが、このようにワールドの来訪者に対する細かい心遣いや気配りがあると、ユーザーが感じるワールド体験をより良いものにできるでしょう。
ステージの全体像

本作は複数人で同時にチュートリアルをプレイ可能とするため、ステージは固定とし、ロボットをそれぞれの段階へ進むごとにワープさせています。
乗り物機能を追加したオブジェクト「Ridable Item」は、Warp Item Gimmickを使うことで、プレイヤーが乗った状態であってもワープさせることができます。

複数人でチュートリアルをプレイした場合、ワープ先の地点が固定されていると、ロボットが同じ場所にワープしてしまいます。
そこで、ワープ先をランダムに振り分けるように設定しました。
これはアニメーションでワープ先を指定するオブジェクトを左右にスライドさせ、シンプルかつ効果的に実装しています。

ステージはBlenderで自作し、それぞれの段階習得に適した地形や配置を設計しました。
本編との差別化を図るため、環境光を少し青みがかった色に調整しており、Fogの効果を入れて奥行きを感じられるように設定しました。
ロボット操作の段階的制限
本作は、本編となるゲームで登場するロボットの操作を段階的に学んでいくチュートリアルです。
いきなりたくさんの操作方法を教えられると、初心者の方やゲームに慣れていない方が混乱してしまいます。
そこでまずは、ロボットの前後移動、次に左右旋回──という流れで1つのステージにつき1つの操作習得を目標としました。
ここで問題となるのが、現在チュートリアルでレクチャーされている以外の操作ができてしまうと、プレイヤーが混乱してしまうことです。
したがって、段階が進むまではレクチャーされていない操作を封じる必要がありました。

ロボットの操作を封じる主な仕組みは、Item Logicを使っています。
それぞれの段階のクリア時にPlayerへBoolを渡し、それを検出して初めて当該の操作が動くようLogicへステップを追加し、必要であれば新しくItem Logicを追加します。
正直、すでに複雑を極める本編のロボへさらに仕組みを追加することになったので、チュートリアルの制作は非常に苦心しました。
Player Local UIを使った文字と音声のレクチャー
ロボットの操作説明は、主にPlayer Local UIへのテキスト表示と、その読み上げ音声でレクチャーします。
テキストはなるべく短く簡潔なものとし、読み上げ音声はフリーの音声合成ソフトウェア「VOICEVOX」を使って作成しました。
テキスト送りはアニメーションでActive状態を切り替えることによって実装しています。

今回はテキスト数が多かったため、テキストの表示と同時に音声を再生する処理を毎回Play Audio Source Gimmickなどで実現することは大変でした。
そこで、テキストのコンポーネントを含むオブジェクトにAudio Sourceを追加し、Play On Awakeを有効にすることで、Active状態になったテキストの表示と同時に読み上げ音声を自動で再生させました。
操作説明はテキスト、音声のほか、PC・スマホ・VRと3つのデバイスごとの入力操作を図示した画像を表示します。
ただし、たくさんの情報がPlayer Local UIに表示されていると混乱してしまうので、デバイスの入力説明は1つの表示枠に3つのオブジェクトを順番にスクロールして表示しました。
これらはマスク抜きされ、画面には常に1つのデバイスについての入力説明だけが表示されます。
UnityのCanvasにはMaskという効果があり、それを適用すると下の階層にあるコンポーネント(テキストや画像など)をマスク抜き(特定の範囲内だけ表示させること)ができます。

ただし今回はMaskではなく、Rect Mask 2Dを使用しました。
Rect Mask 2Dは通常のMaskと違い、シンプルな四角形にしか切り抜くことができませんが、処理が軽く設定もしやすいので、お勧めです。
UIのマスク抜きは、武器の説明表示やカラーリング変更のアイコン表示にも使用しています。
ロボットの武器やカラーリングを変更すると、そのアイコンや説明表示も変更されますが、同じ場所に違うオブジェクトを切り替え表示するのではなく、一列に並べてマスクの枠内でスクロールさせることで、コンテンツの連続性を表現することができます。
ワールドの演出にこだわりたい方は、マスク抜きを使うとUIの表現を一段階進歩させることができます。
初心者の方にはシンプルで使いやすいRect Mask 2Dをお勧めします。
テキストと音声による一連の説明を終了すると、その習得段階における達成目標が表示されます。
これはオープンワールドのゲームなどでよく見られるもので、プレイヤーが現在何をすべきかを丁寧に示すことができます。
最後に
本記事を読んでいただきありがとうございました。
私が制作したゲームワールドを遊ばれた方からは、「これが本当にCluster Creator Kitで作られているのか!?」と驚かれることがあります。
これについて、実は私だけプログラムを書いたり秘密のギミックを使っていたということはなく、みなさんが触っているCluster Creator Kitと全く同じものを使って制作しています。
現在のCluster Creator Kitは、やりたいと思ったことをなんでも実現できるツールではありません。しかし今回の記事のように、発想と組み合わせ次第では、かなり複雑な仕組みを持つワールドを制作できるツールになります。
今回ご紹介した仕組みはほんの一部に過ぎません。
様々なトリガーやギミック、オペレーションを組み合わせることで、もっと色々なワールド表現を作ることができます。
みなさんにも「こんな世界を表現したい!」「あんなゲームをclusterで遊んでみたい!」という想いをCluster Creator Kitへぶつけてほしいなと思います。
粘り強く向き合うことで、Cluster Creator Kitは必ずその想いを受け止めて形にしてくれるからです。
clusterにもっとにぎやかなワールドが増えることを楽しみにしています。