4.2 KiB
4.2 KiB
宠小它 — Logo 与品牌识别说明(设计 Brief)
角色:供 设计师定稿 与 研发切图 使用;本文为产品侧能交付的完整度。
关联:品牌名与 Slogan 见《产品设计文档》v1.9、《品牌替换清单-宠小它.md》。
1. 品牌一句话
| 项 | 内容 |
|---|---|
| 名称 | 宠小它 |
| 主 Slogan | 用心宠小它,温暖伴一生 |
| 副 Slogan | 智慧宠物门店服务系统 |
| 调性关键词 | 温暖、可靠、偏年轻、不低幼;服务属性强于纯社交卖萌 |
2. Logo 形态建议(可并行出稿)
| 形态 | 用途 | 说明 |
|---|---|---|
| 图形标(Icon / 符号) | 小程序图标、推送小图、Tab 角标、水印 | 需 16~24px 仍可辨认,避免细线、过多细节 |
| 字标(Wordmark) | 报告页顶栏、海报、公众号头图 | 「宠小它」三字,字重与字距需单独调;可加英文副标 ChongXiaoTa 可选 |
| 组合标 | 开屏、门店物料、官网 | 图形 + 字标左右或上下组合;规定 安全区与最小宽度 |
方向 A(推荐优先试稿):抽象小生灵轮廓(猫/狗合一的极简形)+ 柔和负形或一笔曲线(暗示「陪伴」),避免写实照片风。
方向 B:字母/笔画几何化——「小」字一点或「它」的偏旁做记忆点(需避免与现有字体库撞车,宜定制字标)。
方向 C 慎用:单独 爪印/狗骨头——易同质化,若采用需与图形强组合或定制变形。
3. 色彩(与现有产品对齐)
当前前端主品牌色(见 global.css):
| 用途 | 色值 | 说明 |
|---|---|---|
| 主绿(首选) | #2db96d |
--c-brand,用于 Logo 主形、主按钮联想 |
| 深绿(强调) | #1e9a55 |
--c-brand-dark,描边、深色底反白时辅助 |
| 浅绿(背景) | #eaf8f0 |
--c-brand-light,卡片底、浅色水印 |
扩展(可选,设计师定):暖色点缀 琥珀/橙 #f5913e(与现有 --c-orange 一致)仅用于 活动/促销子品牌,主 Logo 默认不用橙色,避免识别分裂。
反白稿:需提供 纯白 Logo + 透明底 用于绿底/深色图;单色黑 用于传真/黑白印刷。
4. 安全区与最小尺寸(验收用)
- 安全区:Logo 完整外接矩形四周预留 ≥ 0.5× Logo 高度 的留白(组合标以整块外轮廓计)。
- 数字端最小高度:字标/组合标 ≥ 16px(逻辑像素);纯图形标 ≥ 24×24(小程序 Tab 常见)。
- 禁止:拉伸变形、改色为未定义色、加投影/描边破坏统一规范(营销特例需单独规范)。
5. 错误使用示例(给设计与市场对照)
- 把 Logo 压在 高杂讯照片 上且未加底托;
- 同时使用未定义的第三色与强渐变;
- 与竞品 同构图 的爪印/骨头 无差异;
- 在 过小区域 使用完整组合标导致字糊成一团——应改用 纯图形标。
6. 交付物清单(建议设计师输出)
| 交付物 | 规格 | 用途 |
|---|---|---|
| 矢量源文件 | AI / SVG | 研发与延展 |
| 小程序 AppIcon | 1024×1024 PNG,圆角由平台裁切 | 微信提审 |
| 多倍率 PNG | @2x @3x,透明底 | 小程序内嵌 |
| 字标横排/竖排 | SVG + PNG | 报告、海报 |
| 单色稿 | 黑 / 白 | 印刷、水印 |
| 一页 PDF 简版规范 | 色值、最小尺寸、错误示例 | 对外统一 |
7. 与工程衔接(研发)
- 替换
static/tab图标前,先替换设计稿,避免线上半新半旧。 - 小程序 navigationBar 与 分享卡片封面 若用 Logo,需各提供 反白/深色 两套或统一底色素材。
8. 概念草案图(AI 生成 · 非最终稿)
与本文件同目录:logo-concept-draft.png(仅 图形标方向 之一),为视觉参考,不替代设计师矢量定稿;商标、版权与是否采用以法务/设计确认为准。
修订:首版由产品侧起草;定稿后以设计团队输出为准并更新本文色值与路径。