手机iCON图标绘制教程：精致APP图标设计的三要素
今天25学堂看到一位移动APP设计师milaky的图标设计教程《图标设计初阶要先型》。老谭同学感觉他分析的很有道理，故摘录了其中一部分来跟大家来说说。
我们今天跟大家聊的话题就是如何让我们的绘制的APP图标比较精致好看呢？
精致即精细极致。看似简单的图标其实并不是随便了事，但知道了下面的三个基本图标设计要素，你就可以完成一个合格的图标了。好的图标是谨慎认真的注重每一笔每一像素每一矢量锚点的，尽可能的往精美优雅的方向努力吧骚年~
好看并且精致的图标是我们这节课跟大家来学习的主题。那APP图标设计好看的三要素到底是什么呢？
第一要素：犀利清晰
需要锻炼厉害的眼睛，使出你的火眼金星捕捉每个像素之差，像素满格才能清晰的呈现，细分出来通常会遇到以下3种情况，这也是最影响图标基本质量的问题点。
1) 轮廓发虚
图标一定要用矢量绘制，但是新手很容易犯的第一个错误就是图标模糊的问题，也不清楚为何会这样。其实就是矢量边缘模糊产生的问题，也是个人绘制的不良习惯造成。避免这个问题，必须在100%画布上绘制图形，而且不能直接推动图标放大缩小，即使这样改变大小了也要放大画布调整路径的锚点，反复查看及校正是否对齐1px网格，而不是0.1~0.9px，正是不满1px格才会生产虚线。而圆形的绘制保证十字架4个边缘点对准就可以了。
2) 斜形发虚
斜线也是会有模糊与精致之分的，不仔细对比其实是比较难看到问题，可能很多人都会碰到图形进行倾斜效果时是有锯齿的，那就是角度的处理问题了，自己进行多角度对比下试试，会发现哪一个角度最清晰。也可以将图层进行双层叠加，会非常犀利哦~
3) 像素不够或多余
看下来都是像素发虚与清晰的原因都是一样的，下面这个例子是箭头在小尺寸情况下可点阵矢量像素绘制，如果是大尺寸（如上面最大的箭头示例）可以直接钢笔绘制。
总结一下上面的处理方法，坚持最少发虚原则：
第二要素： 比例协调
图形内部结构要注意元素构成之间的比例，有黄金比例分割也有感性的平衡方法。严谨的图标比例可参照苹果IOS图标规范案例，打好内部统一结构线进行图形绘制和比例分配。
(2.8来自苹果图标及来自Seevi Kargwal图例)
如果头眼昏花嫌麻烦，也可靠经验感觉快速完成一个具有平衡感的图标。
第三要素： 视差平衡
同一个尺寸规格，但根据不同形状的图标，会导致面积占比引起的视差大小不同，但要在参考尺寸范围内绘制进行调整。以下图标示例都是撑满方框边缘绘制，按道理这好像是准确的，但由于人的肉眼会有视差问题，所以做的设计就要暂时抛开科学，以人的真实情况去判断再调整。
看到这里，大家是不是明白如何去让我们的APP图标更加精致呢？如果你有所收获将是25学堂的荣幸。
这里的部分内容来自：https://www.ui.cn/project.php?id=26753 感谢作者的分享。
评论