diff --git a/.scd/plans/20261109-234554-d4-methodology-review/decisions.md b/.scd/plans/20261109-234554-d4-methodology-review/decisions.md new file mode 100644 index 0000000..10efdef --- /dev/null +++ b/.scd/plans/20261109-234554-d4-methodology-review/decisions.md @@ -0,0 +1,19 @@ +--- +status: approved +version: 1 +created_at: 2026-11-09T23:45:54+08:00 +updated_at: 2026-11-09T23:45:54+08:00 +recorded_timezone: Asia/Shanghai +--- + +# 决策与事件 + +- 事件ID：DEC-1 +- 类型：开工 +- 文件及文档版本：本目录四份 v1；依据 Issue #126 契约 + Initiative #122 图版本 2 确认 + 用户执行授权 +- 目标Git SHA：main @ 45b7644 +- 用户实际依据：Initiative 摘要"ok" + "全部完成 scdexcute" +- 任务或Issue范围：Issue #126 范围；NOTICES 追加 WDS 节 +- occurred_at：null +- recorded_at：2026-11-09T23:45:54+08:00 +- 未决选择：无 diff --git a/.scd/plans/20261109-234554-d4-methodology-review/implementation.md b/.scd/plans/20261109-234554-d4-methodology-review/implementation.md new file mode 100644 index 0000000..2c8770e --- /dev/null +++ b/.scd/plans/20261109-234554-d4-methodology-review/implementation.md @@ -0,0 +1,14 @@ +--- +status: approved +version: 1 +created_at: 2026-11-09T23:45:54+08:00 +updated_at: 2026-11-09T23:45:54+08:00 +recorded_timezone: Asia/Shanghai +--- + +1. 分支 delivery/126-design-methodology-review +2. 新建两参考（design-method ~70 行 / platform-principles ~60 行） +3. visual-quality.md 增"双视角自审"节（紧凑，共用方零破坏） +4. SKILL.md 一句挂接两参考 +5. NOTICES 追加 WDS 方法论来源节（改写非逐字） +6. 测试/隔离会话/PR/验收/合并/关单/图版本 6 diff --git a/.scd/plans/20261109-234554-d4-methodology-review/plan.md b/.scd/plans/20261109-234554-d4-methodology-review/plan.md new file mode 100644 index 0000000..5cc3433 --- /dev/null +++ b/.scd/plans/20261109-234554-d4-methodology-review/plan.md @@ -0,0 +1,13 @@ +--- +status: approved +version: 1 +created_at: 2026-11-09T23:45:54+08:00 +updated_at: 2026-11-09T23:45:54+08:00 +recorded_timezone: Asia/Shanghai +--- + +# 任务索引 + +- 任务与Issue：Delivery Issue #126（design-methodology-review），Initiative #122 图版本 5（依赖 #123/#124 已 DONE） +- 基线来源：main @ 45b7644 +- 批准与开工事件：decisions.md DEC-1 diff --git a/.scd/plans/20261109-234554-d4-methodology-review/requirements.md b/.scd/plans/20261109-234554-d4-methodology-review/requirements.md new file mode 100644 index 0000000..fa5ce4f --- /dev/null +++ b/.scd/plans/20261109-234554-d4-methodology-review/requirements.md @@ -0,0 +1,14 @@ +--- +status: approved +version: 1 +created_at: 2026-11-09T23:45:54+08:00 +updated_at: 2026-11-09T23:45:54+08:00 +recorded_timezone: Asia/Shanghai +--- + +# 需求（Issue #126 契约） + +- references/design-method.md：WDS 触发映射/场景/设计循环中文改写（适配两阶段保真度与既有确认机制，MIT 来源注明） +- references/platform-principles.md：自写 Web 平台设计原则（引用 Apple HIG/Material 官方出处，不复制原文），吸收 plugin87 accessibility 规则要点 +- visual-quality.md 自审并入双人格评审（规范审+工作室主审） +- A1 中文+内链+术语一致；A2 隔离会话双视角+方法论步骤；A3 八维/共用契约不破坏+全量测试绿 diff --git a/skills/scd-uiux/SKILL.md b/skills/scd-uiux/SKILL.md index ce062b2..44b20d3 100644 --- a/skills/scd-uiux/SKILL.md +++ b/skills/scd-uiux/SKILL.md @@ -50,7 +50,7 @@ description: "在生产实施前设计或完善 Web 产品的用户体验和界 ## 先建模行为，再打磨外观 -进行聚焦设计和产品体验工作时，阅读 `references/experience-contract.md`。构建已触发的体验部分： +进行聚焦设计和产品体验工作时，阅读 `references/experience-contract.md`；按[设计方法论](references/design-method.md)从触发组织切片并走设计循环，平台级交互与无障碍底线遵循[Web 平台设计原则](references/platform-principles.md)。构建已触发的体验部分： 1. 关键旅程及其成功或恢复路径； 2. 界面、导航和信息层级； diff --git a/skills/scd-uiux/data/THIRD-PARTY-NOTICES.md b/skills/scd-uiux/data/THIRD-PARTY-NOTICES.md index fd381cd..0dfbf71 100644 --- a/skills/scd-uiux/data/THIRD-PARTY-NOTICES.md +++ b/skills/scd-uiux/data/THIRD-PARTY-NOTICES.md @@ -21,3 +21,8 @@ - `vendor/design-systems/`：来自 plugin87/ux-ui-agent-skills（MIT License，，main 分支）design-systems/ 目录全量原样收录（2148 文件，约 31MB；设计系统实物参照语料） - `vendor/google-fonts.csv`、`vendor/google-font-licenses.json`、`vendor/phosphor-icons-upstream.json`：来自 nextlevelbuilder/ui-ux-pro-max-skill（MIT License，，main 分支）data/ 目录原样收录；Google Fonts 元数据及其许可声明、Phosphor Icons 上游数据随文件内附 - 改动：无（原样搬运） + +## 方法论与规则改写来源 + +- `references/design-method.md`：方法论框架改写自 bmad-code-org/bmad-method-wds-expansion（MIT License，Copyright (c) 2025 BMad Code, LLC，）的触发映射/场景/设计循环思想——**中文改写并适配本仓库治理，非逐字复制** +- `references/platform-principles.md`：本项目自写；方法灵感引用 Apple HIG 与 Material Design 官方公开指南（仅引用出处，不复制原文）；无障碍要点吸收自 plugin87/ux-ui-agent-skills（MIT）accessibility 规则的改写 diff --git a/skills/scd-uiux/references/design-method.md b/skills/scd-uiux/references/design-method.md new file mode 100644 index 0000000..bf7ebda --- /dev/null +++ b/skills/scd-uiux/references/design-method.md @@ -0,0 +1,33 @@ +# 设计方法论 + +聚焦设计与产品体验路径共用本参考。它把社区设计方法论（BMAD WDS，MIT；按本仓库治理改写，非逐字复制）适配为 thinloop 的工作方式：从触发出发组织设计，按循环推进，用设计日志留痕。旅程与状态的契约本体仍在[体验契约](experience-contract.md)，不在此复制。 + +## 触发映射：从触发出发，而不是从界面出发 + +设计切片从产品已确认行为出发，先列触发清单：用户在什么情境、什么信号驱使下进入这个体验，进入后第一个动作是什么。每个触发对应一条旅程与一个首要动作（对接体验契约的"关键旅程"）。没有触发的界面不值得设计——这正是"每个界面都因一项已说明需求而存在"的检查面。 + +## 场景驱动 + +把相近触发组成场景：参与者、目标、进入条件、成功路径与恢复路径各一句。场景决定低保真阶段要画哪些画面与状态；体验契约负责把场景落成状态转换与验收映射。 + +## 设计循环 + +按两阶段保真度（见[视觉证据](visual-evidence.md)）展开为循环，每步有明确产物： + +1. **讨论**：不画图。回答主操作是什么、窄屏隐藏什么、信任信号放哪（讨论解决硬问题，画图只是把已决结构可视化）。 +2. **规格**：UX 契约增量 + 工程衔接点。 +3. **低保真**：只决结构、层级、内容归属；快速迭代到用户确认——确认即冻结为参考。 +4. **规格同步**：线框变化回写契约，二者不得漂移；冲突保持 `draft`。 +5. **高保真与交接**：按[设计品味](design-taste.md)方向块与黑名单产出视觉稿，交 QuickDev 实施。 +6. **浏览器复核**：真实渲染、真实视口，按[页面视觉质量](visual-quality.md)八维与双视角自审。 +7. **沉淀**：循环中重复出现的模式提炼为语义令牌或组件规则（对照 `data/tokens/` 与 `data/components/`，只留增量）。 + +跳步规则：清晰局部变更可从第 5 步直接开始；0 到 1 重要页面不得跳过第 1–3 步。 + +## 设计日志 + +方向块确立后，每次方向或令牌决策的变化在 UX 契约"设计决策日志"栏记一行：日期、决策、原因或依据。日志解释演化，不替代契约；没有原因记录的翻案视为新决策重新确认。 + +## 与检索的关系 + +循环第 1、5 步需要外部参照时，先检索设计知识库（见 SKILL.md 查询契约），用命中条目支撑讨论与视觉稿，注明来源域。 diff --git a/skills/scd-uiux/references/platform-principles.md b/skills/scd-uiux/references/platform-principles.md new file mode 100644 index 0000000..4a87526 --- /dev/null +++ b/skills/scd-uiux/references/platform-principles.md @@ -0,0 +1,33 @@ +# Web 平台设计原则 + +聚焦设计与产品体验路径共用本参考。以下为面向 Web 的平台级设计原则，由本项目自写提炼，方法灵感来自公开官方指南（Apple Human Interface Guidelines：；Material Design：），**不复制其原文**。无障碍要点吸收自 plugin87/ux-ui-agent-skills（MIT）的 accessibility 规则。 + +## 交互与输入 + +- 触控目标至少 44×44px、相邻间距至少 8px；鼠标、触控、键盘三种输入都要可完成同一任务。 +- 焦点必须始终可见；键盘顺序与视觉顺序一致，模态可关闭、焦点可返回。 +- 表单尊重浏览器自动填充与原生校验语义；错误就地关联字段并说明恢复方法。 +- 惯性滚动、吸顶吸边等行为跟随平台惯例，不发明反直觉滚动。 + +## 主题与媒介 + +- 深色模式不是反色：表面层级与语义令牌切换（见[设计令牌](design-tokens.md)），每个状态两种模式都核对。 +- 字体栈尊重系统字体偏好；正文不小于 12px，行高约 1.5。 +- 动效遵守 `prefers-reduced-motion`；提供等价的非动效反馈路径。 + +## 无障碍底线（每项都可测试） + +- 正文对比 ≥4.5:1、大字 ≥3:1；状态与错误不只靠颜色传达（图标+文字）。 +- 图片有替代文本或等价含义；纯装饰对辅助技术隐藏。 +- 图标按钮必须有可访问名称；交互组件用语义元素构建，不用 `div` 仿造。 +- 信息结构用真实标题层级表达，不跳级。 + +## 平台一致性 + +- 同一产品内相同操作用相同模式（同一删除确认、同一空态表达）；跨页面术语不漂移。 +- 原生控件优先：能用平台既有控件表达的，不自绘替代品。 +- 响应式遵循[设计品味](design-taste.md)的移动优先基准，宽屏逐层叠加而非缩放。 + +## 使用方式 + +这些原则是检查面，与八维表（[页面视觉质量](visual-quality.md)）配合：八维按维度验收，本参考按平台惯例与无障碍底线验收。冲突时，可测试的无障碍要求优先于风格偏好。 diff --git a/skills/scd-uiux/references/visual-quality.md b/skills/scd-uiux/references/visual-quality.md index 6004a4e..3d9b0c0 100644 --- a/skills/scd-uiux/references/visual-quality.md +++ b/skills/scd-uiux/references/visual-quality.md @@ -33,6 +33,15 @@ UIUX 设计、QuickDev 的真实页面差异及 `scd-ui-polish` 共用本参考 八维都要考虑；未触发维度记录 `N/A` 和具体原因。无视觉变更或无关区域不得借此扩展修改范围。生成侧完整禁令以[设计品味](design-taste.md)的反模式黑名单为准；黑名单命中计入对应维度 `FAIL`，不以风格偏好辩解。 +## 双视角自审 + +八维证据齐备后，再做一次整体判断，两个视角各出一句结论并写入轮次记录： + +- **规范审**：可用性、一致性、无障碍与状态完备是否有证据缺口——缺角按对应维度 `FAIL` 处理（无障碍底线见[Web 平台设计原则](platform-principles.md)）。 +- **工作室主审**：这个界面有没有一个观点？哪个要素在领导？是否像模板产物？（对照[设计品味](design-taste.md)黑名单与辨识度维度。） + +主审意见不强制修改，但必须记录"接受/拒绝+理由"；只报八维不报双视角的自审不完整。 + ## 有限自审与修正 设计产物和真实页面均至少完成两轮实际检查；检查不要求每轮都产生代码改动： diff --git a/tests/chinese-skill-payload.test.mjs b/tests/chinese-skill-payload.test.mjs index 5e7a2c5..a5fcb9d 100644 --- a/tests/chinese-skill-payload.test.mjs +++ b/tests/chinese-skill-payload.test.mjs @@ -33,7 +33,7 @@ test("全部 Thinloop Skill 文本载荷均包含中文", () => { .flatMap((entry) => collectPayloadFiles(path.join(skillsRoot, entry.name))) .sort(); - assert.equal(files.length, 79); // Adds shared design-taste and design-token references. + assert.equal(files.length, 81); // Adds design-method and platform-principles references. for (const file of files) { assert.match(read(file), han, file); }