用途
UI Orchestrator 是一个 UI/UX 技能调度器,用于在进行 UI/UX 设计、界面开发或设计系统工作时,选择并路由到适用的专门外部 Skill。它本身不复制外部 Skill 的具体规则,而是负责检测项目需求、检查目标 Skill 是否已安装,并将任务分派给合适的 Skill。
该工具接受中文和英文提问,并始终使用中文回复。
主要能力
外部 Skill 清单
| Skill | 定位 | 适用场景 | 安装命令 |
|---|---|---|---|
| baseline-ui | 代码审查 & 质量守护 | 企业内部系统、代码审查、性能优化 | npx skills add ibelick/ui-skills |
| ui-ux-pro-max | 设计系统生成 & 决策引擎 | 行业垂直产品、Dashboard、新项目设计 | npm install -g uipro-cli && uipro init --ai claude |
| frontend-design | 创意美学 & 视觉冲击 | 营销着陆页、品牌官网、创意作品集 | npx skills add anthropics/skills --skill frontend-design |
| swiftui-expert-skill | SwiftUI 专家指导 | iOS/macOS SwiftUI 开发 | npx skills add https://github.com/avdlee/swiftui-agent-skill --skill swiftui-expert-skill |
设计哲学光谱
从保守/安全到大胆/创意,对应不同 Skill:
- 保守/安全(“不出错”):baseline-ui
- 中性/平衡(“符合行业”):ui-ux-pro-max
- 大胆/创意(“令人难忘”):frontend-design
工作流程
- 检测项目需求:平台类型(Web / iOS / Android)、项目性质(企业 / 创意 / 行业垂直)、任务类型(新建 / 审查 / 修复)。
- 检查 Skill 是否存在:存在则路由到对应 Skill;不存在则提示安装命令。
- 执行对应 Skill。
场景路由表
按平台路由:
| 平台 | 首选 Skill | 备选 |
|---|---|---|
| SwiftUI (iOS/macOS) | swiftui-expert-skill | - |
| Web (React/Vue/HTML) | 见下方按任务路由 | - |
| Flutter/Compose | ui-ux-pro-max | - |
按任务路由(Web):
| 任务类型 | 首选 Skill | 理由 |
|---|---|---|
| 新项目设计系统 | ui-ux-pro-max | 生成完整设计系统 |
| 代码审查 | baseline-ui | 专为审查设计 |
| 修复无障碍 | baseline-ui (fixing-accessibility) | 最专业 |
| 修复动画性能 | baseline-ui (fixing-motion-performance) | 最深入 |
| 营销着陆页 | frontend-design | 需要视觉冲击力 |
| 品牌官网 | frontend-design | 需要独特识别度 |
| 企业内部系统 | baseline-ui | 稳定、可维护 |
| Dashboard | ui-ux-pro-max → baseline-ui | 功能性 + 质量保障 |
按项目性质路由:
| 项目性质 | 推荐组合 | 使用顺序 |
|---|---|---|
| 创意/营销 | frontend-design → baseline-ui | 先创意,后审查 |
| 企业/行业 | ui-ux-pro-max → baseline-ui | 先设计系统,后质量 |
| 内部工具 | baseline-ui | 全程约束 |
使用方式
Skill 检测
在调用外部 Skill 前,必须检测其是否已安装。检测方法:
# 检查 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
未安装提示模板
⚠️ 所需 Skill 未安装
您需要的 {skill-name} 尚未安装。请运行以下命令安装:
{install-command}
安装完成后,请重新运行 UI 任务。
使用示例
示例一:SwiftUI 开发
用户:帮我优化这个 SwiftUI 视图的性能
Claude:
- 检测 Skill... ✅ swiftui-expert-skill 已安装
- 路由到 swiftui-expert-skill 处理 SwiftUI 性能优化...
示例二:新项目设计系统
用户:我要做一个医疗行业的 SaaS 产品,帮我设计 UI
Claude:
- 检测 Skill... ❌ ui-ux-pro-max 未安装
⚠️ 所需 Skill 未安装
您需要的 ui-ux-pro-max 尚未安装。请运行以下命令安装:
npm install -g uipro-cli && uipro init --ai claude
安装完成后,请重新运行 UI 任务。
示例三:营销着陆页
用户:帮我设计一个有视觉冲击力的产品着陆页
Claude:
- 检测 Skill... ✅ frontend-design 已安装
- 路由到 frontend-design 处理创意设计... (设计完成后)
- 建议:设计完成后,可使用 baseline-ui 进行无障碍和性能审查
适用场景
- SwiftUI (iOS/macOS) 开发
- Web (React/Vue/HTML) 界面开发
- Flutter/Compose 开发
- 新项目设计系统搭建
- 代码审查、无障碍修复、动画性能修复
- 营销着陆页、品牌官网、创意作品集设计
- 企业内部系统、Dashboard 设计
约束
调度约束:
- 必须先检测目标 Skill 是否存在
- 禁止复制外部 Skill 的具体规则
路由约束:
- SwiftUI 项目 → 必须路由到 swiftui-expert-skill
- 创意/营销项目 → 优先 frontend-design
- 企业/内部项目 → 优先 baseline-ui
- 新项目设计系统 → 优先 ui-ux-pro-max
组合使用约束:
- 创意项目完成后,建议使用 baseline-ui 审查
Skill 协作
| 场景 | 协作 Skill | 说明 |
|---|---|---|
| 开发阶段 | /dev-workflow | 被调用:UI 任务开发时 |
| 代码审查 | /code-quality | 协作:UI 代码质量检查 |
| 测试阶段 | /testing-guide | 协作:UI 组件测试 |
限制
资料未提供该工具自身的收费、价格、平台支持范围、性能效果等具体信息,暂未提供。