鼠绘简洁时尚的多功能播放器图标赏析
播放图标很常见，不过要做好还是要下一定功夫的。首先要在造型上有一定的特色，最好多找一些实物图参考；然后画出线稿图，并作出分层图；再给图标上色，用图层样式等加上质感等即可。
最终效果
http://img.jcwcn.com/attachment/portal/201503/18/221635dwfw8ffdwh8d822p.jpg
1、在做这个图标之前，我首先翻箱倒柜去找了一个古董级MP3来参考一下。
http://img.jcwcn.com/attachment/portal/201503/18/221635z3oo3o4skps05pk3.jpg
2、考了一下，我决定把一体的按键变成五个，科技感会强一些。在这里我画了一个草图。
http://img.jcwcn.com/attachment/portal/201503/18/221638qqiwj0kwdxbxlkex.jpg
3、新建一个1000*600的文档，设置前景色为白色#ffffff，背景色为#cfcfcf，使用渐变工具，画一个白色到浅灰色的渐变，渐变跟我下图中的箭头差不多就行了。
http://img.jcwcn.com/attachment/portal/201503/18/2216381n55tgoxgznsch7t.jpg
4、下面，我们给背景图层添加一点杂色，强化质感。执行“滤镜—杂色—添加杂色”，设置数量为1%，高斯分布，勾选单色。
http://img.jcwcn.com/attachment/portal/201503/18/221638otw9owokbqqo0lm9.jpg
5、现在，我们开始构建图标的轮廓形状。使用椭圆工具，设置前景色为#cecece，画一个450*450像素的正圆。我把它命名为“外圆”。
http://img.jcwcn.com/attachment/portal/201503/18/221639l8hwvoizo8d9vcq9.jpg
6、现在，我们为这个“外圆”添加一个图层样式。
http://img.jcwcn.com/attachment/portal/201503/18/221639t1u1et49n1x3ut34.jpg
7、接下来，还是用椭圆工具，画一个400*400像素的圆，我将其命名为“内圆”，颜色这里无所谓，等会我会用图层样式修改它的颜色。“内圆”图层的图层样式的设置请看下图。
http://img.jcwcn.com/attachment/portal/201503/18/221639q0wo517yf0qjqya6.jpg
http://img.jcwcn.com/attachment/portal/201503/18/22163958k0gs7ozozekn8n.jpg
http://img.jcwcn.com/attachment/portal/201503/18/221639tstdggusmgtpterd.jpg
鼠绘简洁时尚的多功能播放器图标2
8、接下来，我们画出中间的那个播放按纽，同样的，还是使用椭圆工具，画一个180*180像素的正圆，颜色还是无所谓，我们会使用图层样式来得到我们需要的颜色。图层样式设置如下。
http://img.jcwcn.com/attachment/portal/201503/18/2216409sjc2bwct2hcurwq.jpg
http://img.jcwcn.com/attachment/portal/201503/18/2216400tklje1paiilllke.jpg
http://img.jcwcn.com/attachment/portal/201503/18/221640uwfgpzbmpffb8upm.jpg
http://img.jcwcn.com/attachment/portal/201503/18/221640txr0rzrlzt7a7f74.jpg
9、当然，别忘了，到目前为止，要把所有的圆的形状都需要居中对齐一下，目前我们得到如下效果。
http://img.jcwcn.com/attachment/portal/201503/18/221640ooex22fo64fpei5o.jpg
10、用圆角矩形工具画一个130*75像素的圆角矩形，圆角的角度默认就行，圆角矩形的颜色也无所谓，一会我们用图层样式来更改它的颜色。圆角矩形的位置摆放无所谓，我们等会可以再调整。
http://img.jcwcn.com/attachment/portal/201503/18/2216417luiorsxx3kezieb.jpg
11、选择圆角矩形图层，执行“编辑—变形”，将变形的模式设置为“扇形”，弯曲设置为“45度”，我们将得到如下的效果。
http://img.jcwcn.com/attachment/portal/201503/18/221641qugdgh7hyhigihfd.jpg
12、扇形有了，接下来就简单了，首先先微调一下扇形的位置，让其基本上处于我们最中间的播放按纽和内圆组成的圆环的中心位置。 然后选择住扇形图层，CTRL+T，设置中心点为画布的中心，设置旋转角度为90度，应用。 CTRL+ALT+SHIFT+T，得到四个扇形。
http://img.jcwcn.com/attachment/portal/201503/18/221641x88y4xq9x4xgegxb.jpg
鼠绘简洁时尚的多功能播放器图标3
13、下面我们为四个扇形按纽设置图层样式。首先我们为最上面的按纽设置图层样式，我将其命名为“增加音量按纽”，因为等会我想给它分配的功能按键就是增加音量。图层样式设置如下。
http://img.jcwcn.com/attachment/portal/201503/18/2216417v5vnw657977k5yk.jpg
http://img.jcwcn.com/attachment/portal/201503/18/2216419ida8i88frf2f8hz.jpg
14、下面，我们来设置右侧按纽的图层样式。
http://img.jcwcn.com/attachment/portal/201503/18/221642bd066yyzso0vrp3v.jpg
http://img.jcwcn.com/attachment/portal/201503/18/2216428bz7c0n8v7z80834.jpg
15、设置下方按纽的图层样式。
http://img.jcwcn.com/attachment/portal/201503/18/2216458325oz4zr2vrhrz4.jpg
http://img.jcwcn.com/attachment/portal/201503/18/22164549y8n9eyaefy08e4.jpg
http://img.jcwcn.com/attachment/portal/201503/18/221646vkmdz0qdw0xcqq09.jpg
16、接下来，我们设置左侧按纽的图层样式。
http://img.jcwcn.com/attachment/portal/201503/18/221646lulwgudwj3n3lgjo.jpg
http://img.jcwcn.com/attachment/portal/201503/18/221646y4z4m4z661k4jx1y.jpg
17、四个按纽的图层样式都搞定了，来看看我们现在的效果。
http://img.jcwcn.com/attachment/portal/201503/18/221646mm84u9p97u64gq8n.jpg
鼠绘简洁时尚的多功能播放器图标4
18、按纽好了，下面我们来添加按纽上的按键图标。
http://img.jcwcn.com/attachment/portal/201503/18/221646o0htksqd8t051n1d.jpg
19、图标有了，接下来要做的就是给图标设置图层样式。
http://img.jcwcn.com/attachment/portal/201503/18/221647szmuzo6wirul4mgg.jpg
http://img.jcwcn.com/attachment/portal/201503/18/2216479mma9l5924cz9mmp.jpg
http://img.jcwcn.com/attachment/portal/201503/18/221647rrqvlxp89pvuvnnp.jpg
20、五个图标的图层样式设置成一样就可以了，直接拷贝图层样式来粘贴。到目前以为，我们得到如下效果。
http://img.jcwcn.com/attachment/portal/201503/18/221647buccz1z811bc11ct.jpg
21、看上去，好像稍微单调了一些，我们来加个颜色。我想在最外面的圆环那里赋予它一点颜色，画一个类似进度条之类的东西。用钢笔画一个类似下图的形状，使其置于“外圆”图层与“内圆”图层中间，并创建剪贴蒙版，至于颜色的话，随你喜欢，我用的是浅蓝色。
http://img.jcwcn.com/attachment/portal/201503/18/221647nunbjscemco5zmu5.jpg
最终效果：
http://img.jcwcn.com/attachment/portal/201503/18/221635dwfw8ffdwh8d822p.jpg
页:
[1]