Photoshop制作一个质感的网页导航按钮

Photoshop制作一个质感的网页导航按钮的相关文章

• 
  Photoshop制作质感的斜纹网页导航按钮

  标签：PS PS基础

  效果图： 大家好，下面由我来开始教如何做上图效果的简单按钮： 1.首先打开photoshop软件，Ctrl+N新建一个10 x 10px的72dpi(分辨率)的文件： ①.我们先在图层面板新建一个新的图层，然后把背景图层删除(可按del键快捷键) ②.接着在导航器把界面放到最大 可按ctrl+"+" 快捷键，然后选择矩形选框工具，再选择上面的添加到选区，然后按照下图选出那样的选区 并填充(alt+delete)为白色： ...[ 查看全文 ]

  天元打井队

  41
• 
  Photoshop制作一个精细的导航按钮

  标签：PS PS基础 PS效果

  网页设计中按钮的制作非常重要，精致的按钮会给网页增色不少。下面的教程介绍一款非常不错的按钮的制作方法。制作过程比较简单：先用图形工具制作出按钮的形状，然后加上一些简单的图像样式做底色。然后再加上高光及文字等即可完成效果。 最终效果 1、打开photoshop，然后新建一个文档250*150，并填充背影:#252a38。 2、在工具箱上选择椭圆图标并设置如图。 3、新建一个图层...[ 查看全文 ]

  阿琼福娃

  331
• 
  Photoshop制作一个简单的网站按钮

  标签：PS PS基础

  先看效果图 新建文档200x50像素，背景填充深灰色。建新层，前景色#9a2941画一个圆角矩形。 添加图层样式。 然后建新层，画下图所示蓝色形状，效果如下， 单列选框工具点一下，填充白色，复制2个，图层模式叠加，添加蒙版去除多余部分。 输入白色文字，添加黑色1像素描边样式，具体不截图了，很容易。 建新层，调出形状1选区，填充白色，去掉选区，底部做一个大的椭圆选区，...[ 查看全文 ]

  西柚360

  31
• 
  Photoshop制作一个漂亮的金属质感图标

  本教程介绍金属质感效果的制作方法。主要是利用光照效果的纹理通道来制作质感。其它还用到一些滤镜效果来加强质感。制作的时候需要根据图形的实际大小来设置参数。 最终效果 1、新建一个600 * 600 像素的文件，如下图。 2、选择子定义形状工具，选出自己喜爱的图形。 3、新建一个图层，拉出图形效果，颜色选择灰色，如下图。 4、按Ctrl 点图层面板缩略图调出选区，然后点通道面板，点下...[ 查看全文 ]

  miffymiffy00

  111
• 
  Photoshop金属质感的圆形网页按钮

  标签：PS PS基础

  先看效果图。 新建文档550550像素，背景黑色，建新层，前景色4c73f1画一个正圆形状，复制3个，副本1图层缩小5%左右，副本2层缩小位置如下，颜色改为白色。 选择形状1，隐藏其它层，添加图层样式。 描边颜色请采样我的截图，效果如下。 选择副本层，添加图层样式。 效果如下。 选择副本2，填充归零，添加图层样式。 添加蒙版黑白直线渐变。 最终效果如下。 ...[ 查看全文 ]

  btbtchao

  61
• 
  Photoshop设计金属质感的网页按钮

  标签：PS PS基础

  先看看效果图 让我们开始!创建一个新的文件，本ps教程分辨率为500×300，填补这个白色画布。然后选择圆角矩形工具(半径30像素)绘制一个形状使用#d61d23的颜色。 之后，应用下面的图层样式到这一层： 内阴影 渐变叠加 您的按钮应该看起来像我的： 现在，时间，使反射按钮。使用Ctrl + J键复制当前层，然后创建一个新的，然后将其翻转复制的图层，得到一个层中的所有图层样式。之后...[ 查看全文 ]

  爱尚KTV孙红

  71
• 
  Photoshop制作一个质感的卡通小公仔

  效果图看上去有点3D的效果，不过人物部分非常简单，用PS也很容易做出来。制作的时候，高光部分的制作非常重要，需要用高光来渲染物体的质感。质感越好，人物的立体感就越强。 最终效果 1、新建一个600 * 600像素的文件，背景填充白色，新建一个图层，命名为“主轮廓”。然后用钢笔勾出人物的轮廓路径，转为选区后填充黑色，效果如下图。 图1 2、现在从头部开始制作，先开始制作头发部分。新建...[ 查看全文 ]

  无颜女554

  31
• 
  Photoshop制作简单的水晶导航按钮

  标签：PS PS基础 PS效果

  本教程的按钮制作比较简单。大致的过程：先画好想要的按钮形状，可以使任意图形。然后设置一些图层样式，后面加上高光和文字即可。 最终效果 1、把底图层填充成灰色，再创建一个新图层，在新图层上用矩形选框工具画出一个长方形(大小自己看着来) 用兰色填充(兰色值为#22aff7)。在这里顺便把选区储存起来 因为后面要用到。 最后给一个5px的下拉阴影，如下图: 2、新建一图层，起名”深色”，用深兰...[ 查看全文 ]

  lxdnb450

  111
• 
  Photoshop制作简单的蓝色导航按钮

  标签：PS PS基础 PS效果

  本教的按钮部分制作比较简单，用图层样式就可以完成。不过作者在介绍按钮的同时也介绍了背景部分的制作。这样搭配起来，做出的按钮更漂亮。 最终效果 1、新建一文件，大小自定，这里是600*400为例。设置前景色：＃1592d7，背景颜色：＃136da2，选择径向渐变工具。从中间拖动得到下面效果： 2、添加散射光条文。新建一层，左边工具栏选择-圆角矩形按钮-自定义形状按钮。找到下面这个形状，如果没有...[ 查看全文 ]

  未央静晴

  321
• 
  Photoshop制作漂亮的左侧导航按钮

  标签：PS PS基础 PS效果

  本教程介绍非常漂亮的导航图示按钮制作方法。按钮的效果非常大气及精美，利用图示图形来制作提示效果，感觉非常的生动。 最终效果 1、首先我们在PS里新建一文件，大小为 500x500px，白色背景。 2、使用圆角矩形（半径为10px），绘制我们的质感图标的轮廓。 3、随后我们使用钢笔工具为每条边的中点增加一个矢量点，随后用直接选择工具将四条边的中点向外拖动一点距离，目的是让图形轮廓感觉...[ 查看全文 ]

  Me兽人博士

  291
• 
  Photoshop快速制作透明的导航按钮

  透明物体是通过背景进行参照，体现出质感。而本例里是讲解白色透明背景，如果背景太亮，会导致对比不明显。 最终效果 1、打开下图所示的背景素材，选择菜单：滤镜 模糊 高斯模糊，数值稍微大一点，效果如下图。 2、把前景色设置为绿色，用圆角矩形工具拉一个合适的圆角矩形，然后选择钢笔工具，在属性栏选择“合并形状”，勾出底部三角形形状，如下图。 把当前图层填充...[ 查看全文 ]

  不是绅士的流氓

  51
• 
  Photoshop设计蓝色质感的网页下载按钮

  标签：PS PS基础

  本教程主要使用Photoshop绘制蓝色玻璃质感的下载按钮，主要通过图层样式来完成，喜欢的朋友一起来学习吧，有不懂的朋友可以下载PSD源文件下载。 教程的源文件： 蓝色玻璃质感的下载按钮PSD源文件 [ 查看全文 ]

  qu25733257

  61
• 
  Photoshop网页设计教程：制作简洁风格黑色导航条按钮

  标签：PS PS教程

  本文由 中国 zixuan_gzs 编译，转载请保留此信息！ 在学习中遇到问题可以到 论坛Photoshop求助研讨版块 发贴交流！ 本例为Photoshop网页设计实例教程，主要学习如何运用PS制作简洁风格黑色导航条按钮，运用的工具主要有图层样式、图层混合模式以及渐变填充的运用，制作过程比较简单，有兴趣的朋友可以动手试试哦~~ 最终效果： 练习的过程中自由发挥，多改变下参数的设置，你会得到更多意想...[ 查看全文 ]

  涔堜箞鍝掆啠

  431
• 
  Photoshop制作简洁的网页按钮

  标签：PS PS基础

  先看效果图。 新建文档500x300像素，背景黑色，新建图层，画一半径200的白色圆角矩形。 添加图层样式。 效果如下。 新建图层，再画一个小的白色圆角矩形，图层不透明度50%。 下面制作倒影，复制大的圆角矩形图层，新建图层1，然后合并2个图层得到图层1，ctrl+T垂直翻转挪到底部。 添加蒙版黑白直线渐变，图层不透明度80%左右，输入白色文字，效果如下。 如果你觉得蓝色不好...[ 查看全文 ]

  程_程

  61
• 
  Photoshop制作漂亮的绿色水晶导航按钮

  标签：PS PS基础 PS效果

  按钮是网页中不可缺少的部分，好的按钮可以给网页增色不少。下面的教程介绍水晶风格的导航按钮制作。制作的时候先制作按钮的一部分，然后再复制组成导航栏。 最终效果 1、新建文件，大小500x 200px ，选择渐变工具(G)，(径向渐变)从#363636到#252525。 最左边拖动到右下角。 2、新建层， 选择选区工具(M)，固定大小为100 x 40px角。 3、填充线性渐变从 #68ad40和#4c8c2c。 4、选着图层...[ 查看全文 ]

  jinghang6

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

  标签：PS PS基础 PS效果

  本教程介绍主色为黑色水晶按钮的制作方法。大致过程：做好想要的按钮形状以后，填充黑色，用图层样式做出简单的高光效果。然后再添加一些纹理和反光效果即可。 最终效果 1、打开下图所示的背景素材。 2、新建图层并命名为“按钮”，选择“矩形工具”，单击工具选项栏中的“填充像素”按钮进行绘制。 3、为“按钮”图层添加图层样式，单击“外发光”项目，设置其各项参数。 ...[ 查看全文 ]

  oijjjs

  211
• 
  Photoshop绘制立体质感的网页开关按钮

  标签：PS PS基础

  如果你是设计师，那么创建界面元素是非常重要的技能。本次教程中，我们会创建一个简单漂亮的切换开关按钮。切换开关经按钮常用于某项功能的启用与关闭，他们经常出现在UI设计与网页应用设计中，好了，来开始我们的教程吧。 先看看效果图 下面是教程 第1步： 打开Photoshop，Ctrl+N新建一个文档，尺寸选择600×500px。 第2步： 按住Alt键双击背景图层，将其转换为普通图层。再次双击，打开图层样...[ 查看全文 ]

  QQ757856333厣

  61
• 
  Photoshop制作透明大气的导航按钮

  标签：PS PS基础

  透明物体是通过背景进行参照，体现出质感。而本例里是讲解白色透明背景，如果背景太亮，会导致对比不明显。 最终效果 1、打开下图所示的背景素材，选择菜单：滤镜 模糊 高斯模糊，数值稍微大一点，效果如下图。 2、把前景色设置为绿色，用圆角矩形工具拉一个合适的圆角矩形，然后选择钢笔工具，在属性栏选择合并形状，勾出底部三角形形状，如下图。 把当前图层填充改为：0%，此时形状的颜...[ 查看全文 ]

  ding豆豆

  41
• 
  Photoshop设计颓废质感的网页UI滑动按钮

  标签：PS PS基础

  [ 查看全文 ]

  lidi3388

  61
• 
  Photoshop制作漂亮的黑色质感按钮

  标签：PS PS基础 PS效果

  本教程介绍非常实用的导航按钮的制作方法。效果图看上去非常简单，不过还是有很多细节需要用心去处理，如果按钮的高光及倒影部分。教程只是一个提示，学会了就可以作者其它类似的效果。 最终效果 1、新建一个120 * 50的文档，背景填充颜色：#838383，选择圆角矩形工具，半径设置为10像素。然后拖曳出一个大小适当的圆角矩形，位置偏上，因为最后将添加投影。圆角矩形的颜色为：#111111。 2、...[ 查看全文 ]

  天秤座的Medusa

  861