アップロードされた3つの資料（law.md, simple_tasks.md, implement.md）を整理した上で、このプロダクトに必要な画面とその遷移フローをまとめました。
必要な画面一覧
① ホーム画面（ダッシュボード）
-
現在の進捗や評価のサマリーを表示
-
直近のデッドラインや達成度を確認できる
-
「スナップショット作成」や「比較プレイ開始」への導線
② スナップショット作成画面（初回作業時）
-
録画ファイルを読み込み
-
任意のフレームを選んで「スナップショット」を保存
-
保存したスナップショットが「ゴール」になる
③ 比較プレイ画面（第2回作業時以降）
-
OBSからのSRTストリームを受信し、現在の映像を表示
-
適宜スナップショットと比較し、評価結果を画面にリアルタイム表示
-
成功／失敗のフィードバック（ゲーミフィケーション要素）
-
デッドライン超過時の「負のフィードバック」もここで表示
④ 評価結果画面（セッション終了時）
-
セッション全体の達成率や速度改善度を表示
-
デッドライン達成／未達成の履歴
-
次の課題や改善点を提示（ゲーミフィケーションとしてのモチベーション強化）
⑤ 設定画面
-
フレームレートの間引き設定（例: 10fps）
-
比較アルゴリズムの選択（aHash → pHashなど将来的拡張）
-
デッドラインの設定
-
OBS連携の設定（SRT入力の指定など）
⑥ デバッグ／開発用画面（中重要度）
-
部分デバッグモード（特定の処理だけ実行して確認できる）
-
比較範囲の調整やログ出力
画面遷移フロー
[ホーム]
├─▶ [スナップショット作成] ─▶ 保存 ─▶ [ホーム]
├─▶ [比較プレイ開始] ─▶ [比較プレイ画面] ─▶ [評価結果] ─▶ [ホーム]
├─▶ [設定]
└─▶ [デバッグモード]（開発者向け）
まとめ
-
最初の導線は「スナップショット作成」から始まり、
-
その後は「比較プレイ → 評価結果 → ホーム」というループで回す。
-
設定画面で調整、必要に応じてデバッグ画面で確認。
-
フィードバック（ポジティブ／ネガティブ）とデッドラインの概念が、UI上では「比較プレイ画面」と「評価結果画面」に集中する。
👉 次のステップとして、ワイヤーフレーム（画面レイアウトのざっくり図）に落とし込むと、UI実装タスクの優先順位付けもスムーズになります。
要りますか？