最火下载站首页
手机版
最火下载站
关注公众号
最火下载站

当前位置:首页 > 网络知识 > 设计在线 > 平面设计> photoshop制作一个圆形开关按钮教程

photoshop制作一个圆形开关按钮教程

文章作者:网友投稿 发布时间:2013-01-06 来源:网络

本文最火软件站给您推荐一个photoshop制作一个圆形开关按钮教程,首先看一下最终效果图: 在这个教程中,我们将会学习到一个可以运用到界面设计中的圆形开关按钮,好,话不多说,我

  本文最火软件站给您推荐一个photoshop制作一个圆形开关按钮教程,首先看一下最终效果图:

580-01.jpg

  在这个教程中,我们将会学习到一个可以运用到界面设计中的圆形开关按钮,好,话不多说,我们马上开始来学习。

  需要的素材:垂直布纹图案和作旧材质

  制作背景

  新建一个像素为1000*1000,分辨率为72的画布。

580-02.jpg

  应用背景图案

  新建一个组,命名为”背景”。现在,我们可以点击这里下载我们所需要的图案。解压之后,在Photoshop中打开图片vertical_cloth.png,选择编辑>定义图案命令,将其保存为图案。接下来我们使用矩形工具画一个比画布要大一些的形状,并将刚才做好的图案应用到该图层的图案叠加样式中。

580-03.jpg

  制作按钮 – 步骤一

  创建一个新的组命名为”按钮”。按住Shift键,使用椭圆工具画一个如下图所示的正圆形。接下来将图层样式按照下图提供的参考参数设置好,当都设置好这些参数后请将该图层的不透明减少到20%。

580-step 1.jpg

#p#副标题#e#  步骤二

  现在我们来画另一个颜色为#222429并且要比刚才要小一些的圆,然后跟着下图参考数据设置该图层的图层样式。

580-step 4.jpg

#p#副标题#e#  步骤三

  接下来我们可以点击这里下载我们所需要的纹理。(感谢很多国外设计师的无私分享素材)当我们下载文件之后,解压将psd文件在photoshop中打开,找到命名为Grunge Texture的图层,将该图层拖入我们制作圆形按钮的画布中,并把该图层的混合模式改为点光,不透明度为10%。都设置好之后为该图层添加剪切蒙版。

580-step 3.jpg

#p#副标题#e#  步骤四

  使用椭圆工具画一个颜色为#0d0d0e ,并且比上一个圆要小一些的圆。接着将该图层按照下图参考数值设置图层样式。现在,我们来使用大小为200px,硬度为0的画笔点一个像下图示例中的白色的点,并将该点的图层混合模式设置为柔光,不透明度设置为80%,然后为该图层创建剪切蒙版。接下来,我们再来新建一个图层,使用黑色笔刷像如下图示例那样画几笔,然后同样也为该图层创建剪切蒙版。

580-step 4.jpg

#p#副标题#e#  步骤五

  再次使用椭圆工具画一个比上一个圆要小几个像素的正圆。将该圆颜色设置为#1a1a1b,接着使用直接选择工具将最底部的锚点向上移动几个像素,如下图所示。现在我们来将该图层的图层样式按照下图中的参考参数设置好,并再次使用我们之前下载好的纹理图层Grunge texture ,将纹理置入画布中并将其图层混合模式设置为线性减淡,不透明度为10%。接下来,我们来新建一个图层,按照之前设置的画笔参数,使用白色,像如下示例图中一样刷去我们画的形状的底部,并将这个图层的图层混合模式改为柔光,接着为该图层创建剪切蒙版。

580-step 5.jpg

#p#副标题#e#  步骤六

  现在,我们来使用文字工具,选择Myriad Pro(标准字体),大小设置为48pt,加粗,然后再像下图中的位置写下颜色为#969696的字母 “I”,并按照如下图中的参考参数设置图层样式。再写一个颜色为#fefefe的字母”O”。接着将”O”图层右击栅格化图层,然后按住ctrl/cmd+T到自由变换模式,接着按住ctrl/cmd+shift+alt将左下角往左边拖几个像素,如下图示例。最后,将该图层的图层样式按照下图示例的参考参数设置即可。

580-step 6.jpg

  好了,下面就是最终效果图了,你有没有学会其中的技巧呢,希望通过本教程你能对图层样式的应用有所了解。

  最后把《圆形开关按钮PSD文件》分享给大家!

580-01.jpg

上一篇: 利用Photoshop制作雪地字体的教程

下一篇: 在Photoshop中自定义键盘快捷键教程(图)

共有0条评论网友评论