Design Pro は何をしますか?
7つの公開コレクションから328のデザインプレイブックをルーティングするレイヤーと、UI構築のためのオーケストレーションパイプライン。各プレイブックは自己完結型のリファレンスファイルです。タスクに必要なものだけを読んでください — ライブラリ全体を読み込まないでください。
最初の分岐:これはUI構築ですか?
分類する前に、リクエストが2つのパスのどちらにあるかを判断してください。これを正しく行うことが、個性的な出力と凡庸な出力を分けるポイントです。
パスA — UIサーフェスの構築/デザイン/改善(ページ、画面、コンポーネント、ランディングページ、マーケティングサイト、アプリビュー、ダッシュボード — 実際に作成または変更する場合):
→ references/process/orchestrate.md を読み、それに従ってください。 これが必須のパイプラインです。内蔵の凡庸さ排除エンジン(tastemaker)を背骨として駆動し、他の領域をそのサービスにルーティングし、最終的な凡庸さ防止ゲートを強制します。UI構築を単一のプレイブックに直接渡さないでください — それは「どんなAIでも作れた」という受動的スイッチボードパスです。
パスB — その他すべて(批評のみ、リサーチと戦略、純粋なThree.js/シェーダーシーン、モーションショーリール、ゲームシステム、SVGイラストレーション、「Xをカバーするスキルは?」):
→ 以下のスイッチボードを使用してください。
スイッチボード(パスB)
- リクエストを分類し、以下の5つの領域のいずれかに当てはめます。
- その領域の
INDEX.mdを読んでください。 そこには領域内のすべてのプレイブックとその完全なトリガー説明がリストされています。 - 一致する1つまたは2つのプレイブックを読んでください。 それらに書かれている通りに従ってください — それらが専門知識そのものです。このファイルはスイッチボードにすぎません。
- 一致するものがない場合は、その旨を伝え、無理に適合させることなく自分の判断で進めてください。
異なる領域から2つのプレイブックを読むことは正常で正しいことです。6つ読む場合は、リクエストを段階に分割する必要があるサインです。
5つの領域
| 領域 | 対象とする作業 | インデックス |
|---|---|---|
| ui-craft (82) | 洗練、タイポグラフィ、カラーシステム、アクセシビリティ、レイアウト、インターフェースコピー、インタラクションパターン、アニメーションとモーションのフィーリング、ビジュアル批評。「見た目と感触は正しいか」のレイヤー。 | references/ui-craft/INDEX.md |
| web-build (121) | ランディングページ、マーケティングサイト、デザインエンジニアリング、スクロールとGSAPストーリーテリング、リファレンスやスクリーンレコーディングからプロンプトへの変換、ページキャプチャ、記事と画像生成。「ページを構築する」レイヤー。 | references/web-build/INDEX.md |
| process (63) | ユーザーリサーチ、インタビュー、ペルソナ、JTBD、ジャーニーマップ、サーベイ、ユーザビリティテスト、デザインシステムのガバナンス、トークン、デザインオプス、ハンドオフ仕様、ステークホルダーと交渉作業。「作業がどのように決定されるか」のレイヤー。 | references/process/INDEX.md |
| motion-3d (36) | Three.jsシーン、マテリアル、ライティング、水、ゴッドレイ、バーチャルツアー、モーションショーリール、ウェブビデオプレゼンテーション、手書きSVGイラストレーションスタイル。 | references/motion-3d/INDEX.md |
| games (26) | ゲームアーキテクチャ、ゲームプレイループ、コンバットシステム、スキルVFX、ゲームプレイQA。 | references/games/INDEX.md |
ルーティングのヒント
以下は間違いやすいリクエストです:
- 「もっと良く見せて」/「これ、AIが作ったように見える」 — UIを実際に変更する場合、それはパスA →
references/process/orchestrate.mdです。批評のみの場合は、ui-craft(tastemakeraudit動詞 /better-interface)です。 - 「このインターフェースをレビューして」(変更なし) →
ui-craft(better-interfaceは6つのレンズすべてにわたるランク付けレポートを1つ提供します)。 - 新しいマーケティングページを構築する → パスA →
references/process/orchestrate.md。web-build+ui-craftを2つの別々のエンジンとして直接ルーティングしないでください。オーケストレーターは1つのエンジンを、根拠を持たせゲートをかけて実行します。 - アニメーションの感触がおかしいが理由が言えない →
ui-craft、アニメーションプレイブック。イージングとデュレーションが通常の原因です。 - 「そもそもこれを構築すべきか」 →
process、ui-craftではありません。リサーチと戦略はクラフトに先行します。 - 動画にする必要がある静的デザイン →
motion-3d。 - Figmaファイルを入力とするもの →
web-build(build-design)。
サポートファイル
一部のプレイブックには、スクリプトやリファレンスマテリアルが <playbook>.files/ という名前の兄弟フォルダに同梱されています。プレイブックが自身のリファレンスやスクリプトを参照する場合、そこを探してください。デモアセット(動画、スクリーンショット、テクスチャ)はバンドルされていません — プレイブックがそれらを指している場合は、例示として扱い、続行してください。
出典
各プレイブックには、そのソースリポジトリと作者を記載したヘッダーがあります。7つのコレクションすべてはMITライセンスであり、そのヘッダー以外は変更されずにバンドルされています:
| コレクション | 作者 | プレイブック数 |
|---|---|---|
| MengTo/Skills | Meng To | 178 |
| Owl-Listener/designer-skills | MC Dean | 111 |
| emilkowalski/skills | Emil Kowalski | 15 |
| jakubkrehel/skills | Jakub Krehel | 14 |
| ConardLi/garden-skills | ConardLi | 6 |
| codeswithroh/tastemaker | codeswithroh | 2 |
| elayadesign/ai-design-skills | Elaya | 2 |
プレイブックの内容をクライアント向けの作業に引用する際は、帰属表示をそのまま保持してください。