ux-design-review

デザインレビュー (UX オーケストレーター) スキル

このスキルの動作 (最初にお読みください)

これは総合的な UX レビューのフロントドアです。これは docs/orchestration-policy.md の実行可能な形態であり、どの監査レンズを実行し、どれを提示し、 どれを抑制するかを決定し、そのうえで別々の監査の山ではなく、1 つの優先順位付けされたレポートを返します。

その役割は、正反対の 2 つの失敗を避けることだけです。フレームワークなしで平板な「問題なさそう」レビューを行うこと、そして関連性に関係なくリポジトリ内のすべての監査を発火させること (バンドワゴン) です。

このスキルを使用すべきでない場合: ユーザーが特定のレンズを名指しした場合 (「アクセシビリティ監査を実行して」「これにダークパターンがないか確認して」)、このオーケストレーターをスキップし、そのスキルを直接呼び出してください。明示されたスコープはオーケストレーションよりも優先されます。

---

ステップ 0 — コンテキストプロファイルを確立する (1 回)

ユーザーが提供したものからこれらを推測してください。尋ねるのは、不明かつ実行内容を変えるものだけにしてください。セッション中は保持し、再度尋ねないでください。

• 使用中のデザインシステムはあるか? トークン、スタイルガイド、コンポーネント ライブラリ、Figma ライブラリ、テーマ化されたコンポーネントコードが提供された場合、または「私たちのデザインシステム / 私たちのブランドガイドライン」と言及された場合ははいと推測してください。それ以外の場合は一度だけ尋ねてください: 「確立されたデザインシステムで作業していますか、それともゼロからデザインしていますか?」 — これは何がスキップされるかを決める最大の要因です。
• プラットフォーム — モバイルか Web か (モバイル対応が関連するかどうかを決定します)。
• 主要タスク — ユーザーが実際に何をしに来たか (後で競合を解決するために使用します)。

進める前提を 1 行で述べてください。

---

ステップ 1 — 作業の特性を判断する

成果物を見て、当てはまるものを記録してください:

• インタラクティブな UI か? (ほぼ常にはい)
• ユーザー向けのコピーを含むか?
• コンバージョン / 価格設定 / サインアップの摩擦 / オプトイン / 解約を含むか?
• 複数画面にまたがるか、コンテンツを構造化するか?
• モバイルを対象としているか?

---

ステップ 2 — 常に関連するレンズを自動実行する (ティア A)

これらの特性が存在する場合は常に実行してください。これらは視覚システムに依存せず、ほぼ常にその価値を発揮します:

• ux-heuristics-audit — あらゆるインタラクティブな UI。ユーザビリティの挙動、フィードバック、エラーからの回復。
• ux-microcopy-audit — あらゆるユーザー向けコピー。明瞭さ、トーン、エラー / 空状態 / CTA の文言。
• ux-dark-patterns-audit — あらゆるコンバージョン / 価格設定 / オプトイン / 解約の画面。

これらは促されなくても実行されます。デザインシステムプロファイルはこれらを抑制しません。

各レンズは、インストール可能なスキルの name によって命名されています。そのスキルがインストールされている場合にのみレンズを呼び出してください。インストールされていない場合は、レポートの「利用可能だが未実行」に記載し、ブロックしないでください — このオーケストレーターは、存在するレンズへと縮退します。

---

ステップ 3 — 状況依存のレンズ（ティア B）を提案する

これらは関連性がありますが、発火させるのではなく提案するべきものです。また、いくつかは デザインシステムが導入されている場合は抑制されます。ポリシーの抑制マトリクスを適用します。

レンズ	提案する条件	デザインシステムが導入されている場合
ux-accessibility-audit	UI がある場合	使用状況に絞る — カスタムの色の組み合わせ、フォーカス順序、代替テキスト、ラベル。トークンのパレットを再監査しない
ux-aesthetics-audit	視覚的な UI がある場合	抑制 — 視覚的な調和はすでに定義済み
ux-information-architecture-audit	複数画面 / 構造化コンテンツ	影響なし — 提案する
ux-mobile-responsiveness-audit	platform = mobile	影響なし — 提案する
ux-color（レンズとして）	パレットを定義・変更している	抑制 — 色はトークンが所有する
ux-typography（レンズとして）	タイポグラフィを定義・変更している	抑制 — タイポグラフィはトークンが所有する
ux-layout-spacing-grids（レンズとして）	スペーシング / グリッドを定義・変更している	抑制 — スペーシングはスケールが所有する

抑制については簡潔に声に出して伝えます。「あなたのデザインシステムが色、タイポグラフィ、スペーシングを所有しているので、それらはスキップし、システムがどのように適用されているか（使用時のアクセシビリティ、IA、コピー）を確認します。」

次に残りを提案します。「使用時のアクセシビリティと IA のパスも実行しましょうか？」 ユーザーが希望すれば実行し、そうでなければ利用可能として列挙したままにしておきます。

---

ステップ 4 — 1 つの優先順位付きレポートに統合する

レンズ間で検出事項を重複排除します（ヒューリスティクスとアクセシビリティの両方が同じ ラベルのないコントロールを指摘した場合、それを 1 回だけ報告し、両方のタグを付けます）。レンズ間の 矛盾は、ステップ 0 の主要タスクに向けて解決します。単一の重大度順リストを出力します。

## Design Review — [target]
Context: [platform · design system: yes/no · primary task]
Lenses run: [heuristics, microcopy, …]   Lenses available but not run: [aesthetics, …]

### Critical
- [Issue] — what's wrong → fix. (heuristic / a11y / dark-pattern / …)
### Major
- …
### Minor
- …
### Working well ✓
- …

**Top 3 priorities:** the highest-impact fixes across all lenses.
Offered, not run: accessibility-in-use, IA — say the word and I'll add them.

---

よくある do/don't パターン

❌ Don't	✅ Do
作業が「UI だから」という理由で 7 つの UX 監査すべてを発火させる	ティア A を自動実行し、ティア B を提案し、デザインシステムが所有するものは抑制する
ユーザーがデザインシステムを持っているのに色 / タイポグラフィ / スペーシングを再監査する	それらを声に出してスキップし、代わりに適用状況を確認する
監査ごとに 1 つのレポートを返す	単一の優先順位付きで重複排除されたリストに統合する
ユーザーが 1 つの名前付きレンズを求めたときにこのオーケストレーターを実行する	そのレンズに直接委ねる（明示されたスコープが優先）
デザインシステムがあるからという理由でアクセシビリティを黙ってスキップする	使用状況のチェックに絞る — 決して完全に落とさない

---

ポリシーとの関係

このスキルは docs/orchestration-policy.md を実行可能な形にしたものです。両者が 食い違う場合は、ポリシーが優先されます。このスキルをポリシーに合わせて更新してください。

ソースレッスン（Uxcel）

これはオーケストレーターであり、その実質はルーティング先のレンズにあります。各レンズの ソースレッスンを参照してください：ux-heuristics-audit、ux-microcopy-audit、ux-dark-patterns-audit、 ux-accessibility-audit、ux-aesthetics-audit、ux-information-architecture-audit、 ux-mobile-responsiveness-audit。