Photoshop制作高光胶囊效果的网页按钮

2016-02-16 06:54 17 1 收藏

人生本是一个不断学习的过程,在这个过程中,图老师就是你们的好帮手,下面分享的Photoshop制作高光胶囊效果的网页按钮懂PS的网友们快点来了解吧!

【 tulaoshi.com - PS 】

先看效果图。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

新建文档1280x1024像素,背景白色,建新层填充黑色,添加图层样式。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

效果如下。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

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

建新层,画一个白色圆角矩形。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

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

添加图层样式。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

效果如下。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

建新层,画一个小的圆角矩形,颜色#f7bdd6。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

高斯模糊一下。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

添加外发光样式。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

不透明度改为80%,效果如下。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

建新层,同样方法作出下图所示的白色高光,不透明度80%左右。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

建新层,画一个小的白色圆角矩形。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

添加图层样式。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

效果如下。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

合并除背景外所有层,复制一个挪到底部,ctrl+T垂直翻转,高斯模糊一下,然后添加黑色文字,效果如下。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

复制几个,改变颜色,其它效果。

Photoshop制作高光胶囊效果的网页按钮,PS教程,图老师教程网

来源:https://www.tulaoshi.com/n/20160216/1569410.html

延伸阅读
标签: PS PS基础 PS效果
本教程主要介绍常用按钮的制作方法。思路:先绘制好按钮的形状,然后适当的把按钮的下面及上面都加上光感,高光部分的制作比较重要,需要根据实际的颜色选择不同的高光效果。 最终效果 1.新建一个500 * 350像素的文件,背景填充为黑色,前景颜色设置为:#570202,选择圆角矩形工具,参数设置如图1,绘制图2所示的圆角矩形。 图1 ...
来源:站酷 作者:DCTXF 教程虽然没有详细介绍按钮如何制作,不过作者在这里分享了很多按钮制作的经验,先从一些简单的效果入手,多尝试,多运用图层样式等,就可以做出自己想要的效果。 最终效果 1、按钮的形状 我个人认图老师为按钮无非就这几种基本形状,请不要做太多奇形怪状,不要忘记按钮本身的作用“吸引用户点击”。 2、颜色 设...
标签: PS PS基础
先看效果图。 新建文档1280x1024像素,背景白色,建新层画一个黑色正圆。 复制一层,颜色改为深灰,稍微缩小一点点。 添加图层样式。 效果如下。 复制一层,清除图层样式,颜色白色,缩小一些,位置如下。 添加图层样式。 效果如下。 建新层,画一个小的黑色正圆,中心对齐。 建新层,画一个小的白...
标签: PS PS基础
先看效果图。 新建文档820x680像素,背景黑色,建新层,画一白色正圆。 添加图层样式。 效果如下。 建新层,画一白色椭圆。 添加蒙版,黑白直线渐变,图层模式叠加,不透明度77%。 建新层,画如下白色圆角矩形。 Ctrl+T变形如下。 同样方法画出其它形状。 复制这3层,颜色改为#fb7009。并置于原图层底部...
先看效果图 新建文档600x600像素,背景白色,新建图层填充黑色,添加直线渐变样式,效果如下。 新建图层画一黑色正圆。 添加图层样式。 效果如下。 复制一层,清除图层样式,将此层缩小。 再复制一层,颜色改为白色,稍微缩小一点点,不透明度改为10%。 复制这个白色层,添加蒙版黑白斜线渐变。 不透明度...

经验教程

936

收藏

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