single-screen-prototype

画面1枚プロトタイプ作成スキル

目的

コンセプトデザインで定義した「面白さの仮説」を最短で壊しに行くプロトタイプを作成する。

絶対に確認すること（3つだけ）

1. 判断に迷いが生まれるか
2. 選択→結果→学習が1分以内に回るか
3. もう1回試したくなるか

プロトタイプの制約

画面に存在してよいもの

• 状態表示（HP / リソース）
• 選択肢（ボタン / カード）
• 結果表示（数値変化・ログ）
• リセットボタン

存在してはいけないもの

• マップ遷移
• 演出アニメーション
• 複数画面
• セーブ / ロード

ワークフロー

1. 状態設計

コンセプトデザインから以下を抽出：

• HP（プレイヤーの生存条件）
• 制約リソース（回数/エネルギー）

2. 選択肢設計

3〜5個の意味が明確に違う選択肢を定義。 詳細は references/action-design.md を参照。

3. 実装

assets/prototype-template.html をベースに実装。 技術選択は自由（HTML+JS、React、CLI等）。

4. 検証

プレイしながら自問：

• どの選択肢を押すか一瞬迷ったか？
• 毎回同じボタンを押していないか？
• 数値が減った理由を説明できるか？

YESが2つ以上 → 次の工程へ NOが多い → コンセプトデザインに戻る

完成基準

• 画面は1枚
• ルール説明なしでも触れる
• 5回くらい連続で試したくなる
• 3〜5分で1サイクル完了