Photoshop绘制金属控件效果的网页图标

2016-02-16 02:21 18 1 收藏

今天图老师小编要跟大家分享Photoshop绘制金属控件效果的网页图标,精心挑选的过程简单易学,喜欢的朋友一起来学习吧!

【 tulaoshi.com - PS 】

先看看效果图

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

新建一个256 * 256像素文件,分辨率为300,如下图。

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

1、使用圆角矩形工具,设置半径值为60像素,按住Shift键绘制带有圆角的正方形,如下图。

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

2、为底层添加渐变样式,得到的效果如下图。

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

3、按Ctrl + J 复制底层得到副本,按Ctrl + T 对底部副本进行调整大小,并更改渐变方向,效果如下图。

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

4、继续按Ctrl + J 复制底层副本,得到副本2。并按Ctrl + T 进行变换处理,并为其更改渐变样式,如下图。

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

5、继续使用圆角矩形工具绘制,并为其添加图层样式,以制作类似下图所示的效果。

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

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

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

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

6、用同样的方法去复制,我们只需调整大小即可。再为其修改渐变样式,制作出如下图中的效果即可。颜色可以随自己喜好更改。

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

7、使用椭圆工具按住Shift键绘制正圆,并为其添加图层样式,制作金属按钮,效果如下图。

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

8、现在我们只需要对其进行复制并调整位置即可。

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

最终效果:

Photoshop绘制金属控件效果的网页图标,PS教程,图老师教程网

来源:http://www.tulaoshi.com/n/20160216/1566861.html

延伸阅读
标签: PS PS基础
1. 首先给大家看下整体效果。 2. 启动本教程你将需要创建一个新文件。使用任何你想要的值,但是我建议你创建一个文件的最小宽度为1100*1163像素。背景填充# 252118。 3. 原教材玩神秘没有写怎么做,我用我的方法做了一下,你可以复制一个刚刚做的图层,选择画笔工具,大小设成1100px,硬度0%。柔光,把这个图层透明度调到60%就ok了. ...
标签: PS PS基础
今天为大家带来一篇非常简单的iCloud图标的PS教程。这篇教程虽然简单,但是有很多细节,大家从中还可以学到非常常用的角度渐变和渐变描边的用法。 先看看效果图 第1步: 打开Photoshop,Ctrl+N新建文档,根据自己的情况来定义尺寸。 第2步: 选择圆角矩形工具,按住Shift键在画布上绘制出一个方形的圆角矩形,这里我将圆角半径设置...
标签: PS PS基础
效果图: 具体的制作步骤如下: 1,新建一个黑色500*500的图层,加入黑色,不要太黑 2.用形状工具,角度半径为30 3。建一个圆 4.加入描边渐变 5.中间也要一个圆,加内阴影。 6.还要一个圆,还要内阴影。 7.复制中间那个圆,缩小一点,把描边渐变改变一下。 8.新建一个圆 9.添加一个杂色 1...
标签: PS PS基础
本教程主要使用Photoshop绘制金属质感的分贝检测仪图标,重点依然是图层样式的运用,而且会多次用到布尔运算,这是PS课程中特别重要的一个知识点,不熟悉的同学建议来练个手。 先看看效果图 我们从背景的创建开始,我用的尺寸是1000*800像素。创建一个渐变填充调整层,设置如下: 画一个600*600像素的圆,设置填充为0,并添加一个斜面...
标签: PS PS教程
效果图为一枚写实图标。绘制之前需要对舞台灯的构造有深刻的认识;然后把它分解成不同的组件;再按照一定的顺序逐步刻画即可。 最终效果 1、确定图标大体的透视关系。 首先用简单的线条确定图标大体的空间位置关系,这种做法在美学上称为线透视,这是画图标的首要关键性步骤,它能帮助我们准确无误地画好一个立体的图标。 2、勾勒出图...

经验教程

215

收藏

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