一.引言

随着这两年sketch功能越来越强劲，Adobe独大的时代已经过去了。射鸡师们再也不用被臃肿的ps狂虐～还记得用ps作图忘保存的酸爽么？哈哈哈

言归正传，今天我们来讨论下用哪家的工具画图标最爽，以及怎么用最爽的方法应用到工作中～

本篇只是谈论方法论，如果有初级射鸡师想要实操教学，可以留言给我～

二.工具选择

首先先比较ps、ai这两款Adobe公司的王牌。ps现在在UI届不比当年了，原因就是丫的太强大了，所以很臃肿，所以带不动啊～org。所以ps就先不考虑了，除非你是骨灰级玩家。如果不加入特殊效果（比如滤镜之类的）只用形状和路径绘制的icon就选ai就够了。

再说下sketch这个黑马，虽然最近Adobe公司推出的XD也相当给力（抄袭sketch很多），但是不得不说XD在某些方面优化的确实不错，这个以后再说～sketch就是为UI设计量身定制的装备，功能是相当给力，不但在UI层面完爆ps，在交互上也有追赶axure的趋势。sketch也是矢量绘图，布尔运算和钢笔工具都很好用。我觉得最重要的一点就是sketch布尔运算之后也是可还原的，这点上可以说非常的方便。所以sketch画图标也是非常不错的。虽然在实操上面ai还是强些。

但是如果之前用AI的射鸡师们，我推荐还是用ai画图标，因为两款软件结合起来才是最酥服的姿势。

三.工作方法

这里就先以用AI画图标再导入sketch的方法来讲，如果有想学sketch里画图标的方法，可以留言说出问题，我再出教程～

1. 如何规范化图标?

看别人设计的icon为什么整齐划一，自己的图标却有大有小。

图标网格：图标的内容区域限定在活动区域的内部 。  

这里的规范尺寸是24*24的尺寸，icon线框一般为2px。

1.1在ai里我们需要先设置：

step1:打开“首选项”-“参考线和网络”

step2:点击视图，打开“对齐像素”“对齐网络”“对齐点”

1.2设置正确的安全边界：

右上正方形（长18px；宽18px）；左上圆形（直径20px）；

右下水平矩形（长20px；宽16px）；左下垂直矩形（长16px；宽20px）。

可参考最新Google设计规范。

我这里有sketch和ai的画好的规范源文件，可以留下邮箱，我发给你们～

1.3 怎么保证图标不出现虚边

icon的每个元素都保证是偶数（横、竖边的长度，间距），打开ai的像素模式也可以查看是否出现虚边。

角度保证45度角、22.5度、11.25等，因为这种角度像素锯齿分布是最均匀的。

2  在AI里进行图标绘制，注意线和颜色的统一。（这里就不详细说图标绘制过程了）

3  如何将图标导入sketch？

这里有两个方法：

一个是直接复制，但是在AI里必须保证icon的宽高为偶数且为整数。这样复制到sketch里才能保证不会出现半像素的情况且可以完全居中显示。

另一个方法是导出为svg格式，利用Sketch icons插件进行批量导入。

可参考：https://www.jianshu.com/p/99ab87f4d978

在sketch里记得规范化命名还有转为symbol噢，这样就可以复用了，切图出来也是规范的噢～～

这里有不理解的也可以留言，我再对应出教程。

总结：工具终归是工具，可以提升效率。重要的还是设计本身！