GAME APP ゲームアプリ|ワードウルフ
- HTML
- CSS
- JavaScript
- SPA (画面遷移)
- Single File
- レスポンシブ
OVERVIEW
プロジェクト概要
課題
スマホ1台あれば、その場の人数ですぐに遊べるパーティゲームが欲しかった。 アプリのインストールや会員登録なしで、ブラウザを開いた瞬間に始められる 「ワードウルフ(少数派当て)」を自分の手で形にすることを目指した。
目的
お題の配布・コメント周回・投票・ウルフの最終推理・勝敗判定までの ゲーム進行を1ファイルで完結させる。 3〜10人、コメント1〜3周、画像モード/上級モードなど、 遊ぶ人数や好みに合わせて調整できる設計にした。
PROCESS
制作プロセス
-
PLAN
ワードウルフのルールを分解し、必要な画面(設定→お題確認→コメント→投票→結果)を設計。
-
FLOW
1台のスマホを回しながら遊ぶ前提で、画面を順番に切り替えるSPA構成を実装。
-
SECRET
お題は「長押しで確認」方式にし、隣の人に見られない受け渡しUIを用意。
-
JUDGE
投票集計・ウルフの推理・市民/ウルフの勝敗判定までをロジックで自動化。
-
POLISH
星空グラデの世界観、アニメーション、画像モードなどで遊び心と没入感を追加。
GALLERY
ゲーム画面
RETROSPECTIVE
振り返り・工夫した点
ONE PHONE, PASS & PLAY
専用機器もサーバーも使わず、スマホ1台を回すだけで成立する設計に。 お題は「長押しで確認」にして、受け渡しの瞬間に他人へ見えないようにした。 インストール不要で、URLを開けばすぐ遊べる手軽さを最優先した。
SINGLE FILE APP
HTML・CSS・JavaScript を1つのファイルに完結させ、外部依存ゼロ。 そのままどこに置いても動くので、配布も差し替えも一瞬で済む。
TUNABLE RULES
プレイ人数 3〜10人、コメント周回 1〜3周、 画像モード/上級(言葉)モードを切り替え可能に。 集まったメンバーや盛り上がりに合わせて難易度を調整できる。
WORLD & MOTION
星空のグラデーションとラベンダー基調のトーンで、夜に集まって遊ぶ パーティの空気感を演出。画面遷移にもアニメーションを添えた。
STATE MACHINE
設定→お題→コメント→投票→推理→結果という状態遷移を JavaScript で管理。プレイヤーごとの順番・周回・集計を破綻なく回す土台を作った。
LIVE
今すぐ遊ぶ
ブラウザだけで動く単一ファイルのWebアプリです。 下記から実際にプレイできます(スマホを回して複数人で遊ぶゲームです)。