- 设计准则
- 设计风格
- 控件
- pile of React
- 组件规范
- 定制主题
- 多语言
- components 组件
- score
- Anime
- picker
- dialog
- slider
- Form 表单
- fragment
文章来源于网络收集而来,版权归原创者所有,如有侵权请及时联系!
Icon 图标
图标定义
图标是具有明确指代含义的计算机图形。其中桌面图标是软件标识,界面中的图标是功能标识。它源自于生活中的各种图形标识,是计算机应用图形化的重要组成部分。
- 命名
- 图标遵循统一命名规则,即 类型_位置_名称
- 例:ico_nav_time
- 适用范围
- 内容表意单一,且需要被强调/区分/解释/缩略
- 使用限制
- 保持简洁:减少复杂元素的出现。可用圆、矩形等基础元素进行绘制
- 品牌个性:准确直观的表达品牌设计理念和表意
- 应用发展:具备识别性、统一性、扩展性
- 创造喜悦:对图形的定义附有创意,能够感知到设计细节
- 比例
- 关键形状是网格的基础。通过使用这些核心形状为指导,你可以保持整个相关产品的图标一致的视觉比例
- 尺寸
- 系统图标以16px为基础。当创建图标时,按100% 比例来设计,精确到像素
- 图标的大小应保持在有效区域内。如果需要额外的视觉考量也应不越过修剪区域
- 边角
- 一致的圆角半径是一套系统图标的关键。结合滴滴品牌和logo特性,以0px和1px圆角的组合,图形上半部分统一使用0px圆角,图形下半部分统一使用1px圆角
- 线的粗细统一为1px。分割区域不做圆角修饰,封闭图形须有切口,切口宽度统一为2px,切口角度为垂直90°或者倾斜45°,在遵守设计原则的基础上,以视觉的最优化微调设计原则
- 调和
- 一致性有助于用户加强对品牌的印象
- 调和
- 有新增图标需求,首先寻找常用图标集中是否已存在
- 图标新增,按流程进行
- 严格执行图标绘制方法
- 如遇紧急情况,来不急提交评审流程,可先行使用,后续评审并替换为评审后的内容
- 评审人:李海威、韩少鹏
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论