造物云VI参考研究与采纳记录

研究日期：2026-10-20；对应发布V2.2。资料为当日官方文档与官方仓库读取，后续源可能变更。

结论

现有品牌有辨识度；当前缺口主要是不同场景如何表达同一品牌、图像证据如何选用，以及组件是否真的可执行。

不以引入更多渐变、阴影或框架作为升级目标；保留晶体、紫蓝、冷灰和已有字体。

参考逐项比较

Carbon · 排版模式

来源：https://www.carbondesignsystem.com/building-blocks/foundations/typography/overview

学习点：任务操作与品牌表达使用不同排版强度，按布局与任务选取。

造物云取舍：采纳分场景排版；保留Noto Sans SC与Space Grotesk，不迁入IBM Plex或Carbon依赖。

Spectrum · 颜色

来源：https://spectrum.adobe.com/page/color/

学习点：颜色承担层级、动作与状态；品牌色不等于所有控件颜色，按背景核验对比。

造物云取舍：扩充语义别名与实面；保留造物云品牌色，不复制Adobe色板。

Atlassian · 间距

来源：https://atlassian.design/foundations/spacing/

学习点：以有限间距令牌和布局原语约束重复决策。

造物云取舍：继续用已有4px刻度和布局类，不替换成另一套8px命名。

Atlassian · 插画

来源：https://atlassian.design/foundations/illustrations/

学习点：插画按语境分为单概念、简化UI、氛围纹理；视觉服务任务。

造物云取舍：区分真实产品截图与流程示意；营销可表达，操作界面克制，不复制其插画资产。

GOV.UK · 贡献标准

来源：https://design-system.service.gov.uk/community/contribution-criteria/

学习点：组件需要有用途证据，并验证可用性、一致性和适用范围。

造物云取舍：新增样式/契约/行为的成熟度记录；本次浏览器检查不冒充用户研究或全站认证。

Anthropic · frontend-design

来源：https://github.com/anthropics/skills/blob/main/skills/frontend-design/SKILL.md

学习点：设计从对象、用户和真实内容出发，先计划再审查，避免无理由套默认模板。

造物云取舍：采纳设计意图与复查；已有品牌优先，不按通用反模板建议删除品牌紫蓝或换字体。

Vercel · web-design-guidelines

来源：https://github.com/vercel-labs/agent-skills/blob/main/skills/web-design-guidelines/SKILL.md

学习点：逐项审查键盘、表单、状态、动效、图像与布局，并给出文件位置。

造物云取舍：将验收输出结构纳入skill；具体检查按本任务适用，不把所有英文文案规则移植中文品牌。

Vercel · DS到Agent skill

来源：https://github.com/vercel-labs/design-systems-to-agent-skills/blob/main/docs/output-structure.md

学习点：入口负责路由，详细组件和示例按任务读取，避免把全部规则一次塞入上下文。

造物云取舍：提供任务读取表与独立图像/模式参考；不复制大型生成流水线。

冲突与取舍

• 泛化的“拒绝紫色、拒绝胶囊或拒绝固定字体”不能覆盖既定品牌；先判断页面用途。
• “必须真实截图”和“产品内引导避免屏中屏”分场景处理：对外证明产品能力用真实截图；对内讲步骤可用明确标注的流程示意，不伪造成已实现功能。
• 外部系统的基础单位与命名不混进现有刻度；学习语义与治理，不复制两套相互竞争的令牌。
• 现有章节顺序保留；新增规则放对应章节，研究与版本信息归资源/页尾。

本轮已落实

• 品牌表达/产品操作/内容阅读三种可选模式，提供真实CSS与可切换排版材质演示。
• 语义令牌别名、稳定实面；保留原有变量和组件接口。
• 图标/流程示意/真实截图/氛围纹理的选择条件与来源标记。
• 组件成熟度表，明确哪些只有样式，哪些仍是行为契约。
• Agent按任务读取参考，交付需给位置、影响、验证与例外。

后续需单独完成

业务页迁移、真实导航/弹窗行为组件、用户可用性研究、字体资源托管优化及跨媒介印刷打样。本轮不把它们写成完成。