
课程咨询: 400-996-5531 / 投诉建议: 400-111-8989
认真做教育 专心促就业
我们在前几期的文章中给大家简单介绍了ui设计师在设计图标的时候会用到的一些设计方法等内容,而本文我们就继续来了解一下,图标设计视觉统一注意事项。
我们通过图形、圆角、描边、色彩四个方向进行分析确定了合适产品策略的单个图标设计方案。接着就要从单个图标合并成“一组图标”。这一步骤中不仅仅要看单个图标的视觉统一。还要确保一组图标的整体视觉统一度。
1、单个图标的视觉调整
2、多个图标的视觉统一
a、运用图标盒子规范图标形状,达到多个图标视觉大小统一协调。
物理尺寸:在相同的宽高下,方形比圆形的面积多出四个角的区域。
视觉尺寸:宽和高尽管不同,但是方形和圆形多出的面积保持相似,确保了视觉平衡。
b、在一排图标中保证视觉动线水平
一排不规则的图标中,通过观察图标形状是上宽下窄还是上窄下宽。然后上下微调1-2px达到图形重心的统一确保整体图标视觉的平衡。
c、色彩在排版中同样影响图标重量
同样的图标形状,如果颜色不同,传递出的视觉重量也不同。
明度越高视觉重量越轻,明度越低视觉重量就越重。
视觉中要避免使用大量深色,会造成界面元素过脏。造成界面元素不平衡。
在同一位置,大小相同时,通过色彩凸显功能。如详情页的吸地按钮,通过色彩重量划分出强中弱三个层级。
d、图标的排列原则
当多个物体排列展示时,需要按照特定规则进行布局。
产品需要用户根据一排选项来做出决定时,我们就应该考虑希克定律。要把相关决定的选项数减到少,从而减少反应时间,降低犯错几率,提供使用效率。所以UI图标的排版中一排不超过5个。
通常产品中一组图标数量是3-5个不等。
图标样式不同,适用的排列方法也有所不同。边距删减法布局法用于形状规则的有背景底板的图标。占位等分法常用于不规则的无背景底板图标中。
一排图标小于60px的间距时容易使界面拥挤,压抑。所以在一排图标中,一般排列不超过5个图标间距不小于60px。留够足够的呼吸感,保持一个合理的空间布局。
【免责声明】本文系本网编辑部分转载,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责。如涉及作品内容、版权和其它问题,请在30日内与管理员联系,我们会予以更改或删除相关文章,以保证您的权益!更多内容请加danei0707学习了解。欢迎关注“达内在线”参与分销,赚更多好礼。