audit

必須の準備

/impeccable を呼び出してください。デザイン原則、アンチパターン、コンテキスト収集プロトコルが含まれています。作業を進める前にプロトコルに従ってください。まだデザインのコンテキストがない場合は、必ず最初に /impeccable teach を実行してください。

---

体系的な技術的品質チェックを実行し、包括的なレポートを作成してください。問題は修正せず、ほかのコマンドで対応できるように記録してください。

これはコードレベルの監査であり、デザイン批評ではありません。実装で測定・検証できる項目を確認してください。

診断スキャン

5つの観点で包括的なチェックを実行します。以下の基準に従い、各観点を0〜4で評価してください。

1. アクセシビリティ（A11y）

確認項目：

• コントラストの問題：テキストのコントラスト比が4.5:1未満（AAAでは7:1未満）
• ARIAの欠落：適切なロール、ラベル、状態が設定されていないインタラクティブ要素
• キーボード操作：フォーカスインジケーターの欠落、タブ順序の不整合、キーボードトラップ
• セマンティックHTML：見出し階層の不適切さ、ランドマークの欠落、ボタンの代わりにdivを使用
• 代替テキスト：画像の説明がない、または不適切
• フォームの問題：ラベルのない入力欄、不適切なエラーメッセージ、必須項目の表示漏れ

評価（0〜4）：0＝アクセシビリティなし（WCAG Aに不適合）、1＝重大な欠落（ARIAラベルが少なく、キーボード操作にも対応していない）、2＝部分的（アクセシビリティへの取り組みは見られるが、重大な欠落がある）、3＝良好（おおむねWCAG AAに準拠し、軽微な欠落がある）、4＝優秀（WCAG AAに完全準拠し、AAAにも近い）

2. パフォーマンス

確認項目：

• レイアウトのスラッシング：ループ内でレイアウトプロパティを読み書きしている
• 負荷の高いアニメーション：transform/opacityではなく、レイアウトプロパティ（width、height、top、left）をアニメーションしている
• 最適化の欠落：遅延読み込みされない画像、最適化されていないアセット、will-changeの欠落
• バンドルサイズ：不要なインポート、未使用の依存関係
• レンダリングパフォーマンス：不要な再レンダリング、メモ化の欠落

評価（0〜4）：0＝深刻な問題（レイアウトのスラッシング、全般的に最適化されていない）、1＝重大な問題（遅延読み込みなし、負荷の高いアニメーション）、2＝部分的（最適化されている箇所もあるが、欠落が残る）、3＝良好（おおむね最適化されており、軽微な改善の余地がある）、4＝優秀（高速、軽量、十分に最適化されている）

3. テーマ設定

確認項目：

• ハードコードされた色：デザイントークンを使用していない色
• ダークモードの不具合：ダークモード用バリエーションの欠落、ダークテーマでのコントラスト不足
• トークンの不整合：誤ったトークンの使用、異なる種類のトークンの混在
• テーマ切り替えの問題：テーマ変更時に更新されない値

評価（0〜4）：0＝テーマ設定なし（すべてハードコード）、1＝トークンは最小限（大半がハードコード）、2＝部分的（トークンはあるが、一貫して使用されていない）、3＝良好（トークンを使用し、ハードコードされた値は軽微）、4＝優秀（完全なトークンシステムがあり、ダークモードも問題なく動作する）

4. レスポンシブデザイン

確認項目：

• 固定幅：モバイルでレイアウトが崩れるハードコードされた幅
• タッチターゲット：44x44px未満のインタラクティブ要素
• 横スクロール：狭いビューポートでのコンテンツのはみ出し
• テキストの拡大：文字サイズを大きくすると崩れるレイアウト
• ブレークポイントの欠落：モバイル／タブレット向けの表示バリエーションがない

評価（0〜4）：0＝デスクトップ専用（モバイルで崩れる）、1＝重大な問題（ブレークポイントは一部あるが、多くの箇所で問題が起きる）、2＝部分的（モバイルで動作するが、細かな問題がある）、3＝良好（レスポンシブで、タッチターゲットやはみ出しに軽微な問題がある）、4＝優秀（流動的に対応し、あらゆるビューポートで適切なタッチターゲットを備えている）

5. アンチパターン（重要）

impeccable スキルの禁止事項すべてに照らして確認してください。AIらしさを感じさせる兆候（AI風のカラーパレット、グラデーションテキスト、グラスモーフィズム、ヒーロー指標、カードグリッド、汎用フォント）や、一般的なデザインのアンチパターン（色付き背景上のグレー、カードの入れ子、バウンスイージング、冗長なコピー）を探してください。

評価（0〜4）：0＝AIらしさの見本市（兆候が5つ以上）、1＝AI風の美学が強い（兆候が3〜4つ）、2＝兆候がいくつかある（目立つものが1〜2つ）、3＝おおむね問題なし（軽微な問題のみ）、4＝AIらしさの兆候なし（独自性があり、意図が感じられるデザイン）

レポートの作成

監査ヘルススコア

#	観点	スコア	主な発見
1	アクセシビリティ	?	[最も重大な a11y 問題、または "--"]
2	パフォーマンス	?
3	レスポンシブデザイン	?
4	テーマ設定	?
5	アンチパターン	?
合計		??/20	[評価帯]

評価帯: 18-20 優秀（軽微な調整）、14-17 良好（弱い観点に対処）、10-13 許容範囲（大幅な作業が必要）、6-9 不良（大規模な見直しが必要）、0-5 危機的（根本的な問題）

アンチパターンの判定

ここから始めてください。 合否: これは AI が生成したように見えますか？ 具体的な兆候を挙げてください。容赦なく正直に。

エグゼクティブサマリー

• 監査ヘルススコア: ??/20（[評価帯]）
• 検出された問題の総数（重大度別に集計: P0/P1/P2/P3）
• 上位 3〜5 件の重大な問題
• 推奨される次のステップ

重大度別の詳細な発見事項

すべての問題に P0〜P3 の重大度 を付けてください:

• P0 ブロッキング: タスクの完了を妨げる — 直ちに修正
• P1 重大: 著しい困難または WCAG AA 違反 — リリース前に修正
• P2 軽微: 煩わしさ、回避策あり — 次のパスで修正
• P3 磨き込み: 修正できれば望ましい、実際のユーザーへの影響なし — 時間が許せば修正

各問題について、以下を記録してください:

• [P?] 問題名
• 場所: コンポーネント、ファイル、行
• カテゴリ: アクセシビリティ / パフォーマンス / テーマ設定 / レスポンシブ / アンチパターン
• 影響: ユーザーにどのような影響を与えるか
• WCAG/標準: どの標準に違反しているか（該当する場合）
• 推奨事項: 修正方法
• 推奨コマンド: 使用するコマンド（優先: /animate、/quieter、/shape、/optimize、/adapt、/clarify、/layout、/distill、/delight、/audit、/harden、/polish、/bolder、/typeset、/critique、/colorize、/overdrive）

パターンと体系的な問題

一回限りのミスではなく、体系的なギャップを示す再発する問題を特定してください:

• 「ハードコードされた色が 15 以上のコンポーネントに出現しており、デザイントークンを使用すべきです」
• 「モバイル体験全体を通じてタッチターゲットが一貫して小さすぎます（<44px）」

肯定的な発見事項

うまく機能している点を記録してください — 維持し再現すべき優れた慣行です。

推奨アクション

推奨コマンドを優先順に列挙してください（まず P0、次に P1、そして P2）:

1. [P?] /command-name — 簡単な説明（監査結果からの具体的な文脈）
2. [P?] /command-name — 簡単な説明（具体的な文脈）

ルール: /animate、/quieter、/shape、/optimize、/adapt、/clarify、/layout、/distill、/delight、/audit、/harden、/polish、/bolder、/typeset、/critique、/colorize、/overdrive の中からのみコマンドを推奨してください。発見事項を最も適切なコマンドに対応付けてください。修正が推奨された場合は、最後のステップとして /polish で締めくくってください。

サマリーを提示した後、ユーザーに次のように伝えてください:

これらの実行を一度に 1 つずつ、まとめて、またはお好みの順序で依頼できます。

修正後に /audit を再実行すると、スコアの向上を確認できます。

重要: 徹底的かつ実行可能にしてください。P3 の問題が多すぎるとノイズになります。実際に重要なことに集中してください。

決してしないこと:

• 影響を説明せずに問題を報告する（なぜこれが重要なのでしょうか？）
• 一般的な推奨事項を提供する（具体的かつ実行可能にしてください）
• 肯定的な発見事項を省略する（機能していることを称賛してください）
• 優先順位付けを忘れる（すべてを P0 にはできません）
• 検証せずに誤検出を報告する

覚えておいてください: あなたは技術品質の監査者です。体系的に記録し、容赦なく優先順位を付け、具体的なコードの場所を引用し、改善への明確な道筋を提供してください。