Photoshop设计网页按钮_非常精致蓝色水晶按钮

2016-03-18 05:48 135 1 收藏

今天天气好晴朗处处好风光，好天气好开始，图老师又来和大家分享啦。下面给大家推荐Photoshop设计网页按钮_非常精致蓝色水晶按钮，希望大家看完后也有个好心情，快快行动吧！

【 tulaoshi.com - PS 】

来源：PConline 作者：李华仁
水晶按钮是非常常用的，制作方法按个人操作也有一些区别。下面的教程是用图层样式来完成主体操作。制作的时候只需用选区工具做出想要的按钮形状，然后添加图层样式和高光即可。
最终效果

1、打开Adobe Photoshop，执行菜单：“文件”／“新建”（快捷键Ctrl+N），弹出新建对话框，设置名称：按钮，宽度：570像素，高度：400像素，分辨率：72像素／英寸，颜色模式：RGB颜色、8位，背景内容：白色，设置完毕后单击确定按钮，如图1所示。

图1
2、在图层面板上单击创建新图层按钮，新建一个图层4，再工具箱选择圆角矩形工具，并按住键盘中Shift不放在工作区拖出一个圆角矩形，按键盘快捷键Ctrl+Enter转换为选区，设置前景色为蓝色，按键盘快捷键Ctrl+D取消选区，如图2所示。效果图如图3所示。

图2

图3

（本文来源于图老师网站，更多请访问http://www.tulaoshi.com/ps/）3、接着右击图层4，选择混合选项，进入到图层样式，分别勾选投影、外发光、内发光、斜面与浮雕、光泽、渐变叠加选项，设置图层样式各项的值，参考下面的设置值，然后点击确定按钮，如图4、5、6、7、8、9所示。效果图如图10所示。

图4

图6

图7

图8

图9

图10

（本文来源于图老师网站，更多请访问http://www.tulaoshi.com/ps/）4、选择图层4，复制一个图层4副本并给图层4副本添加蒙版，如图11所示。

图11
5、单击工具箱中的横排文字工具，输入school，然后在工具选项栏上设置字体参考图12，如图12所示。

图12
6、在图层控制面板新www.Tulaoshi.com建一个图层或者（按快捷键Shift+Ctrl+N），接着在工具箱中选择钢笔工具，在属性栏中设置钢笔为路径，接着再工作区绘制出一个不规则的形状，按键盘快捷键Ctrl+Enter转换为选区，设置前景色为白色，按键盘快捷键Ctrl+D取消选区，并设置不透明度为20%。如图13所示。调整后的效果图如图14所示

图13

图14

来源:http://www.tulaoshi.com/n/20160318/1873766.html

上一篇： Photoshop制作透明大气的导航按钮教程
下一篇： Photoshop设计清新绿色立体桔子按钮教程

看过《Photoshop设计网页按钮_非常精致蓝色水晶按钮》的人还看了以下文章更多>>

Photoshop设计网页游戏的颓废风格按钮教程

标签： PS PS基础 ps平面设计教程 ps去水印教程

Photoshop设计网页常见卷页按钮效果教程

标签： PS PS基础 ps平面设计教程 ps去水印教程

最终效果 1) 利用圆角矩形工具建立一条路径;使用转换点工具移动左上角路径节点,使其产生卷页的形状; 2) 用任意一种色彩填充工作路径;再复制下半部分;对其添加图层样式,如图所示. 3) 用任意一种色彩绘制一个圆角矩形;将其图www.tulaoshi.com层移至红色矩形之后;添加图层样式,如图所示. 4) 再新建一层,绘制圆色矩形,颜色为黑...

Photoshop制作简单的蓝色水晶按钮

标签： PS PS基础 ps平面设计教程 ps去水印教程

本教程介绍非常简单的水晶按钮的制作方法。制作的时候只要用圆角矩形拉出按钮的大www.tulaoshi.com小，然后加上图层样式和高光即可。教程只是个参考，其他形状的按钮制作方法类似。最终效果 1、新建一个大小自定的文件，选择圆角矩形工具，半径设置为15像素，前景颜色设置为蓝色，拉出一个圆角矩形，然后双击图层调出图层样式，参数设置如下...

Photoshop设计精致的红橙色水晶按钮效果教程

标签： PS PS基础 ps平面设计教程 ps去水印教程

来源：站酷作者：Linjiaboy 效果图看上去有点复杂，其实构成非常简单，由金属边框及中间水晶部分构成。制作之前可以先看一下作者的分解图，然后由底部开始慢慢制作即可。最终效果 1、制作之前先来拆分一下按钮，大致由一下几部分构成Tulaoshi.Com。 2、新建大小适当的文档，新建一个图层，用椭圆选框工具拉一个正圆选区，填充黑色，如...

Photoshop制作精致的黑光水晶导航按钮