【VOICEゲームジャム5】琴葉姉妹と変化の森【公開しました】

ゲーム 琴葉姉妹 ゲーム制作 Unity ゲームジャム

はじめに

2020/3/20 20:00～3/29 15:00にかけて開催された、VOICEゲームジャム5 + MODジャムに参加しました。

というわけで琴葉姉妹のゲームを5日間考えて残りの4日で作ったので紹介します。

ブラウザ上でも遊べるので良かったらどうぞ！(PCのみ対応)

以下は日記みたいなものなので読みたい人だけどうぞです。

経緯(日記)

0日目(思いついた日)

25日の深夜、お風呂に入ってるときにこういう迷路な感じのゲームを作ろうと思いつきました。

琴葉姉妹と変化の森（仮）あらすじ
葵ちゃんがスライム病にかかる
茜ちゃんが葵ちゃんを助けるために変化の森に変化草を取りに行く
変化の森は不思議なメロディが流れており、メロディが変化すると共に森自体の構造も変わっていく（現在位置とゴールを繋ぐランダム生成の迷路）

茜ちゃんはアカネフレイムを一定時間に一度撃てる。（上限回数要検討）
これを使うと、壁を一マス破壊できる。
葵ちゃんが完全にスライムになってしまう前に、変幻自在な森から変化草を持ち帰ることは出来るのか！？
という感じ。

これがお風呂から出て服を着ずに裏垢にツイートした文章です。初公開。

まあこの時すでに徹夜明け*1だったので、Tweetだけして寝ました。

1日目(ある程度の環境を整えた)

次の日（26日）の朝はとても久しぶり(数か月ぶりくらい)に気持ちよく目覚めることができました。*2

まずはGitHubにプライベートリポジトリを作ろうとしたんですが、Unity用リポジトリの作成は一度しかやったことがなく、やり方を忘れていてちょっとてこずりました。

結局ごはんとか食べたりしててリポジトリを作れたのは13:28。

そしてまずUnityを2019.2.17f1から2019.3.6f1にアップデート*3したんですが、ここで今まで使っていたLWRPが使えなくなっててこずりました。

なんかURPとかいうやつになったらしい。

あとEditorの見た目が変わりましたね……2019.2から2019.3で0.1変わるだけだろと思ってたら意外と大きくてビビりました。

とりあえず今まで作ってたゲームから一部の自作スクリプトやプレハブなどを持ってきたり絶対使うアセット等を導入したりして最低限の環境を整えるのに1日使いました。

2日目(迷路を生成できるようにした)

新しいせいかググってもよくわからないURPと戦いつつ、迷路のステージを作り始めました。

マップチップを自動的にいい感じに配置してくれるオートタイルという概念を知り、それがUnity上で使えるようになるというFangAutoTileを導入しました。

Fang Auto Tile | Sprite Management | Unity Asset Store　(←アセットストアのページです。無料なのでとてもありがたい……！)

ちなみにマップチップはぴぽやネットさんのところの素材をお借りしました。

スクリプトからマップチップを配置するのに手間取りましたが、FangAutoTileクラスをSetTile()に渡すことでいい感じに配置できました。

あとは穴掘り法で作った迷路情報に従ってマップチップを配置したらステージは完成したようなものです。

この時のツイートがこちら。

3日目(立ち絵表示機能や、タイトル画面と設定画面の実装)

そのまま寝ずに3日目です。

URPを導入してるのに2D用のライト類が動かない問題にとても悩まされましたが、原因は3D用のRendererDataがセットされていたせいでした。単純！！！

そんなこんなでゲームのコアとなる迷路がいい感じになったので、メッセージ表示機能やタイトル画面の実装に手を付けます。

メッセージウィンドウはクリックすることで次のメッセージを表示するようにしていたんですが、何故かクリックしても無反応になる問題に1時間くらい時間を取られました。*4

あとは、メッセージとともにボイロの音声を再生する処理や立ち絵を切り替える処理(これは割とうまく実装できた気がする)の実装とか、タイトルロゴを作ったりとかしました。

立ち絵の表情の管理はこんな感じでやってます。

f:id:skyzi000:20200331014337p:plain
立ち絵の表情管理

Dictionary便利～～～

YMMのキャラ素材マネージャーを見ながら表情を付けてたので順番はそれと同じにしてます。

ついでにまばたきもUnityのAnimatorとAnimationで実装したんですが、口パクは断念しました。（ボイス管理システムとの連携が難しい……）

普段利用させてもらっている動画編集用のソフトでの立ち絵管理がいかに便利かということを改めて認識しました。 *5

そして約30時間の連続作業の末、15時くらいに寝落ちします。

20時くらいに目覚め、アルファ値付きの動画を入れようとしますが断念。

その後約3時間かけて設定画面を作り上げました。(空想曲線さんのところの無料素材のおかげで、割といい感じにできたと思います)

f:id:skyzi000:20200331013746j:plain
完成した設定画面

4日目(最終日。クレジット表記やボイス収録など。)

ゲームの根幹部分*6を実装しないまま、クレジット表記を作り始めました。

結局2時間半くらいかけてクレジット表記ができるようにした後、ボイス再生システムも手付かずなのに、

ダッキングシステム(ボイスが再生されている間だけBGMの音量を下げるやつ)を実装しました。*7

そして6時半になってようやくボイス再生システムを実装しました。*8

7時ごろにスピーカーで洋楽を聞きつつ*9ヘッドホンで調声作業(最高に楽しい)。

8時ごろにゴール処理や第2ステージ*10を実装。

9時ごろに一旦WebGLでBuildしてみようとしたら、謎のPythonエラーが発生。

試行錯誤してみるとDevelopmentBuildやAutoRunのフラグを立てなければビルドできるっぽいことが判明。何故……？

とりあえず原因はわからないものの一応ビルドできて一安心。

9時半ごろにクリア後のリザルトシーンを実装。

10時ごろにランキング機能や第3ステージを実装*11。

タイトル画面に戻るときにフェードアウトインするようにもしました。

11時ごろにゲームオーバーの処理を実装。

そこから2時間弱かけて13時前にようやく茜ちゃんのカットインシステムを実装。

ちなみにこのカットイン、実は茜ちゃんの背景の画像が動いてるんですよね……（実プレイではほとんどわからないのでどうでも良いが実装にはとても手間がかかった*12）。

そして締め切りが間近に迫った14時半ごろにアカネフレイムを実装できました。

このアカネフレイム、目の前の壁を一マスだけ破壊するというものなんですが、目の前の壁のGrid位置(茜ちゃんの持つワールド座標とは全く別)の取得 *13 にかなり苦労しました。

その後、第2ステージ以降に行けないよう制限したのち、バージョン0.3を投稿しました。

……しかし、致命的な不具合が発生していました。

不具合との闘い
v0.3


琴葉姉妹と変化の森v0.3の不具合

動画を見てもらえるとわかる通り、始めるを押してオープニングシーンに入っても一向に始まりません。

この不具合はエディタ上でのプレイでも再現できたのですが、アカネフレイム実装に伴い発生したようです。

ソースコードに一文字?を追加 *14 することで(エディタ上では)回避することができました。

v0.4

そしてv0.4として公開したところ、このバージョンもNullReferenceExceptionだらけでした。

初期化処理をそれぞれがそれぞれのクラスで行っているため、初期化してないところにほかのクラスがアクセスしようとしてバグっていたようです。

これはアクセスされたときに初期化するようにして回避しました。

しかし、WebGLではわけのわからないJavaScriptエラーが出ていました。

タイトル画面にすらたどり着けません。

これはなぜエラーになってるのかはよくわからなかったのですが、セーブ機能に利用しているJavaScript関連のプラグインがめちゃくちゃ怪しかったので、一旦それを封印してUnityデフォルトのPlayerPrefsを使うことで対処しました。

そうやってすべてのエラーを解決したのは21時半頃のことでした。

しかし何のエラーも出ないのに、いまだに上のv0.3での不具合のようにメッセージウィンドウは表示されないままでした。

まあこれは単純にUIのSortingOrderの設定忘れだったんですが。

エディタ上ではちゃんと表示されてるのにビルドすると表示されなくなるの罠ですよねこれ……。

そんなこんなで23時ごろにv0.5.12を公開しました。

v0.5

もうここまで来たら大体の不具合は修正されました。

しかしブラウザ上でプレイしてみると茜ちゃんのカットインが表示されない！

どうもブラウザ上では.mp4の動画を変換なしで再生しようとすると真っ黒になるみたいです。(未検証)

とりあえずUnityがいい感じに再エンコードしてくれるように設定したら解決しました。

しかし、ブラウザ上でのゲームのロードが遅い！

ので、Resourcesフォルダ *15 の整理をしたりして、ファイルサイズを3分の2（60MB→40MB）に軽量化することに成功しました。

まあそんな感じで30日の朝6時にv0.6を公開して今に至るという感じです。

不具合修正しかしていない……！

5日目（睡眠とこの記事の執筆）

この記事を書いてる日です。

12時間くらい寝てました。

寝すぎて体調が若干おかしいくらいです。

というわけで4、5時間ほどかけてこの記事を書いたりしています。

アカネフレイムのクールタイムとか第2ステージ以降のストーリーとか曲の変化に合わせて迷路が再生成されるシステムとか無限ステージモードとかランキングとかも実装したいと思ってます。

とりあえずストーリーを完成させたい……。

と思ってるんですが、なんかゲーム開発する気分じゃなかったのでこの日記を書きました。

たまにはこんな日記を書くのも楽しいですね……。

とか言ってるうちにもう4時なので6日目じゃないですかヤダー！

おわりに

ここまで読んでいただきありがとうございます。（8000字弱……気が付いたら文字数がめっちゃ膨れ上がってました）

実況動画とかも今作ってるのがあるので、近いうちにあげられたらなと思っています。

きりたんとか弓鶴くんとかもお迎えしちゃったのでどんどん動画も作っていきたいですね……！

追記（2020年4月1日）

v0.7以降のバージョン情報についてはこちらのDevlogに書いていこうと思います。

https://skyzi000.itch.io/kotonohashimai-to-henge-no-mori/devlog

脚注

*1:WoWSをプレイしていたせい

*2:7時くらいに起きれたのでびっくりした。

*3:一応上書きではなく新規にインストールした。容量がかさんでいく……

*4:原因を特定した時のツイートがこちら

*5:PSDToolKitとかYMMとかいつもお世話になってるけどほんとすごい。ありがたい……。

*6:クリア処理とかゲームオーバー処理とかボイス再生システムとかアカネフレイムとか

*7:順番がおかしいのはいつものことです

*8:ちなみにVoiceControllerの中身はこれだけ。簡単！

*9:こういう時にAmazon Prime Musicは便利

*10:なお現バージョン0.6ではストーリーができてなくて行けない模様

*11:なお現バージョンｒｙ

*12:AviUtlで動かして出力した動画を、Unityで再エンコードしてビデオプレイヤーで再生し、そのターゲットをレンダーテクスチャにして、そのレンダーテクスチャをマテリアルに適用？して、そのマテリアルをイメージに適用？して、そのイメージの座標をAnimatorとAnimationで動かしてカットインさせてます。参考ツイート↓

*13:初めはRaycastを使ってましたが、何故か右向きと上向きの時は上手く動くのに、左向きと下向きの時は壁の座標の取得が上手くいかずに挫折しました。
仕方がないのでRaycastをあきらめ、コライダーの接触座標と茜ちゃんの向いてる方向を元に壁の座標を取得するようにしました。

*14: GameObject.FindWithTag("Grid")?.GetComponent(); とすることで、"Grid"タグのオブジェクトが見つからない（nullが返ってきた）場合はGetComponent()しないようにした。……ところではてなブログ、脚注にはコードを埋め込めないんですね……。（Markdown形式なら、バッククォート（`）で囲むことで本文内にコードを埋め込める）

*15:ゲーム内で使う音声ファイルや立ち絵の画像ファイルやPrefabなど、Scriptから動的に呼び出したいものを置いとけば手軽に呼び出すことのできる便利な場所。
ただし、ゲーム起動時に全部まとめてロードするためあまり入れ過ぎるといつまでたってもゲームが始まらなくなりがち。
Resourcesフォルダのベストプラクティスについて、Unity公式が

Don't use it.

とか書いてたりもする。（参考ページ：Assets, Resources and AssetBundles - Unity Learn）
AssetBundleとかAddressable Assets Systemを使えばよいらしいが、手軽には使えない。（しかもまだよくわかってない←）
今回のような短期間のゲームジャムとかでは、基本的にResourcesフォルダに頼ることになりがち。
まあ小規模で短期開発のゲームなら今のところResourcesフォルダを全面的に使った方が良いと思う（知らんけど）。
でも使わないファイルをこのフォルダに入れとくのは駄目（だがやりがち。というかやってしまっている……）。

© 2020 skyzi000