自作ゲーム開発記 Mother Planets #7 Twitchで「!join」したら、本当に自分の惑星が生まれました
前回は、Twitchのチャットに書いたコメントがUnityまで届くところまで進みました。
その記事の最後に「次は !ping に対して pong を返し、その先で !join と惑星生成までつなげたい」と書いていたのですが、今日はその続きをかなり一気に進めることができました。
最終的には、Twitchで自分が !join と書き込むと、Unityのゲーム画面に実際に惑星が1個出現するところまで到達しました！
まずは !ping に pong を返せるようになりました
最初に確認したのは、TwitchからUnityへ届くだけではなく、UnityからTwitchへ返事を送れるかどうかです。Twitchチャットに !ping と入力すると、Unity側がそれを受信し、今度はゲーム側から pong をTwitchチャットへ投稿するところまで動きました。
前回は「Twitch → Unity」の一方向でしたが、これで「Twitch → Unity → Twitch」という双方向の通信が担保されました。見た目としては「pong」と一言返ってくるだけなのですが、これも視聴者参加型ゲームではかなり大事な一歩です。
!join で参加者として登録できるように
次は、本命の !join です。
Twitchで !join を送ると、そのユーザーのTwitch User IDを使って、ゲーム内部の参加者として登録されるようにしました。同じ人がもう一度 !join を送っても、ちゃんと参加人数は1人のままです。
Twitchでは表示名を変更できるため、名前ではなくUser IDを基準に同じ人物かどうかを判定しています。このあたりは後から直すとかなり面倒になりそうなので、早い段階で重複参加を防げることも確認しました。
参加者から「惑星データ」を作るところまで接続
ここから、今日の中でもかなり大きかった部分です。
!join で登録された参加者を、そのまま画面に球として出すのではなく、一度ゲーム内部の PlanetState という惑星データへ変換する仕組みを作りました。
新しく PlanetSpawnService を作り、
Twitchの参加者
↓
PlanetStateを生成
↓
PlanetJoinedEventを発行
という流れにしています。
同じTwitchユーザーから惑星が2個作られないことや、別のユーザーなら別の惑星になることも自動テストで確認しました。
本物のTwitchチャットからPlanetState生成に成功
準備ができたところで、実際のTwitchチャットからテストしました。
自分で !join と送ると、UnityのConsoleに
「jyoriの惑星を生成しました」
というログが表示され、ゲーム内部にPlanetStateが1個作られました。
ここで初めて、
Twitchチャット
→ !join
→ 参加者登録
→ 惑星データ生成
が全部一本につながりました。
同じ状態でもう一度 !join を送っても2個目の惑星は作られません。実際のTwitch環境でも重複防止がちゃんと働くことを確認できました。
自動テストも164件すべて成功
ここまで追加したところで、既存部分を壊していないか全体のテストも実行しました。
結果は 164 tests PASS / 0 failed。
今回追加した惑星生成だけではなく、それまで作ってきたゲームコアやTwitch参加処理も含めて全部成功しました。一つ機能を増やすたびに別の部分が壊れていないか少し怖いので、毎回オールグリーンでかなり安心します。
そして、ついに画面に惑星が出ました
ゲーム内部にPlanetStateを作れるようになったので、次はそれをUnity上の見た目へつなげました。
まずは本当に最低限の表示として、UnityのSphereを使った惑星Prefabを作成しました。さらに PlanetView と PlanetViewSpawner を作り、PlanetStateが生成された時に発生するイベントを受け取って、対応する惑星Prefabを画面へ出すようにしました。
そして実際にTwitchで !join。すると、Unityのゲーム画面に球体が1個、本当に出てきました。まだ灰色のただの球です。名前もHPバーもなく、公転も自転もしません。でも、この球は最初から置いてあるオブジェクトではありません。
Twitchでjyoriが !joinした結果として生成された、jyoriのPlanetStateに紐づいた惑星です。
ここはかなり嬉しかったです。
地味でわかりづらいですが、その様子を動画に撮りました。
前回書いた「30秒動画」の素材が、もう作れそうになってきた
前回の記事では、コンテスト用動画について「チャットで !join した直後に、自分の惑星がゲーム画面へ生まれる場面」をまず30秒ほど試作したいと書きました。
今日の時点で、その入口になる動作そのものは実際に成立しました。もちろん今の灰色のSphereをそのまま動画に使うわけではありません。ここから名前、属性、色、公転、自転、HP表示などを追加して、「誰が参加して、どの惑星が生まれたのか」が一目で分かる状態にしていきます。
ただ、前回はまだ文章の中で想像していた
「右のチャットに !join が流れたら、左のゲーム画面にその人の惑星が生まれる」
という場面が、もう技術的には動き始めました。
これは今日かなり大きく進んだ部分だと思います。
まだ見た目はただの球。でも、ちゃんとゲームの中から生まれた球
今日できたことだけ並べると、
!ping → pong
!join → 参加者登録
参加者 → PlanetState生成
PlanetState → 画面上の惑星生成
まで進みました。
朝の時点ではまだTwitchのチャットをUnityで受け取れるようになったところだったので、1日でかなり先まで来ました。
特に最後に画面へ出てきたものは、現時点では何の変哲もない灰色の球です。でもその球の裏側には、ここまで作ってきたTwitch接続、参加者管理、ゲーム内部の惑星データ、イベント通信、Unityの表示処理が全部つながっています。
そう考えると、ただのSphereなのに妙に愛着がありますねｗ
今後の予定
次は、この灰色の球を少しずつ「Mother Planetsの惑星」にしていきます。
まずは誰の惑星なのか分かるように名前を表示し、その後にPlanetStateが持っている公転情報を使って、実際に恒星の周囲を動かしていく予定です。
その先で自転、属性による色、HP表示などを追加していきます。
今まではゲームの裏側を作っている時間が長かったですが、ここからしばらくは画面上の変化も増えてきそうです。
Twitchで「!join」と書く。
その瞬間に、自分の惑星がゲームの世界に生まれる。
Mother Planetsを作り始めた時からやりたかったことの一つが、ようやくUnity版でも目に見える形になってきました！
シルバーウイークでの進捗はここまで！
ここからは通常の進行に戻りますので、地道にがんばります。
