用途
Brand Consistency 是一个动画与品牌一致性技能，适用于动画与品牌个性不匹配、感觉千篇一律，或与设计语言发生冲突的情况。其目标是用迪士尼动画原则，将动画风格与品牌识别对齐。
问题指标
当出现以下现象时可使用本技能：动画感觉“偏离品牌”；动效通用、放在任何产品上都成立；不同功能之间的动画风格不一致；动效与品牌语调冲突；用户无法辨认产品个性。
按原则诊断
- Appeal（吸引力）：问题为动画缺乏独特个性。修复方式是定义品牌动效属性：品牌是活泼的（弹跳缓动）、专业的（平滑、极简），还是充满活力的（快速、干脆）？
- Exaggeration（夸张）：问题为夸张程度与品牌不符。修复方式是让夸张匹配品牌个性：奢侈品等于克制，活泼等于弹跳，企业等于收敛。
- Timing（时序）：问题为速度与品牌能量不匹配。修复方式是：快速品牌 100-200ms，沉稳品牌 300-500ms，并定义时序刻度并统一使用。
- Squash and Stretch（挤压与拉伸）：问题为弹性效果与严肃品牌冲突。修复方式是：挤压与拉伸仅保留给活泼品牌，专业品牌使用缩放变换。
- Secondary Action（次要动作）：问题为细节没有强化品牌。修复方式是：次要动作应放大品牌个性。有趣的品牌可以有俏皮的涟漪，严肃的品牌使用细微淡入淡出。
快速修复
- 创建动效风格指南：记录缓动、时长、所使用的原则。
- 定义 3-5 个品牌动效关键词，如“迅捷、精准、自信”。
- 构建可复用的动画令牌：一致的时序与缓动变量。
- 审计现有动画：找出偏离项。
- 创建动画组件：通过代码强制一致性。
排查清单
- 能否用 3 个品牌词描述动画？
- 动效是否匹配品牌语调指南？
- 各功能的缓动曲线是否一致？
- 时序刻度是否有文档并被执行？
- 竞争对手是否会使用完全相同的动画？
- 动画是否感觉像同一个产品？
- 测试：去掉 UI 后展示动画，是否仍可识别为你的品牌？
- 与品牌/设计团队评审。
代码模式
:root {
/* Brand motion tokens */
--brand-ease-default: cubic-bezier(0.4, 0, 0.2, 1);
--brand-ease-enter: cubic-bezier(0, 0, 0.2, 1);
--brand-ease-exit: cubic-bezier(0.4, 0, 1, 1);
--brand-duration-fast: 150ms;
--brand-duration-normal: 250ms;
--brand-duration-slow: 400ms;
}
适用场景
适合产品动画设计评审、设计系统动效规范建设、品牌一致性维护，以及需要统一多功能的动效风格时使用。
限制
资料未提供收费、价格、平台支持范围等信息；本技能聚焦于动画风格与品牌一致性的诊断和修复，不涉及其他设计领域。