KUNISAN.JPブログ - 456 / 1695 ページ

先週末に作成したPHP REVERSI(オセロもどき)ですが、当初は「オセロとして動けばいいや」という考えで、とりあえず動作するところまで行ったことで満足ではありました。

ただ、コンピューターの打ち手が、「ここに置いたら全滅で負ける」という所に平気で置いたり、逆に「ここに置けば全勝で勝てる」という所の隣に置いたり、いわゆる凡ミスが多いのが気になっていました。

加えて通信状況により盤面のレイアウトが崩れる頻度が高かったり、トップ画面の見た目が少し寂しかったりなど、細かい点も気になり始めてきました。そのような所を「植木の剪定(せんてい)」のような感覚で、少しずつ直していきました。

この一週間で作業した内容は以下の通りになります。

■ コンピューターの思考ルーチン改善
もともと、コンピューター側の思考は、盤面中に石を置ける場所をサーチして、置ける場所が複数ある場合には盤面に設定された「優先順位」に従う、というだけのシンプルな制御でした。ただ、柔軟さに欠けているため、場合によってはわざわざ自分を不利な状況に追い込むような手を打つこともありました。こういった凡ミスを減らすためには、数手先まで読むようなことをしないまでも、ある程度状況に応じて臨機応変に手を変えていく処理を加える必要がありました。展開によって盤面の優先順位を一部逆転させたり、優先順位の割り込みを行ったりなど、大きく7種類の処理を加えることによって、凡ミスの頻度が大幅に軽減しました(ただし、ゼロではないです)。先週末の公開直後よりは幾分強くなっています。

■ 盤面のレイアウト崩れを軽減
盤面の画像は、「盤面」と「石」に分かれているのではなく、「盤面＆石なし」と「盤面＆石あり」の画像を、横8個x縦8個=合計64個表示する形になっています。この内、「盤面＆石あり」の一部でアニメGIFを使っていますが、普通にHTMLで表示するだけだと、2回目以降の表示でアニメGIFの最後の一コマが固定されてしまい、「石がめくれるアニメ」や石を置いた時の「だんだんと浮かび上がるアニメ」が表示されなくなってしまいます。そのため、IMGタグで画像を表示する際、ファイル名の後に"?+タイムスタンプ"と記述して、毎回ファイルを新規で読み込む形にしました。ところが、これをやると今度はアニメの無いGIF画像まで毎回新規で読み込むことになり、通信状況によっては盤面のレイアウト崩れが頻繁に起こるようになってしまいました。これを解消するのに、アニメGIFの場合には"ファイル名+?+タイムスタンプ"、アニメGIFでない場合には"ファイル名＋?＋固定値"というように、表示内容によって処理を変えるようにしました。

■ タイトルロゴとメニューの変更
最初のタイトルロゴは、PowerPointのワードアートを使っただけのシンプルな画像だったのですが、見た目が少々寂しかったので、「盤面＋石」の画像にグラデーションをかけたものを左側に加えてみました。あと、トップページのメニューもテキストだけで寂しい感じがしたので、こちらもワードアートと石の画像を用いて、少しだけ手の込んだ作りにしてみました。

■ ハンデと特殊配置の追加
PHP REVERSIの盤面の配置は、URLに記載のクエリーを変更することで容易に変えられます。そのため、スタート時に黒石をコーナーに置いた「ハンデ」や、中心部分が空白でその周りに石が置いてあるような「特殊配置」も簡単に設定できます。これを活かす形で、トップページに「ハンデ」や「特殊配置」で遊べるよう、サブメニューを追加しました。

■ モバイルフレンドリー対応
画面の大きいパソコンでは表示サイズに問題はなかったのですが、スマートフォンやタブレットで表示すると、画面が小さく表示されて見づらい上にタップ操作もやりづらい状態でした。画面をピンチアウトすると表示が大きくなりますが、石を置いたりしてページが遷移すると、またもとの小さい画面に戻ってします。これを解消するため、metaタグのviewport設定で、モバイル機器の場合には画面横幅いっぱいに表示するようにしました。

■ PHPプログラムの公開
ユーザー定義関数やオブジェクトを一切使用しておらず、コードのコピー＆ペーストと変更の繰り返しの汚いプログラムですが、一応公開することにしました。こちらのページでプログラムを見ることができます。

ここまで色々とやってはきたものの、まあ今時オセロゲームを作ったところで、あまり多くの人にプレイしてもらえないことは分かっています。ただ、こういった作業を一度行うことで、また新たに何かを作成する時の役に立ったり、既存のサイトを修正する上でのヒントになったりします。特に「モバイルフレンドリー」の対応については、今回行った作業で「ページの構成によっては、思ったより難しくない」事が分かったので、既存のサイトについてもやりやすいところ(特に閲覧者の多いページ)から随時変更を加えていこうと思っています。

• PHP REVERSI(オセロもどき)の続き (2016/7/3)
• PHP REVERSI(リバーシ) - オセロもどきゲームの公開 (2016/6/26)

Web管理関連記事(リンク一覧): SPF、DKIM、DMARCの設定とネームサーバー(DNS)設定のトラブル / さくらレンタルサーバーのアクセス履歴をPHPで表示 / PHPで画像のアップロード(さくらレンタルサーバーのPHPでImageMagick) / KUNISAN.JPサイトのメンテナンス(2018) / Webサーバー引っ越し(さくらインターネット スタンダード)とHTTPS(常時SSL)化 / ...(記事連続表示)

関連カテゴリー: Web管理関連記事, PHP関連記事

詳細! PHP 7+MySQL 入門ノート : 大重 美幸 .co.jpをAmazon.co.jpでチェック