Communitygithub.com

jamesonedge/シニアデザインレビュー

エビデンスに基づいたシニアデザイナーの批評でUIデザインの提案や既存画面を徹底的に検証し、実装可能な洗練された仕様書と「削除/追加/修正/維持」台帳を生成します。画面やフローのレビュー、批評、再考を求められた際に使用します。

シニアデザインレビュー とは?

このスキルは、UIデザインの提案や既存画面に対して、根拠に基づいた構造的な批評を提供し、エンジニアが実装可能な仕様書を生成するためのものです。単なる「良くして」という曖昧な要求を、検証可能なデザイン上の判断へと変換します。このスキルは、Claude CodeやCursor、CodexなどのAIエージェント向けに設計されており、ユーザーからの画面レビュー依頼に対して、デザイントークン、コンポーネント、プラットフォーム制約などの具体的な入力を元に、構造批評、情報アーキテクチャ、アクション意味論、メカニクス、ビジュアル、アクセシビリティなど多角的な視点から評価を行います。最終的に、TL;DR、詳細な批評、そして「削除/追加/修正/維持」の台帳を含むレビュー文書を出力します。このスキルは、パディングの調整やラベルの変更といった小さな修正、インタラクティブプロトタイプの作成、非UIのコードレビューには使用すべきではありません。

対応~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/jamesonedge/design-agent-kit/tree/main/skills/senior-design-review

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

シニアデザインレビュー は何をしますか?

「これを良くして」という曖昧な要求を、検証可能なデザイン上の判断へと変換します。出力は、実際のファイル、トークン、参照パターンを引用した構造化された批評と、エンジニアが構築できる仕様書です。

使用する場合

ユーザーが以下のことを依頼した場合に、このスキルを使用します:

  • 既存の画面、フロー、またはコンポーネントのレビュー、批評、「プレッシャーテスト」
  • 他の人(例: ジュニアデザイナーや別のエージェント)が書いた提案の評価
  • 実装前に何を削除、追加、修正、維持するかの決定
  • スクリーンショットからのモバイルフローの修正

使用しない場合

  • 小さな局所的な修正(「このカードのパディングを増やす」「このラベルを「保存」に変更する」など)。直接変更してください。完全なレビューはノイズになります。
  • インタラクティブプロトタイプの構築。インタラクティブモックアップワークフローを使用してください。このスキルはその入力となる可能性があります。
  • UI以外のコードレビュー、パフォーマンスチューニング、バックエンド設計。
  • 具体的なインターフェースがないブランド戦略やマーケティング戦略。

入力

リポジトリまたはユーザーが安全に提供できるものを収集します。不足している入力は未解決の質問としてリストアップされ、決して発明されません。

  1. デザイントークン(色、タイポグラフィ、スペーシング、角丸、モーション)— ファイルパス
  2. ターゲットが似るべき正規の既存コンポーネント
  3. 類似作業の過去の承認済み例(ある場合。任意、有用)
  4. ターゲットの実装および/またはスクリーンショット
  5. 既知のプラットフォーム制約(ナビゲーションモデル、OSの慣例、最小ターゲット)
  6. ユーザーの不満。可能な限り逐語的に引用

記入用のコンテキストフォームは templates/context.md にあります。

ワークフロー

1. 明示的な初期提案の草案作成

批評の前に、templates/proposal.md を使用して提案を書き留めます:問題、引用したペインポイント、設計原則、情報アーキテクチャのスケッチ、アクション、未解決の質問。ユーザーが提案を提供した場合は、それをそのまま入力として使用します。

2. 新鮮なパスとしてレビューを実行

レビューアは以下の順序で読みます:トークン、正規コンポーネント、過去の例、ターゲット実装/スクリーンショット、プラットフォーム制約、そして最後に提案。最初にエビデンスを読むことで、提案の枠組みへのアンカリングを防ぎます。

  • ランタイムが真に独立したコンテキスト(履歴を共有しないサブエージェントまたは新しいセッション)を開始できる場合は、それを使用し、その旨を明記します。
  • できない場合は、自分で別のパスを実行し、正直にラベルを付けます: 「シングルエージェント別パス — 独立したピアレビューではありません。」

レビューアのペルソナは品質レンズ(要求の厳しいシニアプロダクトデザイナー)です。ペルソナに代わって、職歴、資格、経験年数を主張しないでください。

3. レビューの作成

templates/review.md を使用します。セクション:

  • TL;DR — 3~5行:評決と最も重要な変更。
  • A. 構造批評 — これはそもそも正しい画面/フローか?
  • B. 情報アーキテクチャと階層
  • C. アクション意味論 — プライマリ、セカンダリ、破壊的、元に戻す、命名。
  • D. メカニクスとジェスチャー — タップ、スワイプ、ドラッグ、キーボード、発見可能性。
  • E. ビジュアルとモーション — トークン、リズム、密度、トランジション。
  • F. アクセシビリティと国際化
  • G. 欠落している質問 — 5つを目指しますが、意味のあるもののみを含めます。
  • H. 洗練された仕様 と 「削除 / 追加 / 修正 / 維持」台帳。

各レンズの詳細なガイダンスは references/review-lenses.md にあります。アクセシビリティとi18nのチェックリストは references/accessibility-i18n.md にあります。

レビューを読む価値のあるものにするルール

  • プレッシャーテストを行い、ゴム印を押さない。 すべての主張には、ファイルパス、トークン名、コンポーネント名、スクリーンショット領域、または名前付きの参照パターン(例:「iOS Mailのスワイプでアーカイブ」)という具体的な参照が必要です。
  • お決まりの言葉は禁止。 「ビジュアル階層を改善する」は発見事項ではありません。「「期限」の日付はタイトルと同じサイズで text.secondary を使用しているため、一目で期限がわからない」は発見事項です。
  • 強制的な削除は禁止。 現在の構造が正しい場合は、その旨を述べ、裏付けのある 維持 を記録します。変更のための変更は欠陥です。
  • 測定値の発明は禁止。 コントラスト比、WCAGの合格/不合格レベル、またはパフォーマンス数値を、計算または測定し、その方法を示さない限り述べてはいけません。それ以外の場合は「未測定 — コントラストツールで確認」と書きます。
  • 状態をカバーする。 空、ローディング、エラー、オフライン、長いコンテンツ、および非常に短いコンテンツ。
  • 色以外のシグナル。 ステータスは色だけに依存してはなりません。
  • すべてのアクションに対するキーボードとスクリーンリーダーのパス(カスタムジェスチャーを含む)。
  • テキストの拡張(多くの言語で約30~40%長い文字列を許容)および該当する場合は右から左へのレイアウト。
  • すべてのアニメーションに対する動きの抑制代替手段。

オプション: 過去の作業との比較

過去の承認済み例が存在する場合は、EまたはHの下に短い「過去の作業との一貫性」メモを追加します。これは有用ですが必須ではありません。

出力

  • proposal.md(あなたが草案した場合)
  • review.md(TL;DR、A~H、台帳を含む)
  • ユーザーへの短いサマリー:評決、上位3つの変更、および実装を妨げる未解決の質問

受理チェック

references/review-lenses.md#acceptance-checks を参照してください。台帳のどの行にも理由と参照がない場合、または測定されていない数値を事実として記載している場合、レビューは不合格となります。

ライセンス通知

以下の通知は、このスタンドアロンスキルとそのサポートファイルとともに提供されます。

MIT License

Copyright (c) 2026 jamesonedge

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

関連スキル