品牌团队做完一套视觉系统，产品团队常遇到两个难题：完全不用，产品像通用模板；用得太多，按钮、状态和数据都被品牌色占据，操作反而混乱。
产品UI需要把品牌资产翻译成功能系统，而不是直接复制营销海报。
01 先区分品牌色与功能色
品牌色负责识别，功能色负责成功、警告、错误、信息和交互状态。两者可以有联系，但不能让同一种颜色同时表示品牌和错误。
通过语义令牌管理颜色，保证深浅模式、无障碍和状态一致。
02 把品牌放在高记忆、低干扰位置
启动、登录、空状态、关键成功、欢迎和品牌内容页适合较强表达；高密度表格、长表单和风险确认应优先清晰。
品牌感不需要每个角落都出现Logo。稳定的字体、图标、圆角、间距和语气更持续。
品牌资产进入UI的方式
| 资产 | 适合用在哪里 | 避免 |
|---|---|---|
| 颜色 | 重点CTA、导航识别、插画与关键状态 | 所有按钮和图表都用同一主色 |
| 字体 | 标题、数字、品牌内容，正文需可读 | 用展示字体承载长文本 |
| 图形系统 | 空状态、引导、背景和数据叙事 | 装饰覆盖操作和数据 |
| 影像/插画 | 欢迎、教育、内容和情绪时刻 | 每个页面都放大图占空间 |
| 动效 | 反馈、转场和品牌关键时刻 | 延迟任务、无法关闭的炫技 |
| 语气 | 按钮、提示、错误与帮助 | 营销口号出现在风险提示 |
03 字体和图标要兼顾系统效率
品牌字体若缺字、加载慢或授权范围有限，可以用于标题和营销触点，正文使用高可读系统或产品字体。
图标保持统一网格和语义，品牌化不应让常见操作变得陌生。
04 关键状态比首页更能体现品牌性格
错误时是冷冰冰地说“操作失败”，还是清楚解释并帮助恢复；成功时是否克制、是否提供下一步，这些都是品牌体验。
内容设计与视觉设计需要共同定义语气，不能由开发临时写文案。
05 营销站和产品要共享基础，但允许不同密度
官网可以有更大胆的版式和动效，产品界面需要高频、稳定和信息密度。两者通过色彩、字体、图形和语气关联，不必完全同构。
建立跨触点令牌和资产库，避免每个团队各做一套“品牌版本”。
06 用可用性测试检查品牌是否过度
观察用户是否能快速识别主操作、状态和风险，是否因装饰、颜色或动效分心。
测试也可以比较无Logo截图的识别度：如果仍能感到同一品牌，系统才真正建立起来。
常见问题
产品UI一定要使用品牌主色作为按钮色吗？
不一定。需要满足层级、状态和对比，品牌色不适合时可使用功能变体。
官网和APP必须使用同一套组件吗？
不必共用完整组件，但可共享令牌、品牌资产和内容原则。平台与任务密度不同。
品牌插画适合放在后台系统吗？
可以用于空状态、引导和关键提示，但不应占据高频工作空间。
产品字体可以直接用Logo字体吗？
通常不建议。Logo字形可能定制或不适合长文本，需另选可读、授权清楚的产品字体。
如何衡量产品里的品牌识别？
可做无Logo识别测试、品牌属性访谈，并同时检查任务效率和错误率，不能只看偏好。
链接复制成功
