運を味方につけて遊ぶマインスイーパー
最近，2日間で一本ゲームを作らなければいけない状況に陥ったので，簡単なものをリリースしました．しかし，たいして面白くないのでその作ったゲームをここで供養しようと思います．
何を作ったか
「Minesweeper++」というマインスイーパーの運要素を高めたゲームです．
ロゴはC++をいじって作りました．非商用なので許してください．
具体的に何の運要素を高めたかというと，「マスを開けたときに周りに何個の地雷があるか」の数字を確率で減少させるようにしました．つまり，周りの地雷の数がすべて見つかるとは限らないという状況になるようにしました．
世の中すべてうまくいくことってなかなかないですよね．時には大事なことを見逃したり，視野が狭くなって実際のものよりも過小評価してしまったり，などなど．
このゲームはそんな世の中の道理を反映させたゲームです(大嘘)．
ただ，全てのマスにおいて見つかる地雷の数が減少してしまうと，ゲームとして成り立たないのでいくつか救済処置を入れました．
- 減少する地雷の数は50%まで
- 周りに地雷が1つしかない場合には必ず「1」と表示される．
これは以下の式によりもたらされる効果です．
// count: 表示される地雷数
// mines: 実際の地雷数
count = Math.ceil( (Math.random() / 2 + 0.5) * mines )
0から1の一様乱数を0から0.5の範囲に縮小し，0.5だけずらした乱数を減少確率として実際の地雷数にかけています．ここで注意したいのは，マスに1が表示されるのは
- 実際の地雷数が1
- 実際の地雷数が2で，乱数が0
のときのみであることです．つまり，よほどのことがない限り1は信頼のおける数字だということです．これを頼りにゲームを進めていくと何とかクリアできるんじゃないかと思っています．また，2以上の数字は実際の地雷数から減少した数なので，最低保証数と捉えることもできるので案外簡単かもしれません．
実装とその他諸々
実装には普段から使い慣れているNext.js+TypeScript+TailwindCSSを使いました．
盤面の情報はhooksで管理し，マス1つ1つをボタンでレンダリングしました．
工夫した点としては，マスを開けるのか，フラグを立てるのかの操作を，マスを選択した後にポップアップ形式で表示させて選択させる方法です．多くのマインスイーパーではopen/flagボタンが1つ用意されてそれによって切り替えたり，右クリックや長押しで判定を切り替えたりするものが多かったですが，ユーザーの操作感に左右されたり，正確な操作が求められUXが悪いと感じたのでこのような形にしました．
この発想は，Google Playゲームに標準でインストールされているマインスイーパーから得ました．
また，今回様々なデバイスで使われることを想定してLogRocketを導入しました．これはそのサイトにアクセスした人がどこをクリックし，どのような操作をしたのかが丸見えになるツールで，不具合などが起きたときに解析がしやすくなります．
以上，簡単に作ったものを紹介しました．一度サイトに訪れていただければ幸いです．
Discussion