| name | picasso-dev-ui |
| description | Use when Picasso 需求进入 UI 设计阶段，或需要优化 PC Web、微信小程序、移动端 App 的页面结构、视觉层级、交互路径、状态设计和端适配体验。 |
Picasso Dev UI
定位
picasso-dev-ui 是 Picasso 项目的三端 UI companion skill 和 UI 设计路由入口。
它不负责需求拆解、服务端方案或测试验收，而是只做三件事：
- 输出可执行的 UI 交互设计规范
- 指导 PC / 小程序 / App 的页面实现
- 对现有页面做二次优化和体验提升
什么时候使用
以下场景必须调用本 skill：
picasso-dev 进入 UI 设计阶段- 用户要求页面优化、交互更顺手、视觉更统一
- 需求涉及
PC + 小程序 + App 任一端
- 已有页面需要做视觉、布局、状态或端适配优化
- 用户提供了原型、HTML、截图、线上页面，希望输出 UI 实施规范
必须先读取
../../profiles/picasso/profile.yaml../../profiles/picasso/conventions.md../../shared/references/design/README.md../../shared/templates/UI交互设计模板.md../../shared/templates/页面接口验收总表模板.md- 当前需求目录中的：
manifest.json00-需求总览.md*-需求文档.md*-技术方案.md（如存在）
- 用户提供的原型、HTML、截图、线上地址
路由规则
1. 先补设计底座
默认先判断当前运行端是否可识别 ui-ux-pro-max：
- 若可识别：优先让它输出风格方向、token、组件策略、动效与可访问性基线
- 若不可识别：回退到 Picasso 包内设计底座
- 默认不得把
frontend-design 或其他通用设计 skill 当成兜底替代
无论哪种情况，最终都继续调用：
../picasso-dev-design-system/SKILL.md
用于明确：
- 风格方向
- token 基线
- 组件层级
- 动效与反馈
- 可访问性与响应式
2. 再按平台补专项规则
根据需求平台按需继续读取：
- PC / H5：
../picasso-dev-ui-web/SKILL.md
- iOS / SwiftUI：
../picasso-dev-ui-ios/SKILL.md
- Android：
../picasso-dev-ui-android/SKILL.md
- 微信小程序：
../picasso-dev-ui-miniapp/SKILL.md
3. 验收或回归时补审查
页面实现、截图或本地页面可见后，继续调用：
../picasso-dev-ui-review/SKILL.md
核心原则
1. 不输出泛化后台页面
- 不直接套默认后台样式
- 不把三端页面简单做缩放复用
- 不只写字段，不写信息层级、状态、空态和异常态
2. 三端同源，不同形
- PC：强调信息密度、查询效率、批量操作
- 小程序：强调轻量路径、安全区、微信使用习惯
- App：强调单手操作、主操作区、分段表单和返回路径
3. 先设计基线，再交互闭环，再视觉强化
输出顺序固定为：
- 页面目标
- 风格方向与信息层级
- token 与组件语义
- 核心交互路径
- 状态、反馈与异常处理
- 动效与可访问性要求
- 端差异说明
默认输出
必须产出：
按需补充：
至少覆盖：
- 页面定位与目标用户
- 风格方向与品牌 / 气质关键词
- 三端范围矩阵
- 页面结构与信息层级
- 字段与组件映射
- 操作路径
- 状态、空态、加载态、错误态
- 动效与反馈规则
- 可访问性与响应式要求
- PC / 小程序 / App 差异说明
- 视觉与实现约束
- 开发注意事项
- 验收要点
最小上下文原则
- 不全量加载所有设计参考
- 只加载当前终端相关的 reference
- 如果只是 PC 页面优化，不读取 iOS / Android / 小程序专项规范
- 如果只是 UI 审查，不重复读取服务端规则
对开发线程的要求
若本 skill 已产出 *-UI交互设计规范.md：
- PC 前端实现必须回对规范
- 小程序线程必须回对规范
- App 线程必须回对规范
- UI 验收必须以该规范核对页面体验
- 产品验收必须在 UI 验收通过后，再核对业务口径与关键交互是否一致
