ゲーム中に動くタップ領域は何pxあるか
7画面幅・全5フェーズのhitboxを実ブラウザで測る
静的コントロールと動的ターゲットの違い
一般的な「タップ領域は何px」の議論は、常に画面に表示されているボタン（静的コントロール）が対象だ。しかしリアルタイムゲームでは、フェーズごとに現れるターゲットがあり、表示タイミングも動く。本作は5フェーズ（TAP→椅子配置→HOLD→中央線→最終TAP）それぞれに異なるインタラクティブ要素を持つ。
測定の目的は「各フェーズの実際のヒットボックスが、操作可能なサイズ（WCAG 2.5.8 の最低24px）を満たしているか」を確かめることだ。
測定方法
Playwright（Chromium）で各フェーズを決定的に表示し、getBoundingClientRect() で視覚サイズと実際のインタラクティブ領域を取得した。タイマーをスキップするような危険なdebug APIは使わず、「フェーズの表示を切り替えるだけ」の読み取り専用フックのみ使用。
ビューポートは7種（320×568、360×640、390×844、412×915、768×1024、1366×768、1920×1080）に加え、200%相当のズームとランドスケープ（1024×768）を含む。
結果（抜粋：最小辺のpx）
| Viewport | Phase | Target | W | H | min | WCAG 24 |
|---|---|---|---|---|---|---|
| 320×568 | introTap | aimRing | 75 | 75 | 75 | OK |
| 320×568 | placeChair | chair | 84 | 65 | 65 | OK |
| 320×568 | hold | holdRing | 96 | 96 | 96 | OK |
| 320×568 | centerLine | tensionControl | 275 | 86 | 86 | OK |
| 320×568 | finalTap | tapPad | 88 | 88 | 88 | OK |
| 412×915 | placeChair | chair | 84 | 65 | 65 | OK |
| 1920×1080 | hold | holdRing | 96 | 96 | 96 | OK |
全45組（5フェーズ×9ビューポート）の測定で、すべてのインタラクティブターゲットが最小辺24px以上だった。詳細は 動的ターゲット幾何レポート を参照。
キーボード代替
実測では chair（椅子配置／ドラッグ相当）と holdRing（HOLD）、tapPad（最終TAP）がキーボード操作可能だった。TAP系ターゲット（aimRing等）は画面上のタップ領域だが、スペース／エンターキーで同等の操作ができるよう実装されている。
WCAG 2.5.8 との関係
WCAG 2.5.8（Target Size Minimum）はポインタ目标の最小サイズを24×24 CSS pxとする。本作の全フェーズターゲットはこれを満たした。ただし「動くターゲット」は同基準の直接対象外であり、補助としてポインターキャンセレーション（押下中に領域外へドラッグしても取り消せる）や、ドラッグ操作にはキーボード代替を併設している。
制限（limitations）
- 測定は getBoundingClientRect による「表示上の矩形」であり、実際のポインタヒット領域の詳細（子要素の重なり）は簡略化している。
- ユーザーの成功率や操作習熟度には言及していない。本記事は「サイズの測定」であり、実利用者の成否を推定するものではない。
- 200%ズームは deviceScaleFactor で近似しており、ブラウザの拡大UIそのものの挙動とは微妙に異なる場合がある。