当前位置：首页 > 窍门 > 科技数码

桌面图标设计—水晶按钮的制作技巧

来源： 最后更新：2022-03-22 19:12:39

The Beginning

　　我想大家对桌面图标设计一点都不会陌生，因为只要您用过电脑都应该知道。电脑就是用着一个个的图标设计来作为他的标记，来作为大家存储资料的一个识别。但是小编不知道大家是否知道水晶按钮是什么，是否知道水晶按钮的制作方法是什么样的。今天小编就想给大家介绍几种水晶按钮的制作方法，希望大家会喜欢。CWJ育儿早教网

　　CWJ育儿早教网

　　首先打开Photoshop，新建一个文件，选择：文件→新建菜单命令，会出现如图所示的对话框。由于按钮的制作尺寸不需要太大，这里预设的宽度和高度分别为271、46。单位选择为像素，分辨率设置为72像素/英寸，颜色模式为RGB，这也是网页的规定颜色模式。CWJ育儿早教网

　　CWJ育儿早教网

　　再按住矩形工具 下面的小三角形展开工具，选择“圆角矩形工具”，然后在 画布上画一个长110、宽32的圆角矩形，图像自动填充为前景色， 单击图层→图层样式，选择投影，再如图的对话框中拔不透明度设置为5%（根据个人喜爱），距离设置为2像素。改变设置所生成的效果，可以在右侧预览串口中看到效果。CWJ育儿早教网

　　CWJ育儿早教网

　　然后添加一个图层效果，单击“颜色叠加”，在“混合模式”中选择“颜色叠加”，根据个人喜好选取一个颜色（如R：255，G：0，B：51），单击确定，选择颜色后，把“不透明度”设置为57%。单击“内发光”，切换到相应的位置，选择一个内发光的颜色，与之前的“颜色叠加”操作一样，选择一个颜色（R：153，G：0，B：0），这是就出现了一个有边缘向内简便的效果。然后设置大小为10像素（改变这里的数值，就会改变由边缘向中心渐变效果的大小）。CWJ育儿早教网

　　CWJ育儿早教网

　　下面来叠加真正的渐变，这个样式会使按钮出现一个深度感。单击“渐变叠加”，切换到相应的位置。选择“反向”，“角度”设置为90度，不透明度设置为78%。现在方形有了一个自上而下、由深及浅的渐变效果。CWJ育儿早教网

　　CWJ育儿早教网

　　最后制作一个高亮反光。单击“斜面和浮雕”，切换到相对应的设置，改变设置选项——样式、深度、大小、软化，就会在方形上得到一个白色高光。为按钮添加文字，单击”文字“按钮，输入文字：唐人游”，字体根据个人喜欢，字号为18，文字距离为75，颜色为R：0，G：102，B：255。 用移动工具，把文字放在按钮的合适位置上。再给文字做点修饰，单击“图层样式”，选择“图层叠加”叠加一个白色（R：255，G：255，B：255）。然后单击“外发光”，给文字作一个发光效果。这样就完成了水晶按钮的制作。CWJ育儿早教网

　　CWJ育儿早教网

　　第二种： 1． 打开photoshop，在新建的画布上用形状画一个圆角矩形为了操作方便可可以将矩形栅格 化，并填充上您喜欢的颜色。CWJ育儿早教网

　　CWJ育儿早教网

　　2．按住”Ctrl“键单击圆角矩形所在的图层，获得选区。然后单击“选择?D?D>>修改?D?D>>收缩”在弹出的对话框中输入“2”（具体值可以根据需要来调整）。CWJ育儿早教网

　　CWJ育儿早教网

　　3．从“工具面板中选择“渐变工具”然后选择“透明渐变”并将渐变颜色调为白色。如图3所示。CWJ育儿早教网

　　CWJ育儿早教网

　　4．新建一个图层『名称为图层1』(这点很重要，方便以后得修改),然后用“透明渐变”工具拉个渐变，然后在新建一个图层2，拉个反相得渐变CWJ育儿早教网

　　CWJ育儿早教网

　　5．选中图层1，删除图层1的部分渐变效果，从按钮上方1/3处，再调节一个各图层的透明度，加上点文字最终得到如下效果(附按钮的效果图解说明,按钮最终效果可以按自己的需要调节 。CWJ育儿早教网

　　CWJ育儿早教网

　　其实设计水晶按钮有很多种方式，就想桌面图标设计也是有很多种方式方法，小编给大家介绍的只是其中的几种方法，不知道您试过么？希望能帮助到您。CWJ育儿早教网

CWJ育儿早教网

THE END

广告、内容合作请点击这里 寻求合作

免责声明：本文系转载，版权归原作者所有；旨在传递信息，其原创性以及文中陈述文字和内容未经本站证实。

所属专题: 按钮  标签  简介  按钮图标  

本文地址:http://www.yuerzaojiao.com/qiaomen/youxi/137947.html

一份漂亮独特的包装设计就能为品牌点睛

网站首页 返回栏目

按钮与伪按钮 按钮图标设计概念

最新文章

推荐文章