メニュー
Use when planning complex UI implementations, ensuring design consistency, or bridging design intent with code. Requires Superdesign MCP server.
デフォルトでは、最初にソースを確認する Prompt が選択されています。直接コマンドに切り替えるか、ローカルコピーをダウンロードすることもできます。
インストールを決める前に、SKILL.md と SkillsMP に表示されている付属ファイルをお読みください。
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
直接コマンドでは確認用 Prompt が省略されます。実行前にソースを確認してください。
npx skills add https://github.com/ktg-one/mcp --skill superdesign-expertコマンドは1行のまま表示されます。コピー前に横へスクロールして全体を確認してください。
ローカルで確認しますか？SkillsMP が現在取得できるファイルをダウンロードできます。
When to spawn agents vs work directly - parallel execution, specialization
You MUST use this before any creative work - creating features, building components, adding functionality, or modifying behavior. Explores user intent, requirements and design before implementation.
Use when the user asks to run Codex CLI (codex exec, codex resume) or references OpenAI Codex for code analysis, refactoring, or automated editing
SKILL.md を表示中
SOC 職業分類に基づく
| name | superdesign-expert |
| description | Use when planning complex UI implementations, ensuring design consistency, or bridging design intent with code. Requires Superdesign MCP server. |
Expert in using Superdesign MCP for AI-powered design orchestration.
Superdesign is an open-source AI design agent that provides structured design specifications for your IDE's LLM to execute. It acts as a "design orchestrator" that bridges design intent with code implementation.
{
"mcpServers": {
"superdesign": {
"command": "npx",
"args": ["-y", "@jonthebeef/superdesign-mcp"]
}
}
}
You describe what you want to build:
Create a settings page with:
- Profile section with avatar
- Notification preferences
- Theme toggle
- Account management
Superdesign generates detailed specifications:
{
"component": "SettingsPage",
"layout": "stack",
"sections": [
{
"name": "ProfileSection",
"components": ["Avatar", "NameField", "EmailField"],
"spacing": "lg"
}
]
}
Claude uses these specs to generate consistent code.
Instead of: "settings page"
Say: "iOS-style settings page with grouped sections,
disclosure indicators, and system-standard spacing"
"Like Apple's Settings app" or
"Following Material Design 3 patterns"
"Toggle should animate, disclosure rows
should push to detail views"