Photoshop制作精致大气的绿色网页按钮教程

2016-03-18 05:49 4 1 收藏

每个人都希望每天都是开心的,不要因为一些琐事扰乱了心情,闲暇的时间怎么打发,关注图老师可以让你学习更多的好东西,下面为大家推荐Photoshop制作精致大气的绿色网页按钮教程,赶紧看过来吧!

【 tulaoshi.com - PS 】

来源:站酷 作者:酷头儿
对于各界交互界面大师来说,按钮的制作无疑是不可缺少的一个组成部分,但是习惯于运用多个图层叠加出非常漂亮的效果的时候,修改极不方便。下面介绍如何用图形渐变及图层样式简化这些图层。
最终效果


1、新建大小自定的文档,背景填充青色。先用钢笔建立路径,如下图。

2、创建渐变调整图层,渐变颜色位置随意,如下图。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)
3、给当前图层添加图层样式,选择投影,效果如下图。

4、设置内阴影,这里省去了文字下方的投影部分,以内阴影代替(注意曲线与数据的变换),数据一定要调试之后再确定。

5、设置描边样式,描边中一定要主要渐变颜色。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)6、设置光泽:随意调整数据,直到自己满意为止。

7、设置内发光:这里的内发光代替TuLaoShi.com了内阴影,作为边缘与按钮本身分离的界限。

8、添加图案叠加,这里需要注意先预设好图案,这种条纹状的图案比较出效果,制作业相当简单。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)9、添加外发光,参数设置如下图。

10、用椭圆工具拉一个正圆,添加渐变叠加样式,参数设置如下图。

11、最后添加斜面与浮雕,参数设置如下图。

12、整体按钮的“分叉投影”,其实就是将按钮设定在一个组之下,给组一个羽化的三角遮罩,就成为类似分叉的投影了。

13、下面制作下一个图层的内容,左上角的斜标相对来说就简单的多了,步骤差不多,还是先建立路径,之后添加渐变调整图层。

14、填充渐变颜色是一定要根据图形的形状来添加,一次为例,渐变的样式应为菱形,如下图。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)15、添加投影,投影一定是与形状相符。

16、添加斜面和浮雕,这里需要注意的是纹理叠加。

17、添加内阴影增加立体效果。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/ps/)18、添加渐变叠加。

最后加上文字及其他素材,完成最终效果:

来源:https://www.tulaoshi.com/n/20160318/1873807.html

延伸阅读
标签: PS PS基础
先看效果图。 1、新建文档,尺寸自定,背景白色,建新层,画一黑色圆角矩形。 2、分别添加投影、描边这两个图层样式。 效果如下图所示。 3、创建一个新图层,使用圆角矩形工具制作一个小一点的白色矩形,你可以使用自由变换调整它的大小和位置,如图所示。 4、为白色的圆角矩形添加投影、内阴影、渐变叠加和描边这几...
透明物体是通过背景进行参照,体现出质感。而本例里是讲解白色透明背景,如果背景太亮,会导致对比不明显。 最终效果 1、打开下图所示的背景素材,选择菜单:滤镜 模糊 高斯模糊,数值稍微大一点,效果如下图。 2、把前景色设置为绿色,用圆角矩形工具拉一个合适的圆角矩形,然后选择钢笔工具,在属性栏选择“合并形状”,勾...
标签: PS PS基础
先看看效果图 打开photoshop,新建空白文档。 为了不让白色背景看起来乏味,增加一个渐变叠加效果。渐变颜色为# f3f3f3到# c6c6c6。 选择圆角矩形工具,创建按钮的的主要形状,半径为5 px。 添加渐变叠加图层样式。渐变颜色从#0d3079到#557bc9。 现在让按钮从背景中突显出来,添加1 px描边,颜色为深蓝色(#0b2258)。 ...
来源:PConline 作者:李华仁 水晶按钮是非常常用的,制作方法按个人操作也有一些区别。下面的教程是用图层样式来完成主体操作。制作的时候只需用选区工具做出想要的按钮形状,然后添加图层样式和高光即可。 最终效果 1、打开Adobe Photoshop,执行菜单:“文件”/“新建”(快捷键Ctrl+N),弹出新建对话框,设置名称:按钮,宽度:570像...
标签: PS PS基础
先看效果图。 新建文档500x300像素,背景黑色,新建图层,画一半径200的白色圆角矩形。 添加图层样式。 效果如下。 新建图层,再画一个小的白色圆角矩形,图层不透明度50%。 下面制作倒影,复制大的圆角矩形图层,新建图层1,然后合并2个图层得到图层1,ctrl+T垂直翻转挪到底部。 添加蒙版黑白直线渐变,图层不透...

经验教程

227

收藏

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