ps基础教程之制作UI图标长投影效果

来源:设计前沿 作者:头条 爱设计的小白 时间:2017-07-30

长投影效果,在最近两年,流行热度一直不减,特别是在制作UI图标的过程中,效果使用尤其广泛。优雅,大方,轻质感,给扁平化设计中又增添了一分别样的情趣。下面先来看几个作品领略下长投影的魅力吧!

简单几步完成高大上的长投影效果,一学就会

简单几步完成高大上的长投影效果,一学就会

简单几步完成高大上的长投影效果,一学就会

怎么样,效果是不是看起来很赞,虽然是扁平化效果,但是显得质感十足,其实这种高大上的效果,制作起来却相对没那么复杂,下面就给大家分享一种最简单的方法,让你一分钟学会这个小技巧。

首先我们打开ps,新建一个文档,填充个渐变色,为了突出中间将来要做的图标,我用了一个径向渐变,从中间向四周来做渐变。

简单几步完成高大上的长投影效果,一学就会

接下来,我们选择形状工具画两个正圆出来,大圆的填充颜色选的比背景淡一点,小圆的填充颜色选的比背景稍微深一点,描边都选择无。

简单几步完成高大上的长投影效果,一学就会

接下来,我们用形状工具里面最下面的自定义形状,找到里面的心形形状,在图形中画个心出来,然后不要描边,填充个更鲜艳的颜色,这样的话,整个图标我们就简单做出来效果了。

简单几步完成高大上的长投影效果,一学就会

简单几步完成高大上的长投影效果,一学就会

简单几步完成高大上的长投影效果,一学就会

接下来咱们开始长投影的制作,咱么首先选中最外面的圆圈图层,之后ctrl+j复制一层,然后ctrl+t调出变换框,按下键盘上的方向键向下一下,向右一下,之后我们按下enter键确认变换。然后我们开始不停地按ctrl+alt+shift+t组合键,我们会看到圆形在不停地进行向右向下的复制变换(第一步中键盘向下向右的操作,决定了投影的方向),直到我们觉得投影的距离差不多了,就可以停止了,之后我们把除了本体之外的所有复制的图层,合并起来。

简单几步完成高大上的长投影效果,一学就会

简单几步完成高大上的长投影效果,一学就会

简单几步完成高大上的长投影效果,一学就会

接下来我们把刚合并的那个图层的填充改为0,然后添加一个图层样式,选择渐变叠加,混合模式用正片叠底,渐变模式选择线性模式,从纯色到透明,选择一个比背景色深的颜色作为阴影色,方向选择-45度(这个方向取决于你做的投影的方向)。如果颜色过深的话,还可以适当改下整体投影层的透明度。之后我们把阴影放在本体的下面。

简单几步完成高大上的长投影效果,一学就会

简单几步完成高大上的长投影效果,一学就会

简单几步完成高大上的长投影效果,一学就会

怎么样,效果出来了吧,接下来同样道理,我们给内圈还有心形也做一下投影效果,注意越靠内的图层,阴影要比外面的深一点。

简单几步完成高大上的长投影效果,一学就会

最后我们加一点细节,我们把所有除背景外所有的图层选中,ctrl+G编个组,接着我们用选区工具选择图标的一半,然后新建个图层,填充白色,图层叠加模式为柔光,给图标一些细节效果。然后给整个组添加一下剪贴蒙版,把效果只应用到图标上,适当调节下透明度,最终效果就完工了。

简单几步完成高大上的长投影效果,一学就会

简单几步完成高大上的长投影效果,一学就会

简单几步完成高大上的长投影效果,一学就会

简单几步完成高大上的长投影效果,一学就会

简单几步完成高大上的长投影效果,一学就会

喜欢的话,还可以再来几个字,同样使用长投影效果,这个看个人喜好了。怎么样是不是很简单呢?喜欢的话,快快回去尝试一下吧!

简单几步完成高大上的长投影效果,一学就会

设计前沿网,每日分享设计方面的一些实用小技巧,希望与大家一同进步,共同成长,喜欢的请关注我哦!