Photoshop绘制质感的播放器音量开关

2016-02-15 21:37 10 1 收藏

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

【 tulaoshi.com - PS 】

先看看效果图

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

画布大小自定义,我这里800*600px,颜色值:2e2f31

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

2.绘制一个正圆,按住shift键,点击鼠标左键,选择移动工具V,在与画布垂直、水平居中对齐,颜色值:2e2f31

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

3.给图层命名base(底层),并添加内阴影、投影

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

4.复制base图层,右击选择清除图层样式,按住Ctrl+T,再按住shift+Alt等比例缩小,缩放比例看图,并命名shape(形状),再添加图层样式

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

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

5.新建正圆,并命名shadow(阴影)我是cc版的,羽化就行:6.6px,找不到的话,就高斯模糊,滤镜模糊高斯模糊,数值自个调,按住shift+方向键,下移到base图层边缘就行。

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

6.在绘制一个shape图层,为什么是一样的,这个我真不知道诶,这是按国外大神做地,为了以示区别,可以改为shape2,这个图层移到阴影图层下,添加图层样式

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

7.在绘制一个shape图层,在加个数字3把,按Ctrl+T,shift+Alt等比例缩放,添加图层样式

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

8.绘制一个正圆命名为metal(金属)层,添加图层样式

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

大神没给颜色值,无非就是黑、灰、白,

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

9.复制metal图层,并改为gradient(渐变)右击图层,清除样式,重新添加黑白渐变,图层填充为0

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

10.绘制一个圆角矩形,命名为mark(标记)图层,在选择矩形工具减去一小部分,添加图层样式

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

到这一步算是基本完成了,接下来就是指示灯的问题。

这一步需要AI支援了

将ps文件保存好后,打开AIcs6,按Ctrl+O弹出打开窗口,选择需要的打开文件,打开后会弹出一个窗口,默认,点确定即可。

AI步骤:

1.绘制一个正圆,圆的大小,你们看着顺眼吧。

选择旋转工具(R),按住Alt键将鼠标移到圆的中心位置,会显示出中心点字体,不要松开鼠标,将中心点移到金属中心位置,此时会弹出旋转弹窗,输入22.5度,点复制,在按Ctrl+d键,连续复制。

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

如下图:这是全选中状态,因为要复制,在编辑复制,再回到PS软件,Ctrl+V粘贴

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

此时弹出粘贴弹出,选择最后一个

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

接下来就是给两个图层命名为off,off2添加图层样式

Off:图层样式

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

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

Off2图层样式

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

这是我做的效果:(这里稍微修改了下,5°C™渴樂 说中心圆没对齐,感谢您对我提的建议,在这里又重新做了一张,原来做的我就不删了,就把它当做对我的警醒吧,细心细节真的很重要!)

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

这是原效果图

Photoshop绘制质感的播放器音量开关,PS教程,图老师教程网

来源:http://www.tulaoshi.com/n/20160215/1564241.html

延伸阅读
标签: PS PS基础
本教程主要使用Photoshop绘制时尚迷你的网页播放器教程,一个很简单的播放界面。主要是图层样式的应用,操作绝对简单。做完之后,修改颜色神马的相当的快,当然直接用色相之类的来修改颜色,我并不赞同,原因嘛,自己想!其实做完一个颜色后,直接在源文件里更改图层样式,换个色也花不了多长时间的。 今天,我所提供的PSD里,我们做了四个颜色...
标签: PS PS基础
开始实例的学习之前,可以先下载实例的配套素材,然后跟随操作步骤进行学习。 素材: MissYuan_教程素材.rar (1)运行Photoshop CS5,打开本书附带光盘背景.psd文件。 (2)使用钢笔工具在视图中绘制形状图层。 (3)接着为形状 1图像添加渐变叠加和斜面和浮雕样式效果,使其呈现立体效果。 (4)继续为其添加内阴影、描...
播放器的都是由一些细小的元素构成,而且每个元素又有水晶及金属质感,制作的时候需要细心。除了这些颜色的搭配也很重要,制作的每个元素都要融入到主体里面,这样整体效果就美观很多。 最终效果 1、创建一个 600×400 px的图层。 2、使用放射式渐变填充背景,颜色设置为#5e6c78 - #20282e。 3、复制背景图层,之后进行滤镜-杂色-...

经验教程

858

收藏

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