マインスイーパー制作記

今回はマインスイーパーの開発について書いていきます(‘ω’)ノ

マインスイーパー

定番ゲームが必要

まずマインスイーパーを作ることにした理由としては「定番ゲームはアクセス数が期待できる」ってことと「長時間遊んでもらえる」という2つのことからです。

他のブラウザで遊べるミニゲームサイトをいろいろ見てみるとまず間違いなく定番ゲームがあります。ソリティアやマッチ3、さめがめ、ナンプレなどは確実にあります。

このサイトを始めた当初はそういうゲームを作らないつもりでしたがある程度のアクセス数と滞在時間が期待できるなら定番ゲームも作るべきだということに考えが変わりました。

もちろん定番ゲームを作ったら突然アクセスが増えるなんてわけはないですが、期待値が少しでも上がるならやらない手は無いわけです。

とりあえず作り始める

毎回ゲームを作るときは何となくで作り始めます。何となく「こんな感じでできるんじゃないか?」っていうのを淡々とやっていきます。

で、とりあえず二次元配列を作りそこにpixi.jsのGraphicsで色違いの四角を2つ作り交互にならべてマスを作って盤を作りました。

そこにランダムで爆弾を配置します。

で、各マスの周りに爆弾が何個あるか数えさせてその数を盤に表示させます。

するとこんな感じにできました。

上にタイルをかぶせる&開ける処理

次は上に蓋するタイルを置きます。

でそのタイルをタッチするとタイルが消えるわけですが、その場所に爆弾または数字ともに入っていなければさらに周りのタイルも開ける処理が必要になります。

これは再帰関数?ってやつでできます。自分の中で自分を呼び出す関数です。

自分の場所が何もなければ上下左右一つずらして同じことをするわけです。ただ、これをそのまま書くとダブって見るところが多く処理が重すぎて止まります(;^ω^)

見たところは飛ばすようにしてあげるとOKでした。

ここからが面倒だった

ここまでは想像通りだったのでわりろすんなり進んだんですがここからが面倒くさくて(-_-;)

特にスマホへの対応はマジで面倒で辛かったです。。

基本的にマインスイーパーはマウス操作向けなのでスマホには向いてなかったですね。タッチでは右クリックが使えないし、上級だとマスが小さすぎてやりずらいし。。

スマホ用にボタンをいくつか用意することで解決したんですが、pixi.jsは複数タッチの際はタッチ位置の取得の仕方が違ってくるので複数タッチはトラブルの素で非常にイライラしました(-_-;)結局今回は複数タッチを使えるようにするのは面倒だったので複数タッチ時は処理しないようにしました。

そのほかにも試遊してみるとちょこちょこおかしいところが見つかって対処するのに結構な時間がかかりました。

作ってみての感想

正直PC専用だったら1日でできてたんですよね。

スマホに向いているかや、スマホならどうやってやるかってのをまず先にちゃんと考えてから取り組むべきでした(;^ω^)

とはいえ、まぁそれなりにできたのでOKです。

あと、やっぱりマインスイーパーはいいゲームですね。自分で作ったものでもずっと遊んでいられます(´∀`)

コメントを残す

メールアドレスが公開されることはありません。

ゲームタグ一覧

おすすめゲーム

  • ゲーム「さめがめ」のサムネイル
    さめがめ
    同じ色で複数くっついているタイルをタッチして消すパズルゲーム。一度にたくさん消すと高得点!
  • ゲーム「フリック&チェイン」のサムネイル
    フリック&チェイン
    同色のブロックを4つ以上つなげると消えるパズルゲームです。ランキングはHARDのみ対応
  • ゲーム「コスモファイター」のサムネイル
    コスモファイター
    レトロ風の縦シューティングゲーム。敵が個性的に動き回わるところも懐かしさを感じます。
  • ゲーム「vs.蚊」のサムネイル
    vs.蚊
    部屋に蚊が侵入!その数10匹!何としても奴らを殲滅せねばならぬ!!一匹残らずぶっ潰せ!!
  • ゲーム「うえにいく」のサムネイル
    うえにいく
    障害物を避けながらただただ上を目指すゲーム。シンプルだけど集中力が必要です。