Photoshop设计网页音乐播放器

2016-03-17 22:52 13 1 收藏

有一种朋友不在生活里,却在生命力;有一种陪伴不在身边,却在心间。图老师即在大家的生活中又在身边。这么贴心的服务你感受到了吗?话不多说下面就和大家分享Photoshop设计网页音乐播放器吧。

【 tulaoshi.com - PS 】

来源:活力盒子 作者:Luycas
本教程的效果图制作的非常小巧,很适合用到一些可以播放音乐的网页中。制作方法也比较简单,播放器的每一个部件基本上都是用图层样式来表现立体及浮雕效果,只要注意好图形的层次关系,我们就可以分层来完成效果图。
最终效果


1、第一步是我们创建一个黑色径向渐变的背景。在任何颜色tulaoshi的油漆层,添加一个如下所示的渐变图层样式。

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/ps/)2、用圆角矩形工具(设置一个半径为20像素)创建一个该设备的主要元素,表现设备的形状图层(点击菜单上的第一选择)。


3、双击该图层上的向量,颜色编辑器将打开。我们可以选择一个#E1E0E0的浅灰色的颜色,进而可以增加表面的发光程度。


4、现在我们要创建一个该设备周边的一个斜面。在此之前,我们需要用PS标尺创建一个参考标准。点击这两个统治者收敛角,通过拖动鼠标,我们在放置光标的位置放置光标,这将使我们能够创造一个外围设备周围等距离斜面。


5、我们把这个图层的不透明度调为0,因为我们只是想看到一个表面上2像素的斜面。

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/ps/)6、套用一个1像素的描边,在设备的内部位置要使用比设备前面更暗的颜色。在这一步,我们要创建一个代表行之间的形状和播放器的前联合差距的线。


7、设置2像素值以下的内发光。


8、给设备的前部添加软梯度,让设备更有凸出感。


9、现在,我们将突出这个MP3的优势。要做到这一点,需要添加一条有挤压感有三维效果的线。然后在MP3的外表面添加2像素灰度中风效果。

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/ps/)10、利用锥与浮雕风格,我们在这条线的上部区域添加光效果。现在物品看上去像是从上面打光,下面变得更暗的挤压效果。


11、现在在这个图层上添加柔柔的,轻轻的内阴影效果,让播放器的前面更显突出。


12、通过复制和编辑前面的斜面层,我们创造更多的代表不同的控制按钮的斜面。


13、现在通过编辑形状层来创建播放器的主播放/暂停按钮。重复第一个斜面,在边界以内画一个圆形物体。然后放大10%的水平,因为我们只需要那些斜面。

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/ps/)14、像下面这样在步骤13中创建的形状中应用软3像素面具。


15、为了使面具隐藏对象和它的图层样式,在图层样式窗口单击选项“图层蒙版隐藏效果”。如果我们不选择此选项,这个面具只能隐藏形状,但是会把效果显示出来,而我们就是想要把它隐藏。

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

123下一页

来源:http://www.tulaoshi.com/n/20160317/1867663.html

延伸阅读
咪咕音乐播放器如何播放MV   咪咕音乐播放器提供免费的高清音乐MV播放服务。包括最新发布的音乐MV、最热门的明星采访、最私密的独家新闻发布等多种优质的MV服务。在曲库首页精彩MV专栏,客户可以观看到咪咕音乐为客户准备的高清正版MV及演唱会、歌友会等其它精彩视频,让客户在听到歌曲的同时也能享受到视觉盛宴。 观看曲库中...
酷狗音乐播放器评测 酷狗音乐播放器是一款在塞班和安卓上非常有名的音乐播放器,今天酷狗正式登陆iPhone平台,不仅带来了高性能、超流畅的音乐播放能力,同时将酷狗海量的网络歌曲库带到iPhone平台。酷狗音乐播放器虽然是一款非常老牌的音乐播放器,但是在iPhone平台来说,还是一个新兵蛋子,那么,在 iPhone平台他的表现如何呢?能否一如...
标签: 电脑入门
步骤一:点击Qzone首页最上面的“装扮空间” 步骤二:点击Qzone商城中的播放器栏目; 步骤三:点击您所喜欢的播放器进行免费试用,确认购买之后再点击保存装扮就可以了。 图老师健康网温馨提示:Qzone音乐播放器是播放背景音乐的必需物品
拜读了《中国电脑教育报》第12期第A29版《音乐播放器DIY》一文,使我深受启发,也萌生了制作一个播放器的想法。通过几天的研究实践,还真让我DIY了一个播放器,自我感觉不错喔!现特地“奉献”出来与朋友们共享! 1、打开Authorware 6.0,新建一个文件并保存名为“我的播放器”;按Ctrl+Shift+F打开Functions函数库,选择Category下的“...

经验教程

889

收藏

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