Bark:设计令牌与动效规范

Bark 是 Yumu 的视觉与动效单一真相,目标是让 macOS 与 Windows 两套原生界面看起来是同一个产品。

1. 目录

bark/
├── tokens/
│   ├── color.json       语义色:background、surface、accent、text、status,分 light/dark
│   ├── space.json       间距刻度 4、8、12、16、24、32、48
│   ├── radius.json      圆角 6、10、14、20
│   ├── type.json        字号与字重刻度,字体由平台决定
│   ├── elevation.json   阴影层级 flat、raised、overlay,分 light/dark
│   └── motion.json      时长与缓动曲线
├── i18n/                翻译源,见 i18n.md
├── codegen/             生成 Swift 与 C# 常量;Swift 侧产出 Bark.Space / Radius / Motion / Colors / Text
├── guidelines.md        界面规范:窗口结构、页面清单、渐进披露、组件、动效、文案、平台映射
└── preview/index.html   规范的可交互演示,浏览器直接打开

布局、组件、动效、文案的完整规范在 bark/guidelines.md,本文只管令牌本身。

2. 令牌原则

3. 动效

名称时长曲线用途
instant0—减弱动态效果时的替代
quick150 msease-out悬停、按下、开关
standard250 msspring(response 0.35, damping 0.85)列表增删、面板切换
emphasized400 msspring(response 0.5, damping 0.8)导入完成、启动成功等关键反馈

规则:

4. 布局原则(苹果风格)

5. 傻瓜式操作的具体要求

源文件 docs/coding-standards/bark.md 更新于 2026-10-08