许多知名大品牌支付宝，谷歌，京东，网易云等等他们都有一套属于自己特有风格的系统图标。一般都是根据产品定位，同时集合当下主流的趋势去做图标风格定义，最终得出图标使用线的还是面的、还是卡通、色彩重叠或者还是弥撒渐变的？
图标风格定义三大原则：
A.符合产品调性
B.极致简约
C.符合流行趋势
今天我们通过实际案例讲解如何设计具有独特气质的系统图标风格。我们在同一套图标的基础上通过变换不同的设计手法来变化图标风格，真真的都是图标设计干货啊，废话不多说下边直接开始吧。
第一步：打开ps软件
第二步 图标网格：
新建一个800*800px的画布，按快捷键 Ctrl+” 键调出刚才设定的辅助线。现在每个方格是44*44px。
第三步：
设计我们自己的网格图标，并且注意每个部分之间的角度。一般都是15°，30°，45°，90°等依次类推，这样子可以使整个一套图标规范又好看。
其实，它俗称“美学统一”
图标最关键的在于视觉符号一致性，线条粗细一致，内外倒角一致，图标倾斜角度方向遵循一定的设计规则，使用几何造型并贴紧网格设计，保证在最小尺寸都清晰可见。
第四步：注意细节，我们首先设计一组“风格设计1 ”
首先我们先运用布尔运算做一个套方正的图标，线条为4px，图标边角都采用直角的设计方式，给人方正硬朗的感觉。我们把这个图标风格作为基础造型下边我们将在这个图标风格上进行不断地变化打造出各种不一样的设计风格。
第四步：接下来我们在第一组的基础上，调整设计出第二组“风格设计2”
我们在风格1的基础上优化尖角为圆角图标。圆角大小设计定为4px，瞬间图标的感觉就变得圆亲切了很多。这种风格也就是市面上最常用到的系统图标设计风格。
第五步：于是乎，铛铛~~~我们设计第三组“风格设计3”又诞生了。
在风格散的基础上我们加粗线条为3px的视觉风格，由于线条粗细的调整整套图标的感觉已经比较粗壮有力，给人非常可靠稳定的感觉。
第六步：于是我们继续在第三组的基础上继续添加元素~我们设计第三组“风格设计4”又诞生了。
当然我们也可以尝试在图标内部填充色块，并且给它一定的内部错位的设计营造高光的感觉。这种形式用于点击选中的效果非常好，闲鱼APP的菜单图标选中效果就采用了这样的设计风格。
图标演变过程是一个设计思考过程，我们可以通过不断的尝试，寻找一些创意点，今天我们选择一组图标进行实例演变，还有很多图标风格没有说到，我们也可以再去尝试挖掘更有创意的icon设计风格。以上就是今天讲解的内容，希望能对大家有所帮助。
制作实例教程非常的占用时间和精力，希望大家多多的点赞和评论互动，你们的热情就是我最大的动力。
网友评论