UI Orchestrator
UI/UX skill dispatcher, routing to specialized external Skills based on project needs.
Language
- Accept questions in both Chinese and English
- Always respond in Chinese
External Skill List
| Skill |
Positioning |
Applicable Scenarios |
Install Command |
baseline-ui |
Code Review & Quality Guardian |
Enterprise internal systems, code review, performance optimization |
npx skills add ibelick/ui-skills |
ui-ux-pro-max |
Design System Generation & Decision Engine |
Industry vertical products, Dashboard, new project design |
npm install -g uipro-cli && uipro init --ai claude |
frontend-design |
Creative Aesthetics & Visual Impact |
Marketing landing pages, brand websites, creative portfolios |
npx skills add anthropics/skills --skill frontend-design |
swiftui-expert-skill |
SwiftUI Expert Guidance |
iOS/macOS SwiftUI development |
npx skills add https://github.com/avdlee/swiftui-agent-skill --skill swiftui-expert-skill |
Design Philosophy Spectrum
保守/安全 中性/平衡 大胆/创意
│ │ │
▼ ▼ ▼
baseline-ui ui-ux-pro-max frontend-design
"不出错" "符合行业" "令人难忘"
Workflow
1. 检测项目需求
│
├── 平台类型（Web / iOS / Android）
├── 项目性质（企业 / 创意 / 行业垂直）
└── 任务类型（新建 / 审查 / 修复）
│
▼
2. 检查 Skill 是否存在
│
├── 存在 → 路由到对应 Skill
└── 不存在 → 提示安装命令
│
▼
3. 执行对应 Skill
Scenario Routing Table
Route by Platform
| Platform |
Preferred Skill |
Alternative |
| SwiftUI (iOS/macOS) |
swiftui-expert-skill |
- |
| Web (React/Vue/HTML) |
See Route by Task below |
- |
| Flutter/Compose |
ui-ux-pro-max |
- |
Route by Task (Web)
| Task Type |
Preferred Skill |
Reason |
| New project design system |
ui-ux-pro-max |
Generate a complete design system |
| Code review |
baseline-ui |
Designed specifically for review |
| Fix accessibility |
baseline-ui (fixing-accessibility) |
Most professional |
| Fix animation performance |
baseline-ui (fixing-motion-performance) |
Most in-depth |
| Marketing landing page |
frontend-design |
Requires visual impact |
| Brand website |
frontend-design |
Requires unique recognition |
| Enterprise internal system |
baseline-ui |
Stable, maintainable |
| Dashboard |
ui-ux-pro-max → baseline-ui |
Functionality + quality assurance |
Route by Project Nature
| Project Nature |
Recommended Combination |
Usage Order |
| Creative/Marketing |
frontend-design → baseline-ui |
Creative first, then review |
| Enterprise/Industry |
ui-ux-pro-max → baseline-ui |
Design system first, then quality |
| Internal Tools |
baseline-ui |
Constrain throughout |
Skill Detection
Before invoking an external Skill,mustdetect whether it is already installed.
Detection Method
# 检查 skills 目录（Claude Code / Codex / OpenCode）
for dir in ~/.claude/skills ~/.agents/skills; do
ls -la "$dir" 2>/dev/null | grep -E "(baseline-ui|ui-ux-pro-max|frontend-design|swiftui-expert)"
done
# 检查项目本地 skills
for dir in .claude/skills .agents/skills; do
ls -la "$dir" 2>/dev/null | grep -E "(baseline-ui|ui-ux-pro-max|frontend-design|swiftui-expert)"
done
Not Installed Prompt Template
**⚠️ 所需 Skill 未安装**
您需要的 `{skill-name}` 尚未安装。请运行以下命令安装：
{install-command}
安装完成后，请重新运行 UI 任务。
Constraints
Dispatch Constraints
- Must first detect whether the target Skill exists
- Forbidden to copy the specific rules of external Skills
Routing Constraints
- SwiftUI projects → must route to
swiftui-expert-skill
- Creative/Marketing projects → prioritize
frontend-design
- Enterprise/Internal projects → prioritize
baseline-ui
- New project design systems → prioritize
ui-ux-pro-max
Combined Usage Constraints
- After creative projects are completed,recommendedto use
baseline-ui review
Skill Collaboration
| Scenario |
Collaboration Skill |
Description |
| Development Phase |
/dev-workflow |
Invoked: During UI task development |
| Code Review |
/code-quality |
Collaboration: UI code quality check |
| Testing Phase |
/testing-guide |
Collaboration: UI component testing |
Usage Examples
Example 1: SwiftUI Development
用户：帮我优化这个 SwiftUI 视图的性能
Claude：
1. 检测 Skill...
✅ swiftui-expert-skill 已安装
2. 路由到 swiftui-expert-skill 处理 SwiftUI 性能优化...
Example 2: New Project Design System
用户：我要做一个医疗行业的 SaaS 产品，帮我设计 UI
Claude：
1. 检测 Skill...
❌ ui-ux-pro-max 未安装
⚠️ 所需 Skill 未安装
您需要的 `ui-ux-pro-max` 尚未安装。请运行以下命令安装：
npm install -g uipro-cli && uipro init --ai claude
安装完成后，请重新运行 UI 任务。
Example 3: Marketing Landing Page
用户：帮我设计一个有视觉冲击力的产品着陆页
Claude：
1. 检测 Skill...
✅ frontend-design 已安装
2. 路由到 frontend-design 处理创意设计...
（设计完成后）
3. 建议：设计完成后，可使用 baseline-ui 进行无障碍和性能审查
Reference Materials
