图标
图标是为用户提供信息指引的特定图形。Zepp OS 提供多种类型的图标元素,以适合不同场景下的应用。本规范列出了使用场景、图标构成、图形造型、图标尺寸、资源输出等规则,以指导图标元素的使用。
设计原则
Zepp OS 的图标遵循「轻量」与「友好」的设计理念。在造型上使用简洁的几何构形,精简冗余细节,保证识别度,清晰明确地传达其含义;在细节上避免锐利边角,通过连续曲率的线条传达自然美感。
图标类型
- 应用程序图标
- 通用功能图标
- 按钮图标
应用程序图标
应用程序图标应清晰明确地传达其功能/品牌/服务信息,设计风格应跟随 Zepp OS 的系统应用图标,并按照规范要求提供多个尺寸资源,以适合设备端、手机端应用程序商店等不同使用场景。
- 应用程序图标整体为正圆形,尺寸为 248×248px,内部需预留空白透明的安全区域(上下左右各 4px)。
① 应用图标内容尺寸
② 透明安全区域
③ 应用图标最终尺寸
- 图标的主体内容大小不要超出圆形背板区域。
① 主体内容大小不要超出背板区域
- 图标应避免使用纯黑色背板,避免包含透明区域或透明度。
① 不要使用纯黑色背板
② 背板区域不要包含透明区域
③ 不要包含透明度
- 不要使用非圆形的背板。
① 不要使用非圆形的背板
- 图标资源应输出包含空白透明安全区域的PNG格式图片。
① 背板四周应添加空白透明的安全区域
② 背板应该为圆形,避免使用其他形状
③ 非图标区域应保持空白透明
- 设计示例
① 图标内容尺寸240×240px
② 四周各4px空白透明的安全区域
③ 应用图标最终尺寸248×248px
- 实际使用效果示例