本文へスキップ
ui.design

Implementation

修正前後スキャンで改善を確認する

改善は主観だけで判断しません。修正前後の証拠を残し、同じURL・同じviewport・同じ重要導線で比較します。

ui.design: monitorui.design: report-quality

まず確認する症状

  • 修正後にスコアが上がった理由や残課題が説明できない。
  • 別条件のスキャンを比較してしまい、差分が信用できない。

なぜ問題か

  • Before/Afterは顧客への説明と内部PDCAの両方に必要です。
  • 再スキャン差分があると、次の自動コーディングタスクを優先しやすくなります。

診断で見る指標

同一URL
同一viewport
所見数差分
ロードマップ残数
スクショ証跡

修正方法

最小修正

修正前の成果物を保存する

result.json、report.md、スクショ、tasks.jsonを保存します。

推奨修正

同条件で再スキャンする

URL、ページ数、ログイン状態、viewport、wait条件を揃えます。

さらに改善

残課題を次スプリントへ送る

未解決所見を、原因クラスタと修正ガイド付きで次のIssueへ移します。

受け入れ条件

  1. 01PCとスマホの両方で目視確認し、主なCTAまたは操作対象が迷わず見つかる。
  2. 02キーボード操作、読み上げ補助、または自動検査で再発しやすい項目を確認する。
  3. 03修正後にui.designで再スキャンし、同じ所見が残る場合は原因を分解する。

コーディングエージェント向け修正指示

目的: 修正前後のscan成果物を比較し、解消した所見、残った所見、新規に出た所見を分けてください。比較条件が違う場合は差分判断を保留してください。

参考資料

よくある失敗

  • 別ページや別viewportの結果を改善証拠として扱う。
  • 見た目だけを整え、見出し、リンク、フォームラベルなどの意味構造を直さない。
  • 1つの指摘だけを直し、同じ原因から出た別画面の再発を確認しない。

関連ページ