じゃがりこコラボ限定クエストのモンスターソースコードを読み解く！意外な発見と隠された秘密

じゃがりこコラボ限定クエストのモンスターソースコードを読み解く！意外な発見と隠された秘密

はじめに：じゃがりことモンスターの夢のコラボ！

皆さん、こんにちは！今回は、じゃがりことモンスターがコラボしたキャンペーンで遊べるブラウザ版ミニゲーム「じゃがりこ工場」のソースコードを解析していきます！

「モンストのソースコード解析」と銘打っていますが、今回はあくまでじゃがりこコラボ限定のミニゲームです。 勘違いしないでくださいね！

このミニゲームは、じゃがりこを購入するとパッケージに記載されたQRコードを読み込むことでプレイできます。全部で4種類のフレーバーがあり、フレーバーによって遊べるミニゲームが異なります。 今回は、サラダ味を購入するとプレイできる「じゃがりこ工場」を取り上げます。

じゃがりこ工場とは？：モンスト要素満載のミニゲーム！

「じゃがりこ工場」は、簡単に言うと、ガチャを引いて手に入れたキャラクターを使って食材を集め、新しいじゃがりこのフレーバーを作るゲームです。

見ての通り、クエスト部分はモンスターストライク(モンスト)に非常に良く似ています。 単にモンスターを弾くだけでなく、ブロックやビット、シールドなどのモンストでおなじみの要素が多数登場します。

そして、もっとも重要なのは、このミニゲームはブラウザ上で実行され、サーバーとの通信がないシンプルなゲームであるため、ソースコードを直接見ることができるということです。秘密にされることなく、全て公開されているのです！

これはつまり、裏側を自由に見て、解析し放題ということ！

今回の記事では、ソースコードを通じてこのミニゲームを紐解き、隠された秘密に迫っていきます。

注意事項：解析は自己責任で！

本記事に入る前に、重要な注意点をいくつかお伝えします。

• 攻略情報はありません： 本記事はソースコードの解析に焦点を当てており、攻略情報は一切含まれていません。攻略情報を求める方は、他の動画や記事をご覧ください。
• JavaScriptのプロではありません： 私たちはJavaScriptのプロではありません。ソースコードの読み間違いがある可能性があります。ご了承ください。
• 著作権について： ソースコードには当然著作権が存在します。コードを無断で利用することは法律違反となる可能性があるため、ご注意ください。今回は、ソースコードのURLを明示的に書くことは避け、ファイル名のみ記載することにします。例：game.js のような形式です。

ソースコード解析：本格的なゲーム開発さながらのこだわり！

さて、いよいよ本編です！ソースコードの解説に入っていきましょう。

今回解析するファイルはおおよそ1503行で構成されており、大雑把に内容を分類すると以下のようになります。

• ゲームロジック： 意外にも全体のコードのごく一部しか占めていません。
• 見た目と音の演出： コードの大半は、見た目と音の演出に関わる部分です。

コードのほとんどが見た目と音の演出に費やされていることから、ゲーム開発において、演出がいかに重要であるかが分かります。

例えば、ガチャ演出。機能だけを考えれば、「キャラクターをランダムに選択する」という非常にシンプルな処理で済みます。しかし、このミニゲームのガチャ演出は非常に豪華なものです。

ガチャ演出の細部まで徹底的に作り込まれたコード：

ソースコードの一部分を見てみましょう。例えば、「ひっぱれ」という文字の動きを制御するコードは、驚くほど長くなっています。

// 非常に長いコードがここに記述されています...

なぜこれほど長いコードになっているのか？

それは、「ひっぱれ」という文字が単に上下に動くだけでなく、動きに合わせて横幅や縦幅が微妙に変化しているためです。上下の動きについても、速度は一定ではありません。

このような細かい位置とサイズの変化をプログラムにすると、これだけの長さになってしまうのです。多くの人が意識しない部分にも、膨大な手間がかけられているんですね。

キラキラ演出も緻密な制御：

画面をタップした時に表示されるキラキラとした光の粒子も、プログラムによって制御されています。本家のモンストでも似たような演出がありますが、このミニゲームのソースコードによると、粒子の動きは非常に複雑です。

• 発射方向： 各粒子の発射方向はランダムに変化します。
• 発射速度： 発射速度も粒子ごとにランダムに変化します。
• 回転方向： 粒子はクルクルと回転しますが、回転方向もランダムです。

１つの粒子に対して、発射方向、発射速度、回転方向の3つのランダム要素が設定されているのです。

この複雑な演出は、ゲームの手触りの良さや気持ち良さに繋がっていると言えるでしょう。まさに職人の世界ですね！

モンスト風のクエスト部分：意外なバグを発見！

続いて、モンストのクエストに似た部分の挙動について見ていきましょう。

ソースコードから味方モンスターの動きに関する記述を探してみると、updateSpeedという記述を見つけました。これは、速度の変化に関する記述だと思われます。

// 速度の変化に関する記述がここにあります...

このゲームのモンスターの速度は、１フレーム進むごとに timeReduceBias という定数で決められた値ずつ減速していきます。これは時間経過に比例して速度が減少するということです。

そして、この timeReduceBias の値は、ソースコードの特定部分で決定されています。2つの数値がありますが、左側は反射時の数値、右側は貫通時の数値となっています。

このミニゲームでは、使用するキャラクターのバリエーションが豊富で、様々なキャラクターを使用できます。しかし、その性能は、キャラクターの種類によってのみ決定されるという仕組みになっています。

並べて比較してみると分かりますが、パワー型のミュウだろうが、スピード型のワタツミだろうが、動きは同じです。これは、ソースコード中の特定の数値が初期速度、そして別の数値がヒット時の減速率となっており、これらの数値もキャラクターごとに異なる値が設定されているはずなのに…

実は、この「じゃがりこ工場」のソースコードにはバグがあり、モンスターの性能の初期化が正しく行われておらず、反射と貫通で減速率が同じになってしまっているのです。

バグがある部分は、味方モンスターのパラメータを初期化する部分で、パラメータの初期化の順番に問題があるようです。本来は、まずモンスターの種類を設定し、それに基づいて減速率を設定する必要があるのですが、この順番が逆になっているために、正しい初期化が行われていないのです。

まあ、現在の設定でも普通に遊べるので、さほど深刻なバグではありませんが…まさか、リアルでバグを発見するとは！

ブロックの設置と反射判定：細やかな工夫の数々！

次は、ブロックの設定に注目してみましょう。

反射タイプのクエストのバトルシーンのギミック配置が記述されている部分を見てみましょう。

敵の情報、ブロックの情報、食材の情報、そして白いウサギの情報といったデータが記述されています。バトルシーンには6つのブロックが登場しますが、それぞれに対応関係が設定されています。

ブロックの情報は、X座標、Y座標、そして collisionType という3つのパラメータで記述されています。

• X, Y座標は、画面上のブロックの位置を指定します。
• collisionType は、文字列で記述されており、左と中央のブロックには TB 、右のブロックには RTB が設定されています。

この文字列が何を表しているかというと、上下左右の方向から触れた時に、モンスターがそのブロックで反射するかどうかを表しています。

• R: 右
• T: 上
• B: 下

例えば、 RTB は、右、上、下からの接触で反射し、左からの接触では反射しないことを意味します。同様に、TB は上下からの接触で反射し、左右からの接触では反射しません。

しかし、真ん中のブロックは、上下からの接触でしか反射しないように設定されています。しかしながら、このブロックは左右を他のブロックで塞がれているため、そもそも上下からの接触しか起こりません。つまり、わざわざ上下からの接触で反射するように設定する必要はないのです。

これは、恐らく、ブロックの上にモンスターが乗っかっている時の挙動を記述しているものと考えられます。モンスターがブロックの上に載った状態でスタートした場合、左に弾くと、ブロックの外に出るまではブロックで反射させず、ブロックの中をすり抜けることができます。これは本家のモンストと同じ挙動です。

この挙動を実現するために、RTB や TB といった設定がされているのです。

まとめ：無駄な部分とコピーペーストの痕跡！

今回の記事では、じゃがりこコラボ限定クエストのソースコードを解析し、様々な発見をしました。

最後に、重要な点をもう1つだけ。このミニゲームのソースコードには、無駄な部分が大量に含まれています。敵を倒した時の挙動、ボスのヒットポイントバー、ボスの登場時の演出など、ミニゲームには出てこない要素に関する記述が多数含まれています。

どうやら、このミニゲームは過去のミニゲームのソースコードを流用して作られており、過去のミニゲームの要素がそのまま残っているようです。いわゆるコピーペーストが行われているということです。敵やボスに関する記述が残っているのは、過去のミニゲームのソースコードをコピーしたためです。

そして、そのコピー元は、ソースコードの中に隠されていました。

// ソースコードの一部
// ...kushikatsu Tanaka...

なんと、串カツ田中コラボからのコピーペーストだったのです！

クエスト風のゲーム部分は、テレビでアニメ放映していた頃に配信されていたミニゲームが元ネタになっているようです。

今回は特に落ちもなく、これで終わりです。ご視聴ありがとうございました！