作为UI设计师，我们无法避免的跟icon打交道，它不但更有利于我们设计表达各个功能点，而且在有些页面中页占据着非常重要的篇幅。但是实际工作中，当设计人手缺乏，项目节奏过快的时候，我们不得不从网上下载一些图标素材进行快速输出。
当我们打开APP的时候甚至会发现里面的icon有虚边、图标尺寸过大或过小、图标大小不统一的现象。相信这是我们每位设计者都不想看到这样尴尬的情形。为了让我们的设计更有理有据，避免被业内人事批判，哪怕项目再紧，我们在快速输出之前都要先考虑我们的图标的风格的定位，制定统一的标准规范。那么我们就需要掌握以下基本的图标绘制原则：
图标绘制基本规则
首先整个图标虚边这种情况是绝对避免的，最基本的问题这里就不多说了。
图标的粗细和对应尺寸效果
下面我们来说下图标绘制特殊情况下的虚边问题：
通常我们在绘制成套的图标的时候不可避免的会出现上图这种图标中线，我们会发现哎呀虚边了，怎么搞？
当我们图标尺寸为奇数，线条为偶数的时候中线显示虚边。同样图标尺寸为偶数，粗细为奇数的时候也显示虚边。那么怎么绝对避免虚边呢？
当图标尺寸为奇数的时候，图标粗细也要为奇数。同理图标尺寸为偶数的时候，图标粗细也要为偶数。
尽可能不要混合使用奇数和偶数尺寸（如果你不混合会抓狂，那么也确保不同轴使用不同粗细的线条）
图标绘制的尺寸统一
图标避免过大和过小，同样在一系列图标中由于图标所表达的内容不同，各种不同的样式会造成视觉大小的差异性。那么我们是凭感觉调整大小么？你确定你一定是像素眼？
我们可以看到上图，人类在认识图形的过程中，会产生各式各样的视觉错觉。莱尔和艾宾浩斯错觉中，实际上两条线的长度是相等的，两个圆的大小也是相同的。厄任斯坦错觉：中间矩形和内部顶边的圆，它们的高度是相等的，但视觉上矩形比圆形要大很多。
那么我们首先绘制一个32x32的网格，用一个 2px边界 来留出喘息的空间。外面的这个蓝色区域除非特殊情况，通常避免图标出现在这个区域。
当我们要统一圆形和方形图标的视觉差的时候，就需要相对调整矩形的大小。在保证图标都在蓝色区域内部的同时，矩形要相对缩小2px，也就是黄色区域内。
如果图标是不规则图形，以圆形为轴心只需要保证图形在纵向或者横向的蓝色安全区域内即可。
同理对角图标的安全区域旋转45度即可。蓝色区域超出出血区域也没有关系，通常对角图标不会出血。
但不必每次都遵循网格和参考线. 网格在这里的作用是为了帮助你让图标保持一致性, 但是如果要设计一个特殊个性的图标，规则只是规则，没有什么不能打破的。
有人或许会问，斜角图标回不去出现不是45度的情况呢？在这里建议不管是整体还是局部最好都遵循45度或者45度的倍数的倾斜角度。由于像素的原因，45°角的情况下是抗锯齿的，这个角度下会有一个完美的清晰的边缘线，我们把虚边情况降到最低，人眼看起来会更舒服。
下周我们会聊一聊icon设计风格变化规则，以及品牌概念的植入。敬请期待！
