design-for-ai

design-for-ai

カタログ用の概要 — 完全なパッケージ：ryanthedev/design-for-ai

判断ツリー

1. パッケージはすでにインストールされていますか？ 確認方法：エージェントのスキルディレクトリに、design-for-ai のスタブ以外の内容が含まれているか確認します。

   • はい → design-for-ai を呼び出して続行します
   • いいえ → 手順 2 に進みます

2. どのエージェントを使っていますか？

   • Claude Code → /plugin marketplace add ryanthedev/rtd-claude-inn を実行してから、/plugin install design-for-ai@rtd を実行します
   • Cursor → /plugin marketplace add ryanthedev/rtd-claude-inn を実行してから、/plugin install design-for-ai@rtd を実行します
   • その他 → GitHub README をご覧ください

インストールコマンド

/plugin marketplace add ryanthedev/rtd-claude-inn
/plugin install design-for-ai@rtd

注：インストールは 2 段階のプロセスです。まずマーケットプレイスのソースを追加し、その後、プラグイン名を指定してインストールします。

インストール後の呼び出し

• スキル名：design-for-ai
• トリガーフレーズ：「デザインチェッカー」「デザイン監査」「AI 向けデザイン」「rtd design」「design-for-ai」

機能

2 つの異なるモードで動作します。CHECKER モードでは、既存のデザインを 7 つの評価カテゴリ（目的と明確さ、タイポグラフィ、比率、構成、視覚的階層、色、SEO 対応状況）にわたって監査し、不合格の各カテゴリについて実行可能な改善策を含む構造化レポートを返します。APPLIER モードでは、新しいデザインの作成を 6 つの連続したフェーズ（基礎（概要と制約）、レイアウト構造、タイポグラフィシステム、色とコントラスト、コンポーネント構成、技術的な実装）を通じてガイドします。この 2 つのモードを合わせることで、白紙のキャンバスから品質保証済みの成果物まで、デザインのライフサイクル全体をカバーします。

使用しない場合

• 既存のコンポーネントに対する軽微な UI の仕上げ（より高速でオーバーヘッドの少ない反復には taste-skill を使用します）
• ARIA、キーボード操作、WCAG 準拠に焦点を当てたアクセシビリティ固有の監査（fixing-accessibility または wcag-audit-patterns を使用します）