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

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


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

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

(3)牛刀小试一下:

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







,
27
Report
声明
37
Share
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
You may like
Log in
27Log in and synchronize recommended records
37Log in and add to My Favorites
评论Log in and comment your thoughts
分享Share






































