header_v0.7.32

用ps制作萌萌哒橡皮泥质感主题图标

234天前发布

原创文章 / UI / 教程
雨情斯基 原创,如需商业用途或转载请与雨情斯基联系,谢谢配合。

分享一篇用ps制作的橡皮泥质感主题图标的制作方法,效果的链接给你们http://www.zcool.com.cn/work/ZMjA3MDcyOTY=.html

在写这篇文章的前一天晚上,也就是昨天居然有点失眠,毕竟第一次写zhuang文bi章还是有点兴奋的,我发布了那篇小怪兽主题之后,受到了很大的鼓励,有很多人居然说要临摹(大概十多个吧),我说你等着,我去出教程,出完了@你,不过我可能说谎了,我至今还不知道站酷怎么@人,能不能@人,不过即使是一个人要我出教程我也会出的,毕竟卖的这么便宜,不对,应该是毕竟我是个有求必应的人,好啦,言归正传,请擦亮你们水灵灵的大眼睛,跟着我踏上这段征途吧!!!



首先,打开ps,新建一个画布,这里特别说明一下,因为画布的大小和分别率对于之后做的效果的力度是有影响的,所以如果你所建的和我的这个不一样,你要自己根据视觉效果,稍微调整一下。

c7ff58ddca54a801219c77b6612f.jpg

我这次做的不是之前那些小怪兽的图标,为了写清楚过程,我又跑去做了一个音乐小框框,但是方法都是一样的。

4aed58ddccafa801219c770608c6.jpg

这次教程的重点是用ps做效果,所以前边创建图形的过程我就不赘述了,我使用ai制作的形状,当然这个用ps也是可以的,习惯问题,反正就是矩形工具和钢笔工具,做完了以后可以直接ctrl+c,ctrl+v到ps里边,选择形状图层就可以。

b02258ddcd9aa801219c77f2221e.jpg

之后全部复制完如下图所见,但是我要说明一下,因为我一边做一边改。。。。改图形,所以你看到下边不一样的时候不要打我,而且你一定要看完整篇文再开始制作,否则你看一步做一步,我改你也改,你做到后边生气了,想打死我,我告诉你你可是要负责任的。

c63558ddd289a801219c774274b6.jpg

颜色是图形直接填充的,接下来就是做质感了,这才是这篇文的重点。

81da58dde57ba801219c77180bd8.jpg

6d2758ddedbea801219c7773256c.jpg

双击该图层,会弹出图层样式,勾选斜面和浮雕接下来设置参数,然后勾选投影,同样设置参数,设置好了以后点击新建样式,这样这个参数就会保存下来,可以直接给其他的图层使用。

547b58ddedd6a801219c77772e9d.jpg

如上图所示,样式列表里的最后一个就是我刚刚设的,如果你样式窗口没找到,就去ps顶端窗口位置打开。

接下来,点击一下图层呈选中状态下,单击一下那个样式,就可以应用给该图层。这里需要注意的是,这个图层必须是形状图层,不能栅格化。形状图层是这样婶的。

50cd58ddeee8a801219c77e05a7c.jpg

把所有形状图层都弄一遍之后,基本上所有的部位都鼓了起来,但是因为刚刚设定的样式,亮面和暗面都是绿色的,现在需要逐个调整一下(不好意思,我那天做到这一步的时候突然有一分钟变成了傻子,忘了截图,你们自己弄完了就知道所有形状亮面和暗面都是绿色有多诡异)

然后呢,你挨个点进去改变一下斜面浮雕的颜色。例如下图:

f9c658ddfd8ca801219c770a3854.jpg

做完这步骤以后,我们得到了这样一张图,这时候离最终效果已经非常接近了。

ae4258de0202a801219c77a64f8c.jpg

下面就是一些高光、投影、反光的问题了。拿上边张嘴的那个玩意举例子。

44cd58de0241a801219c77565310.jpg

abda58de0261a801219c776af561.jpg

087f58de0288a801219c77f4490b.jpg

上面三张图是加高光的方法,先用钢笔画一个形状,填充白色,然后拿出木鼠大大的独门大法——羽化大法(找不到这工具的自己去窗口里打开,不知道木鼠大大的自己反思一下,然后打开这个链接去补课:http://www.zcool.com.cn.zcool.cn.zcool.cn/u/360000 ,再说一遍木鼠大大是我的男神)

调整羽化程度及透明度,让他的高光变得自然一点。同时加上阴影,阴影是个学问,我这里简单说几句,想完全摸透的去看木鼠大大免费的公开课,《关于影子的秘密》http://www.bilibili.com.zcool.cn.zcool.cn.zcool.cn.zcool.cn.zcool.cn/video/av5131546

624958de0329a801219c77556a89.jpg

238458de0342a801219c77082200.jpg

a64958de0353a801219c770b86fc.jpg

1d7958de038aa801219c77619e93.jpg

d8da58de03a7a801219c774eb4b8.jpg

做一下仔细的说明,因为大牙在圆柱进度条的上边,因此会给进度条一个投影,而圆柱又是有厚度的,所以大牙的阴影在白色进度条和黄色背景上是必然不一样的。

首先在进度条上一层用钢笔工具创建一个形状图层,接着按住alt键把鼠标放在两个图层中间,会出现一个奇怪的形状,点下去,上边的图层就嵌套进了下边的图层,下一步羽化、调整透明度会得到最后一张图,方法是这样的,但是我做的这个效果不是很明显,(反正后来给删了,这是后话,不要打我)诶,进度条怎么突然变成黄色了。。。。对不起。。。我那天做完了就觉得刚刚的颜色不好看,改了。原谅我这个善变的女纸。。。

这个时候给你们看一下以上全部处理完了的效果

3c4e58de03f8a801219c7730bc07.jpg

最后一步,做一下轻微的邻近色处理:

afc358de06dca801219c77c130d2.jpg

以这颗大牙为例子,挨着白色大牙的地方是绿色的背景,按照上边所述的方法,嵌套进来一块绿色,调节羽化和透明度,让他变得淡淡的。

d0ad58de07b7a801219c77b13fef.jpg

其他地方也这么处理就OK了,需要特别注意的是,这两颗大牙,现在是不过关的,我们要把它做的像从嘴里伸出来的一样,但是现在像贴上去的,这里告诉你们一个秘密,你们以为我的这个嘴是画了个形状吗,怎么可能,哈哈哈哈,当然是扣得洞了,要不你认为为什么嘴周会有体积呀。。。

45c758de0af3a801219c77ffbae2.jpg

人家是长成这样子的,对不起,我刚才傻了五分钟忘了说了,别打我,我很努力的。

好了,继续做从嘴里伸出来那段

92f958de0b1ca801219c7708761d.jpg


首先先给牙齿下边的洞洞做一个嘴巴给他的阴影,如上图做内发光,参数如上图所示。

接着再给牙齿一个暗面,如下图,画一个矩形,同样的嵌套、羽化、叠加、透明度,看上去像是嘴唇的影子一样。

78e458de0b40a801219c772dfcf8.jpg

要给你们看最终效果了,请擦亮你们水亮亮的大眼睛

ee0858de0b83a801219c77717cb1.jpg

至于装饰音符还是装饰小鸟,你们自己决定,但是方法是一样的。我可能写的不是很明确,对于不会用ps的人是有一定的难度的,但是对于老手,其实就是分享一下我的方式方法,如果有什么看不懂的地方,尽管在评论里问我,我会非常耐心的告诉你的,但是你不要骂我,因为我脾气不好,你要是骂我,我就打你。

下面是我用这个方法做的其他的,给你们看看。

955858de0d06a801219c77c54549.jpg

e81458de0e0aa801219c77bd82e2.jpg

当然这中间少不了木鼠大大的指点,谁让我是他的亲学生呢,作为一枚亲学生,我骚扰他从不含糊。

你们看到的粉色的音乐控件其实不是最初版本,因为中间还有这么个插曲。

722658de0ec7a801219c77f9f645.jpg

9ecd58de0ed4a801219c77197fa8.jpg

哦吼吼吼吼,我其实就是来炫耀,我是木鼠大大的亲学生这件事的。。。。

最后的最后,我再分享给你们一个经验,就是如果你们想在站酷上发文写教程。。。一定要同时建一个Word文档,边写边存,不要问我是怎么知道的,我会打你的。。。。

70
    意见反馈
    没有新消息
    密码登录
    短信登录
    微信二维码登录

    提示文案

    提示文案

    提示失败
    提示成功