形四のWebアプリ作ってみた

2026.02.21 デジもく会 での発表

1. 2026.02.21 デジもく会 西村備山 (@lipoyang) 形四のWebアプリ作ってみた
2. 自己紹介 •デジもく会 •奈良県在住 •組込み系技術者 西村備山 (@lipoyang)
3. 形四とは？ 白黒４つのコマで正方形をつくるボードゲーム 「形四」ゲームの解説 dnjiro's 9VAe blog より
4. 既存の形四アプリ 「形四96番勝負」 by @dnjiro さん Android / Chromebook 版（Google Play） Windows版 (keishi96w.zip) Mac版 (keishi96m.zip) Amazon Fire タブレット版（Amazonアプリストア） X68000 Z版（kc96x.zip）
5. まずは C# で自作 • Windows用フォームアプリ • 以前作ったオセロのアプリを改造して作成 • ひとまず動くようになるまで 9時間 (さすがに生成AIの速さには勝てない) • 形四96番勝負 相当のUIに作りこむ
6. KCSharp https://github.com/lipoyang/KCSharp ←レベル7は かなり強いぞ
7. Webアプリ版も作ってみた • UIは JavaScript で記述 • 思考エンジンは Rust で記述 • Rust → WebAssembly にビルド • ネイティブアプリと遜色ない速度
8. WebKC ↓こちらで遊べます
9. ネット対戦機能がほしい • 人間 VS 人間 のネット対戦 • ソフト vs ソフト のネット対戦 • 通信仕様どうする？ • サーバどこに立てる？
10. またね～ Twitter: @lipoyang GitHub: lipoyang SlideShare: lipoyang http://lipoyang.net
11. 高速化の工夫 • ミニマックス法 → アルファ・ベータ法 （アルゴリズムの改良) • 二次元配列 → ビットボード (データ構造の改良) • 動的なオブジェクト生成をなるべく減らす • 無駄に同じ計算を繰り返さない。(メモ化)
12. 静的評価関数 自乗形四率 (Square Keishi Rate) を以下のように定義 4つの石の座標を P i = (x i , y i ) (i = 1, 2, 3, 4) とする。 相互の距離の自乗は D(P i , P j ) = (x i – x j )2 + (y i – y j )2 その最大値を D max 、最小値を D min とするとき 自乗形四率 k = D min / D max は 0 < k ≦ ½ であり、 四点が正方形をなすとき k = ½ となる。 どれだけ正方形に近いかの簡易な指標となる。
13. ヒューリスティック • 「必殺形」全30パターン (トリプル中パンチ) • 「恐怖系」全12パターン (大パンチ + ダブル中パンチ) • これを評価関数に取り入れるのは… • 判定処理が面倒すぎて断念。 （ パターンは 回転、反転、平行移動 もありうる ）