ICON制作如何保持一致性?
广州/设计爱好者/7年前/1388浏览
版权
ICON制作如何保持一致性?
主要针对图标视觉比重问题解决方案!
一、图标重要性
图标,在一个APP界面中占据的面积并不大,但是方寸之地却承担了APP大部分的引导入口,是UI设计中至关重要的一环。好的图标才能给界面更好的体验,以及符合客户的APP品牌要求。
设计一个图标不难,但是设计一套图标时难度升级,其中我们要注重的点在于:
大小统一
风格一致
留白一致
简洁明了
二、图标制作不一致?
首先我们来对基本图形的视觉比重有一个认知,比如我们在下面同样大小的背景下制作图标,如图:

分别画上正方形、圆形、三角形,如图:


结果如上,我们会发现正方形 > 圆形 > 三角形,造成这样的原因是由于留白不统一,也就是视觉比重不统一,进而造成统一大小背景却画出不一样大小的图标,你们这个问题该如何解决呢?
三、制作具有统一性的ICON
(1)以制作大小为128PX的图标为例,首先制作图标辅助图形,可以以1PX为单位的单元格(外正方形描边1PX,内外正方形四周距离1PX)、3PX为单位的单元格(外正方形描边3PX,内外正方形四周距离3PX)、或4PX单元格(外正方形描边4PX,内外正方形距离4PX),单元格像素越大,做出来的图标错落感会强些,单元格像素越小,图标更稳定些。如图所以进行制作:

(2)在辅助图形上应该遵行的规则如下:
正方形:边长为内部正方形的边长;
长方形:宽为内部正方形的边长,高为外部长方形的高;
圆形:直径为外部正方形的边;
多边形:抵外部正方形的边长;

(3)牛刀小试一下:

最后,利用这样的辅助图形制作出其他具有大小统一,风格一致的图标,如下(是不是很简单啊,简单就对了,赶紧也去试试吧)







,
27
举报
声明
38
分享
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
你可能喜欢
登录注册
27登录即可同步推荐记录哦
38登录即可加入我的收藏
评论登录即可评论想法
分享分享






































