feat(dev): 新增开发分析与设计 Skill

plugins/dev/skills/design-frontend/SKILL.md

@@ -0,0 +1,24 @@
+---
+name: design-frontend
+description: 基于需求、现有前端代码和项目规范设计页面清单、路由、状态、交互、组件组合和数据流。适用于新页面或复杂前端变更的设计；组件单项选型、纯视觉样式、表单局部布局、接口映射或直接编码不应触发。
+---
+
+# 前端设计
+
+将用户场景转化为可实现的页面级契约，不生成完整前端代码，不绑定固定框架、组件库或页面模板。
+
+## 工作流
+
+1. 读取需求、`.craftkit/project.json`、依赖和锁文件、适用规范及相关页面，确认框架与精确版本。
+2. 按 [页面规划](references/pages.md) 明确场景、页面、路由、复用和状态边界。
+3. 按 [数据设计](references/data.md) 设计视图模型、状态所有权、加载与提交转换、错误和权限呈现。
+4. 组件、样式和表单结构分别复用 `component`、`style`、`form` 的证据与结论；本 Skill 负责页面级组合。
+5. API 契约需要映射时交由 `prepare-api`，并在设计中记录所需接口、字段和未决项。
+6. 按 [设计输出](references/output.md) 展示方案和风险；用户要求落盘时，先确认项目约定路径。
+
+## 边界
+
+- 不从接口字段描述反向改写已确认的用户文案和交互含义。
+- 不编造组件、属性、事件、接口或业务校验；缺少证据时列为待确认。
+- Vue、React 或其他框架的版本差异由当前项目证据决定，不跨版本混用。
+- 未执行真实渲染、浏览器或辅助技术检查时，不宣称交互验收通过。

plugins/dev/skills/design-frontend/agents/openai.yaml

@@ -0,0 +1,4 @@
+interface:
+  display_name: "前端设计"
+  short_description: "设计页面、交互、状态和组件组合"
+  default_prompt: "使用 $design-frontend 为当前需求制定前端页面设计。"

plugins/dev/skills/design-frontend/references/data.md

@@ -0,0 +1,8 @@
+# 前端数据设计
+
+- 区分服务端数据、页面状态、组件局部状态和可派生状态。
+- 记录初始化、查询、编辑、提交和回显所需的双向转换。
+- 明确加载、空、错误、无权限、部分成功和并发更新状态。
+- 字段含义、必填和条件显示来自需求或契约，不从控件类型推断。
+- 标记大整数、金额、日期、枚举、文件和嵌套对象等边界，但具体转换必须依据真实 API 契约。
+- API 缺失或字段无法对应时保留未匹配项，不用 Mock 假定正式接口。

plugins/dev/skills/design-frontend/references/output.md

@@ -0,0 +1,13 @@
+# 前端设计输出
+
+按任务需要包含：
+
+1. 目标、用户场景、现状证据和范围外事项。
+2. 页面清单、路由、入口、复用关系和主要交互流程。
+3. 页面结构、组件组合及其证据来源。
+4. 状态所有权、视图模型、校验来源和数据转换。
+5. API 需求、字段需求及与 `prepare-api` 的待映射项。
+6. 响应式、可访问性、权限、错误和加载状态。
+7. 版本约束、备选方案、待确认问题、验证和实现交接。
+
+设计规模应与变更复杂度相称，不为简单页面生成无用章节。

plugins/dev/skills/design-frontend/references/pages.md

@@ -0,0 +1,7 @@
+# 页面规划
+
+从用户任务出发识别页面、弹窗、嵌入区域和跨页面流程。每项说明入口、用户角色、主要动作、状态、退出方式和异常路径。
+
+评估新增、编辑、查看等场景是否真正共享结构与行为；只有差异可由清晰契约表达时才复用。路由、导航、缓存、返回行为和权限边界应与项目现有模式一致。
+
+组件抽取以稳定复用关系和清晰职责为依据，不用页面数量或代码行数作为唯一阈值。