デザイナー向けの Agent Skills
デザイナー向けのスキルは、発散と収束を交互に繰り返すデザイン作業の弧全体をカバーします。人と問題を理解するためのリサーチとディスカバリー、解決策を判断できるほど問題を鋭く定義すること、コミットする前に複数の方向性を生み出すアイデア出し、書体・色・画像・階層のためのビジュアルデザイン、クリックして試せる版を作るプロトタイピング、エンジニアが推測せずに作れるようにするハンドオフ、そして後の画面が最初の画面を再発明しないようにするデザインシステムです。ランキングリストは、いたいフェーズではなく、今いるフェーズを見つけて使いましょう。そのサブトピックの上位数項目を読み、それぞれが実際に何をするかを比較し、次に作る必要のある成果物に合うものを選びましょう。
8 件から開始59 件のおすすめ候補
まずはこちらから。
Design work alternates diverge/converge: discover the problem, define it, explore solutions, then make and hand off something buildable.
関連性の高い結果です。Skill の説明を読み、目的に合うか確認してください。
- 順位 01Agent Skill を見る直接一致
figma-generate-library
公式コードベースからFigmaでプロ品質のデザインシステムを構築または更新。ユーザーが変数/トークンの作成、コンポーネントライブラリの構築、テーマ設定（ライト/ダークモード）、基盤の文書化、コードとFigmaのギャップの解消を望む場合に使用。このskillは何をどの順序で構築するかを教え、Plugin APIの呼び出し方を教える`figma-use` skillを補完する。両方のskillを一緒に読み込むこと。
- 順位 02Agent Skill を見る直接一致
penpot-build-screen
公式シニアビジュアルデザイナーとして、ブリーフからPenpotで本番品質の画面を設計します — 既存のデザインシステム（トークン＋コンポーネント）を再利用し、セクションごとに組み立て、決して一発で仕上げません。説明から画面/ページ/ランディング/ダッシュボードを作成する際に使用します。既存コードの変換には使用しません（penpot-build-from-codeを使用）。トリガー：「ダッシュボードをデザインして」「ランディングページを作成して」「このアプリ画面をデザインして」「このブリーフからUIを構築して」「設定ページをデザインして」「Penpotで画面をモックアップして」。
- 順位 03Agent Skill を見る直接一致
penpot-document-handoff
公式Penpotのデザインをハンドオフ用にドキュメント化する。デザインの上ではなく横に、クリーンな注釈レイヤーを構築する：左側にコンテキストカード（「How might we」のゴール、ビジネスルール、リンク、ステータス、求めるフィードバック／不要なフィードバック）、UI上に番号付きピンマーカー、右側に対応する観察／提案のノートカード、任意でツールチップ。すべてを1つの非表示可能なグループにまとめ、クリーンなデザインを表示できるようにする。注釈コンポーネントキットとトークンがあれば再利用し、なければ最小限のものを提案・作成する。監査（penpot-audit-*を使用）やレイヤー名の変更（penpot-rename-layersを使用）には非対応。トリガー：「document this design」「annotate this screen」「prepare this for handoff」「add design annotations」「explain this flow for devs」「add observation notes」「create a critique card」「spec this screen for handoff」。
- 順位 04Agent Skill を見る直接一致
impeccable
フロントエンドインターフェースの設計、再設計、批評、監査、研磨、改善：UXレビュー、視覚的階層、アクセシビリティ、テーマ設定、タイポグラフィ、モーション、再利用可能なデザインシステムまたはトークン。
前提条件（自己申告）: Node.js
319,215 · 人気度 - 順位 05Agent Skill を見る直接一致
design-system
トークンアーキテクチャ、コンポーネント仕様、スライド生成:3層トークン(プリミティブ、セマンティック、コンポーネント)、CSS変数、スペーシング/タイポグラフィスケール、コンポーネント仕様。
35,230 · 人気度 - 順位 06Agent Skill を見る直接一致
interface-design
ダッシュボード、管理パネル、SaaSアプリ、ツール、データインターフェース向けのクラフト重視のインターフェースデザイン。ビジュアルクラフト、レイアウト階層、トークン、状態、デザインシステムの一貫性をカバー。
28,822 · 人気度 - 順位 07Agent Skill を見る直接一致
design-system-patterns
デザイントークン、テーマ基盤、コンポーネントアーキテクチャパターンを用いてスケーラブルなデザインシステムを構築します。セマンティックトークンの階層とFigmaからコードへのワークフローを含みます。
15,237 · 人気度 - 順位 08Agent Skill を見る直接一致
penpot-uiux-design
MCPツールを用いてPenpotでプロフェッショナルなUI/UXデザインを作成するための包括的ガイド：デザインシステム、コンポーネント、トークン、ダッシュボード、フォーム、ナビゲーション、アクセシビリティ。
12,684 · 人気度
ほか 51 件の Agent Skills を表示
- 順位 09Agent Skill を見る直接一致
design-tokens
注目3層アーキテクチャ(プリミティブ、セマンティック、コンポーネント)でDTCG形式のデザイントークンを生成、拡張、監査。
- 順位 10Agent Skill を見る直接一致
figma-create-design-system-rules
公式ユーザーのコードベース向けにカスタムデザインシステムルールを生成します。ユーザーが「create design system rules」「generate rules for my project」「set up design rules」「customize design system guidelines」と言った場合や、Figma-to-codeワークフロー向けのプロジェクト固有の規約を確立したい場合に使用します。Figma MCPサーバー接続が必要です。
前提条件（自己申告）: MCP server
- 順位 11Agent Skill を見る直接一致
figma-generate-design
公式アプリケーションのページ、ビュー、または複数セクションのレイアウトをFigmaへ変換するタスクでは、figma-useと併用してこのスキルを使用します。トリガー例:「Figmaに書き出して」「コードからFigmaで作成して」「ページをFigmaにプッシュして」「このアプリ/ページをFigmaで構築して」「画面を作成して」「Figmaでランディングページを構築して」「コードに合わせてFigma画面を更新して」。ユーザーがコードや説明からFigmaで完全なページ、画面、ビューを構築または更新したいときは常に、このワークフロースキルが推奨されます。search_design_systemでデザインシステムのコンポーネント、変数、スタイルを発見し、それらをインポートし、ハードコードされた値ではなくデザインシステムのトークンを使ってセクションごとに画面を段階的に組み立てます。
- 順位 12Agent Skill を見る直接一致
penpot-audit-tokens
公式Penpotデザインのデザインシステム／トークンガバナンス問題（アクセシビリティとは別）を監査する：トークンが存在するのにハードコードされた色、グリッドから外れた間隔、孤立／未解決／未使用のトークン、重複した値、コンポーネントインスタンスであるべき分離されたパーツ。重大度レポートを生成し、セマンティックトークンへの置き換えを提案する。トリガー：「audit tokens」「find hardcoded colors」「token governance」「check design system consistency」「find off-grid spacing」「detect raw values」「are we using tokens correctly」。
- 順位 13Agent Skill を見る直接一致
ui-ux-pro-max
注目ウェブ、モバイル、デスクトップ向けの UI/UX デザインインテリジェンス。この skill は、ページ、コンポーネント、デザインシステム、アクセシビリティ、インタラクション、レスポンシブレイアウト、タイポグラフィ、配色、チャート、スタック固有の UI 実装など、インターフェースの設計・構築・レビュー・修正を行う際に使用します。検索可能なローカルデータ：79 の検索可能スタイル（50 がアクティブ）、192 の製品パレットと推論プロファイル、74 のフォントペアリング、119 の UX ガイドライン、105 のアイコン、17 の GSAP プリセット、25 のチャート種別、22 のスタック。
359,767 · 人気度 - 順位 14Agent Skill を見る直接一致
superdesign
Superdesignキャンバス上で複数のAIモデルを使い、フロントエンドUI、プレゼンテーション、グラフィックを設計・再設計。デザインシステム、再利用可能なコンポーネント、マルチページフローをサポート。
10,257 · 人気度 - 順位 15Agent Skill を見る直接一致
brandkit
注目ブリーフからアクセシブルなブランドデザインシステムを生成する。DTCGトークン、ライトとダーク、さらにWCAG検証済みの単一のtheme.css。
前提条件（自己申告）: Python
- 順位 16Agent Skill を見る直接一致
prototype
注目アイデアを忠実度の階段（コンテンツ優先からコードまで）に沿って引き上げ、各段階での検証計画とユーザージャーニーマッピングを提供します。
- 順位 17Agent Skill を見る直接一致
figma
公式Figma MCPサーバーを使用して、Figmaからデザインコンテキスト、スクリーンショット、変数、アセットを取得し、Figmaノードを本番コードに変換します。タスクにFigma URL、ノードID、デザインからコードへの実装、またはFigma MCPのセットアップとトラブルシューティングが含まれる場合にトリガーされます。
前提条件（自己申告）: Node.js
- 順位 18Agent Skill を見る直接一致
frontend-design-review
公式> 高いデザイン品質とデザインシステム準拠を備えた、際立つプロダクショングレードのフロントエンドインターフェースをレビューし作成する。3つの柱で評価する：摩擦のないインサイトからアクションへの流れ、品質あるクラフト、信頼できる構築。USE FOR: PRレビュー、デザインレビュー、アクセシビリティ監査、デザインシステム準拠チェック、クリエイティブなフロントエンドデザイン、UIコードレビュー、コンポーネントレビュー、レスポンシブデザインチェック、テーマテスト、記憶に残るUIの作成。DO NOT USE FOR: バックエンドAPIレビュー、データベーススキーマレビュー、インフラまたはDevOps作業、UIを伴わない純粋なビジネスロジック、フロントエンド以外のコード。
- 順位 19Agent Skill を見る直接一致
penpot-build-from-code
公式既存のアプリケーションページ、ビュー、またはコンポーネントのコードを、既存のデザインシステムにバインドされたPenpotスクリーンに変換します。コードのスタイルをセマンティックトークンにマッピングし、生のシェイプではなくライブラリコンポーネントを再利用します。ユーザーが実際のコード/マークアップを持ち、それをPenpotでセクションごとにオンステムで再構築したい場合に使用します。トリガー：「build this in Penpot from code」「turn this React/HTML/CSS into a Penpot screen」「recreate this view in Penpot」「port this page to Penpot」「translate this component to Penpot bound to our tokens」「code to Penpot」。
- 順位 20Agent Skill を見る直接一致
penpot-design-md
公式PenpotファイルからDESIGN.mdデザインドキュメントファイルを抽出する：design-md形式のポータブルなMarkdown仕様（色・タイポグラフィ・角丸・スペーシング・コンポーネントのトークンマップを含むYAMLフロントマター＋Overview、Colors、Typography、Layout、Shapes、Components、Do's & Don'ts、Iteration Guide、Known Gapsの散文セクション）。ファイルの実際のトークン、ライブラリアセット、サンプリングしたコンポーネントスタイルに基づき、決して創作しない。キャンバスは読み取り専用で、ローカルのMarkdownファイルを1つ書き出す。トリガー：'generate DESIGN.md'、'create a design.md'、'document the design system as markdown'、'export design guidelines'、'extract design documentation'、'design system spec file'、'make a style guide file from this design'。
- 順位 21Agent Skill を見る直接一致
design-mobile-apps
Sleek APIを通じてモバイルアプリのUI画面を設計。プロジェクトを作成し、画面を平易な言葉で記述し、HTML、React Native、SwiftUI向けにレンダリングされた画面を受け取ります。
前提条件（自己申告）: API key · Paid account
680,204 · 人気度 - 順位 22Agent Skill を見る直接一致
design-taste-frontend
ランディングページ、ポートフォリオ、リデザイン向けのアンチスロップなフロントエンドskill。ブリーフを読み、デザインの方向性を推論し、実際のデザインシステムと監査優先のリデザインでテンプレート的でないインターフェースを仕上げる。
576,715 · 人気度 - 順位 23Agent Skill を見る直接一致
stitch-design-taste
Google Stitch向けのagentフレンドリーなDESIGN.mdファイルを生成し、プレミアムで汎用的でないUI基準を強制する：厳格なタイポグラフィ、調整された色、非対称レイアウト、マイクロモーション。
360,899 · 人気度 - 順位 24Agent Skill を見る直接一致
emil-design-eng
UI の磨き込み、コンポーネント設計、アニメーションの判断、ソフトウェアを心地よくする見えないディテールに関する Emil Kowalski の哲学を、必須のレビュー形式とともに体系化する。
334,004 · 人気度 - 順位 25Agent Skill を見る直接一致
apple-design
Apple のインターフェースデザインと流動的な物理モーションのアプローチをウェブ向けに翻訳：ジェスチャー駆動 UI、スプリングアニメーション、ドラッグ/スワイプ/シートのインタラクション、マテリアル、タイポグラフィ、モーション低減。
193,107 · 人気度 - 順位 26Agent Skill を見る直接一致
design-md
注目Stitchプロジェクトを分析し、意味論的なデザインシステムをDESIGN.mdファイルに統合。
61,832 · 人気度 - 順位 27Agent Skill を見る直接一致
design
ブランドアイデンティティ、デザイントークン、UIスタイリング、ロゴ生成、コーポレートアイデンティティプログラム、プレゼンテーション、バナー、ソーシャル写真、アイコンを網羅する統合デザインSkill。
33,989 · 人気度 - 順位 28Agent Skill を見る直接一致
taste-design
Google Stitch向けのagentフレンドリーなDESIGN.mdファイルを生成し、プレミアムで汎用的でないUI基準を強制する：厳格なタイポグラフィ、調整された色、非対称レイアウト、マイクロモーション。
19,080 · 人気度 - 順位 29Agent Skill を見る直接一致
expo-design-system
Expo アプリ内でデザインシステムを構築・維持します：デザイントークン（色、間隔、タイポグラフィ、角丸、影、モーション）の再利用可能なテーマ、コンポーネントの規約、ドリフト監査。
12,347 · 人気度 - 順位 30Agent Skill を見る直接一致
hue
注目ブランドやリファレンスから新しいデザイン言語のSkillを生成するメタSkillです。
- 順位 31Agent Skill を見る直接一致
frontend-design
公式新規UI構築時や既存UI再形成時に、際立った意図的なビジュアルデザインを導く。美的方向性、タイポグラフィ、テンプレート然としない選択を支援。
765,703 · 人気度 - 順位 32Agent Skill を見る直接一致
high-end-visual-design
ハイエンドな代理店ビジュアルデザインを教える：ウェブサイトを高級感のあるものにする正確なフォント、スペーシング、シャドウ、カード構造、アニメーション。凡庸なデフォルトを排除。
420,662 · 人気度 - 順位 33Agent Skill を見る直接一致
gpt-taste
エリートUX/UIおよびGSAPモーションエンジニアリング:Python駆動のレイアウトランダム化、AIDAページ構造、ワイドなエディトリアルタイポグラフィ、隙間のないベントーグリッド、厳格なGSAP ScrollTriggers。
364,217 · 人気度 - 順位 34Agent Skill を見る直接一致
figma-code-connect-components
公式Code Connectマッピングツールを使ってFigmaのデザインコンポーネントをコードコンポーネントに接続する。ユーザーが「code connect」「connect this component to code」「map this component」「link component to code」「create code connect mapping」と言う場合、またはFigmaデザインとコード実装の間のマッピングを確立したい場合に使用。`use_figma`によるキャンバス書き込みには`figma-use`を使用。
前提条件（自己申告）: Node.js
- 順位 35Agent Skill を見る直接一致
tailwind-design-system
注目Tailwind CSS v4、デザイントークン、コンポーネントライブラリ、レスポンシブパターンでスケーラブルなデザインシステムを構築。コンポーネントライブラリの作成、デザインシステムの実装、UIパターンの標準化に使用。
64,327 · 人気度 - 順位 36Agent Skill を見る直接一致
ui-styling
shadcn/uiコンポーネント、Tailwind CSSユーティリティスタイリング、キャンバスベースのビジュアルデザインを用いてアクセシブルなUIを作成します。デザインシステム、レスポンシブレイアウト、ダークモードを含みます。
32,431 · 人気度 - 順位 37Agent Skill を見る直接一致
web-design-guidelines
公式Web Interface Guidelines への準拠について UI コードをレビューします。「review my UI」「check accessibility」「audit design」「review UX」「check my site against best practices」と依頼されたときに使用します。
- 順位 38Agent Skill を見る直接一致
image-to-code
画像ファーストのウェブサイト設計からコード化までのスキル：デザイン画像を生成し、深く分析してから、それに合致するようウェブサイトを実装。ありがちなカードの乱用や弱い階層を回避。
350,805 · 人気度 - 順位 39Agent Skill を見る直接一致
extract-design-system
注目公開ウェブサイトからデザインプリミティブを抽出し、プロジェクト用のスタータートークンファイルを生成します。
129,148 · 人気度 - 順位 40Agent Skill を見る直接一致
firecrawl-website-design-clone
Firecrawl のスクレイプ証拠を用いて、ウェブサイトのデザインシステムを agent 対応の DESIGN.md に抽出します：色、フォント、スペーシング、コンポーネント、レイアウトパターン、ブランドガイダンス。
32,746 · 人気度 - 順位 41Agent Skill を見る一致の可能性
imagegen-frontend-web
セクションごとに 1 枚のプレミアムなウェブサイトデザイン参考画像を生成します。構図の多様性、物語的なコンセプトの背骨、ランディングページやマーケティングサイト向けの一貫したパレットを備えます。
346,401 · 人気度 - 順位 42Agent Skill を見る一致の可能性
imagegen-frontend-mobile
iOS、Android、クロスプラットフォーム向けのプレミアムなモバイルアプリ画面コンセプトとフローを生成。クリーンな階層、制御されたパレット、スマホモックアップの枠組みを備える。
340,357 · 人気度 - 順位 43Agent Skill を見る一致の可能性
enhance-prompt
注目曖昧なUIアイデアを、Stitchに最適化された洗練されたプロンプトへ変換します。具体性を高め、UI/UXキーワードを追加し、デザインシステムのコンテキストを注入し、より良い生成結果のために出力を構造化します。
56,037 · 人気度 - 順位 44Agent Skill を見る一致の可能性
react:components
Stitchデザインをモジュール式のViteおよびReactコンポーネントに変換、または既存のReactコンポーネントを最新のStitchデザインに合わせて同期。ASTベースの検証付き。
50,432 · 人気度 - 順位 45Agent Skill を見る一致の可能性
landing-page-design
レイアウトルール、ヒーローセクションのデザイン、CTA心理学、ファーストビューの公式、社会的証明の配置、モバイルデザインによるランディングページのコンバージョン最適化。
45,260 · 人気度 - 順位 46Agent Skill を見る一致の可能性
stitch-design
フロントエンド（React、Angular、Vue）をStitch Designに変換。静的HTML抽出、デザインシステム抽出、ファイルアップロードを連鎖させる。
25,095 · 人気度 - 順位 47Agent Skill を見る一致の可能性
kpi-dashboard-design
メトリクス選定、可視化のベストプラクティス、チャート選択、リアルタイム監視パターンを備えた効果的なKPIダッシュボードを設計する。
15,222 · 人気度 - 順位 48Agent Skill を見る一致の可能性
SVG Logo Designer
説明とデザイン仕様からプロフェッショナルなSVGロゴを作成し、異なるレイアウト、スタイル、コンセプトで複数のバリエーションを生成する。
7,522 · 人気度 - 順位 49Agent Skill を見る一致の可能性
diagram-design
注目ブランドに沿ったアーキテクチャ、IT現状、フローチャート、シーケンス、ステートマシン、ER／データモデル、タイムライン、スイムレーン、クアドラント、レーダー／スパイダー、ポーラーチャート（polar/radial lollipop）、ループ／フライホイール、ネスト、ツリー、組織図、レイヤースタック、Venn、ピラミッド／ファネル、ツリーマップ、棒、ウォーターフォール、折れ線、ガント、散布図を、ハイレベル、プロセス、メダリオン、データフロー、DP統合、DPセキュリティマトリクス、Sankey、フィッシュボーン、Wardleyマップ、カンバン、ユーザージャーニー、デプロイ、依存関係グラフ、UMLクラス、ストーリーマップ、データベーススキーマの図として、単体のHTML／SVG／PNGで作成。.drawio／.drawio.png／.drawio.svg、Mermaid .mmd、Excalidraw .excalidrawのソースを指定のサイズ／詳細度で再描画。ウェブサイトからブランドトークンを取り込み。セマンティックパターン、コールアウト、アクセシブルなモーション、スケッチ／手描き風スタイルを追加。
- 順位 50Agent Skill を見る一致の可能性
canvas-design
公式デザイン哲学を用いて、.pngおよび.pdfドキュメントで美しいビジュアルアートを作成します。ユーザーがポスター、アート作品、デザイン、その他の静的な作品の作成を求めたときにこのスキルを使用してください。著作権侵害を避けるため、既存のアーティストの作品を決してコピーせず、オリジナルのビジュアルデザインを作成します。
- 順位 51Agent Skill を見る一致の可能性
theme-factory
公式テーマで成果物をスタイリングするためのツールキット。成果物はスライド、ドキュメント、レポート、HTMLランディングページなど。色やフォントを設定した10個のプリセットテーマがあり、作成済みの任意の成果物に適用できるほか、その場で新しいテーマを生成することも可能。
- 順位 52Agent Skill を見る一致の可能性
brainstorming
協働的な対話を通じてアイデアを完全な設計と仕様に変え、実装前にリクエストを spike、bounded、architectural に分類します。
383,748 · 人気度 - 順位 53Agent Skill を見る一致の可能性
animation-vocabulary
注目Webアニメーションやモーションエフェクトの漠然とした説明を正確な用語に変換する逆引き用語集（「ポップオーバーが開くときの弾むやつ」→ Pop in、「iOSのゴムバンドスクロール」→ Rubber-banding）。ユーザーが「〜って何て言うの？」と尋ねたとき、またはモーションエフェクトの名前を知らずにAIやデザイナーへのプロンプトに使う正しい言葉を求めるときに使用します。エフェクトの命名用であり、設計や構築用ではありません。
149,000 · 人気度 - 順位 54Agent Skill を見る一致の可能性
flutter-add-widget-preview
previews.dartシステムを用いてFlutterプロジェクトにインタラクティブなウィジェットプレビューを追加し、一貫したデザインとUIコンポーネントのインタラクティブなテストを実現します。
33,809 · 人気度 - 順位 55Agent Skill を見る一致の可能性
banner-design
ソーシャルメディア、広告、ウェブサイトのヒーロー、印刷物向けのバナーを、複数のアートディレクションの選択肢、セーフゾーン規則、HTML/CSSコンポジションで設計する。
32,427 · 人気度 - 順位 56Agent Skill を見る一致の可能性
power-bi-report-design-consultation
Power BIレポートのビジュアル設計相談。チャート選択、レイアウト設計、対象読者別のパターン、効果的なレポートのためのアクセシビリティ。
9,339 · 人気度 - 順位 57Agent Skill を見る一致の可能性
brand-guidelines
公式Anthropicの公式ブランドカラーとタイポグラフィを、Anthropicのルックアンドフィールが役立つあらゆる成果物に適用します。ブランドカラーやスタイルガイドライン、視覚的フォーマット、企業のデザイン標準が該当する場合に使用します。
- 順位 58Agent Skill を見る一致の可能性
ui-taste
WebとiOS向けのanti-ui-slopプレイブックでコーディングエージェントのUIセンスを向上：レイアウト選定、視覚的階層、磨き込み、デザインレビューのワークフロー。
452,376 · 人気度 - 順位 59Agent Skill を見る一致の可能性
ios-design
SwiftUI、UIKit、React NativeでのiPhoneアプリ向けiOS UI/UXを設計・レビュー。ナビゲーション、タイポグラフィ、フォーム、キーボードとセーフエリアのレイアウト、Apple HIGに沿ったアクセシビリティ。
249,982 · 人気度
このトピックの内容
各サブトピックは、特定の状況に合う Agent Skills をまとめたものです。
- Research & discovery
- Learn about the people and the problem before drawing screens.
- Define the problem
- Name the problem sharply enough that a solution can be judged.
- Ideation
- Generate more than one direction before committing.
- Visual design
- How it looks: type, color, imagery, and hierarchy.
- Prototyping
- A version people can click so the idea can be tested.
- Handoff
- Give engineering enough to build it without guessing.
- Design systems
- Shared parts so later screens do not reinvent the first one.
よくある質問
- このリストはどのように並べられていますか？
- 観測された検索需要でランク付けされており、トピックに直接一致するものが先に配置され、単一のパブリッシャーが占められる項目数には上限があります。
- プロジェクトの初期段階なら、どこから始めればよいか？
- まず research と discovery から始め、次に問題を定義しましょう。問題を鋭く名付けることが、後のあらゆる解決策を判断可能にします。
- 1つのスキルでデザインプロセス全体をカバーできますか？
- サブトピックは発散と収束のリズムに沿って分かれます。問題を発見し定義し、方向性を探り、そして構築可能なものを制作し引き渡します。1つですべてをまたぐことを期待するのではなく、自分がいるフェーズに合うスキルを選んでください。
- 似た2つのスキルを選ぶ前に、何を見るべきですか？
- それぞれが生み出す成果物を、次に必要なものと比較してください。クリック可能なプロトタイプ、ハンドオフ仕様、共有コンポーネントセットのいずれであってもです。
Agent Skill のインストール方法
Agent Skills は SKILL.md ファイルです。適切な skills ディレクトリに置くと、多くのエージェントが自動で認識します。
- Claude Code — copy the SKILL.md for figma-generate-library into ~/.claude/skills/figma-generate-library/ for yourself, or .claude/skills/figma-generate-library/ to share it with a project.
- From the registry — run npx skills add openai/skills@figma-generate-library.
- Or download figma-generate-library from its source and place that SKILL.md in the directory above.
選び方 インストール前に出典と Skill 自身の説明を確認してください。Official と Notable は出所を示すラベルです。