扁平化图标阴影部分简单教学
前言: 前段时间笔者一哥们让我给他们的APP设计一个图标,笔者不假思索想到了目前十分流行的扁平化风格。于是便到谷歌上搜了一下:
可以看到大牛们设计的扁平化图标很多都有一个标志性的阴影部分,笔者认为这个阴影部分才是扁平化的精髓。
于是笔者开始动脑动手自己仿造设计了一下,最后笔者的哥们十分满意。
在此笔者把自己设计的阴影部分教给大家。
Step 1
打开你的Photoshop(没有具体的版本限制,很老的版本也可以实现,笔者使用的是CS6),分别新建背景和图标,背景部分可以使用一些渐变效果,让背景更有层次感:
Step 2
首先确定你的光源,笔者设计光源在左上角,所以阴影应该向右下角投射。然后新建一个图层,这里新建图层很重要,一定要把阴影独立画在一个图层上面,并且阴影图层要在图标图层之下,否则会覆盖住图标。之后用钢笔工具在图标的边角处划线(注意要符合实际情况,线最好要划长一点,方便后期裁剪):
Step 3
像这样,笔者已经将一个字母的阴影部分勾勒出来了。在这里钢笔工具一定要熟练,否则线条画不了。
Step 4
线条(专业的名称是:路径)划好之后,来到路径界面,按下Ctrl单击刚才划的路径。
当你使用了这个组合键之后,你会发现你划的路径已经转变为虚线框(专业名称:选区)。
Step 5
返回到图层界面,确定在阴影图层的前提下,填充刚才转换好的选区。笔者这里直接填充前景色(黑色),按下Alt+Del组合键。此时你的选区应该变为黑色了。
Step 6
在这样的基础上,把其他部分画完(PS:笔者后来把背景换成了橘黄色渐变)。
值得注意的是一些阴影的处理要符合光影常理,比如笔者这里T字母的左上角是这样画的:
好了,画完之后应该是这个样子:
是不是有点感觉了呢?但这还不是我们想要的,继续加工。
Step 7
选择你的阴影图层:
在透明度中设置合适的百分比:
笔者设置的是10%,可以按你的喜好设置啦~
Step 8
最后,把原图裁剪一下,做一下小修饰就OK啦,大功告成!