Photoshop设计银色立体效果的APP图标教程

2016-02-15 21:29 92 1 收藏

清醒时做事,糊涂时读书,大怒时睡觉,无聊时关注图老师为大家准备的精彩内容。下面为大家推荐Photoshop设计银色立体效果的APP图标教程,无聊中的都看过来。

【 tulaoshi.com - PS 】

本教程主要使用Photoshop设计银色立体字效果的软件图标,银色的质感主要使用图层样式来表现,喜欢的朋友一起来学习吧。

教程源文件:银色质感的软件图标PSD源文件

临摹的成果:

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

下面,我们开始山寨之旅。 新建文档,我用的大小是2000*1500像素,设置背景色为# 101010

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

新建一层,设置前景色为白色,使用圆角柔边画笔,设置大小为1500像素,在画布中点一点,设置图层的不透明度为60%。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

下面,我们来做背景中那个圆形的图案,我这里是用一个无缝图案来完成的。新建一个40*40像素的文件,背景为透明,用椭圆工具画一个20*20像素的正圆,并让其水平居中,垂直居中。

以下截图为方便观看,是放大了1200%的截图。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

复制一层椭圆图层,执行滤镜其他位移,设置水平和垂直位移均为我们文档大小的一半。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

现在我们的效果应该是这样。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

下面,我们将自定图案预设。点击编辑自定图案

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

OK,现在回到我们那个图标的文档,在刚才那个白色画笔图层的顶层新建一层,执行编辑填充,选择我们刚才自定义的图案。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

为这个图案图层设置一个图层样式。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

设置完图层样式,我们完成了背景的创建,效果如下:

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

下面,我们开始图标部分的操作。 用圆角矩形工具,运用减去模式,画出如下的外框形状来。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

为这个外框添加一个图层样式。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

接下来,还是用圆角矩形工具,画出如下图中的红色的内框。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

为其添加一个图层样式。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

接下来,我们来做那个纹理效果,纹理的话网上估计大把,我也试着做了一下。新建一层,填充#333333,执行滤镜杂色添加杂色,设置数量为13%,高斯分布,勾选单色。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

执行滤镜滤镜库画笔描边阴影线,设置描边长度为38,锐化程度为3,强度为1。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

将这个纹理图层旋转45度,创建剪贴蒙版。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

复制一层内框图层,置于顶层,设置填充为0,添加一个图层样式,来模拟内部的阴影效果。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

用圆角矩形工具画出顶层的这个框来。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

为其添加一个图层样式。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

下面,我们为金属框添加一个拉丝效果。新建一层,填充#272727,执行滤镜杂色添加杂色,设置数量为20,高斯分布,勾选单色。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

执行滤镜模糊动感模糊,设置角度为0度,距离为200像素。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

选择顶框加外框的选区,为拉丝纹理添加一个图层蒙版,更改拉丝纹理图层混合模式为线性减淡(添加),不透明度为35%。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

拉丝效果不是很明显,复制一层拉丝图层,更改图层混合模式为柔光,不透明度为25%。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

放入我们的LOGO,设置填充为0,并为其添加一个图层样式。

这儿同学们放一个自己喜欢的图案/文字就好,比如优设LOGO神马的哈哈哈

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

OK,完成了LOGO的添加,我们最后来添加左右两侧的那两个线状的东西。设置前景色为#1f1f1f,画一个矩形。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

为这个矩形添加一个图层样式。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

复制一层矩形图层,清除掉图层模式,重新添加一个图层样式。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

现在效果如下,右边的线直接把左边的复制过去就行了。

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

大功告成

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

部分作业展示:

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

Photoshop设计银色立体效果的APP图标教程,PS教程,图老师教程网

来源:https://www.tulaoshi.com/n/20160215/1564162.html

延伸阅读
标签: PS PS基础
先看看效果图 1、首先我们来分解这个图标,观察其各个组成部分,然后我们分层制作。 2、接下来我们从最底层做起,首先新建画布,置入模糊背景素材。使用钢笔工具在画布上勾勒出一个心形形状,然后对其添加图层样式。 3、底层做好后,接下来我们制作搞怪。搞怪的制作非常简单,首先按住Ctrl键后点击心形图层会出现...
标签: PS PS基础
最终效果图: 首先,新建一个文档,我的是1024*1024。 在背景层上拉一个径向渐变,颜色如图所示~~ 新建一层,D键把前景背景改为默认,填充白色,选择滤镜-杂色-添加杂色,平均分布,数量50%,勾选淡色,如图所示 确定后把混合模式改为柔光,透明度30% 新建一个圆角矩形,如图所示,调整好圆角,填充颜色随便。Ctrl+a 选择...
标签: PS PS基础
本教程主要使用Photoshop鼠绘质感的立体APP图标教程,教程绘制出来的图标质感挺强,也很精细,很漂亮。推荐过来和大家起分享学习了,下面就让我我们一起来学习吧。 先来看看最终的效果图吧: 效果, 具体的绘制步骤如下: 1.新建文件。大小400*300,做球形渐变。 2.用圆角矩形工具画一个251*237的圆角矩形,这一边我用了一个图层合成...
标签: PS PS基础
首先给大家看看整体效果,1.新建文件。大小400*300,做球形渐变。 2.用圆角矩形工具画一个251*237的圆角矩形,这一边我用了一个图层合成的,下面有图层截图,做出有一些擦拭过的感觉就可以了 3.这一步用钢笔工具画出来一个平台,我的大体思路就是先勾出大体形状,整个平台分三部分,上面.下面.中间高光。对上下两个部分添加木纹...
标签: PS PS基础
本教程主要使用Photoshop设计蓝色立体效果的圆形图标,经常看到有人问这种圆型icon要怎么做,觉得很有趣稍微思考一下原理,做了个简易快速版本。 中间的渐层色 画一个圆,设图层样式,角度。 凹进去的部份 其实是用迭的,再画一个半圆,设内阴影。 中心 画一个圆,用图层样式设定,一层就能解决厚度和高光问题。 ...

经验教程

57

收藏

13
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部