PS手把手教你创建一个MINI PLAYER

显示全部楼层 · 2023-3-10 03:29:35

教大家制作一个Wbe Mini Player，一个很简单的播放界面。主要是图层样式的应用，操作绝对简单。做完之后，修改颜色神马的相当的快，附上四个PSD源文件，收好!
　　当然，直接用色相之类的来修改颜色，我并不赞同，原因嘛，自己想!其实做完一个颜色后，直接在源文件里更改图层样式，换个色也花不了多长时间的。
　　今天，我所提供的PSD里，我们做了四个颜色，绿色，蓝色，灰色，红色，有兴趣的朋友可以试试别的颜色。

212H64c3-0.jpg (38.55 KB, 下载次数: 0, 售价: 4 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H64c3-0.jpg
　　我这里的教程用的绿色来示范!
　　首先，新建个文档，我用的是400X300像素。创建一个渐变调整层，做个径向渐变，颜色参数如下图。

212H64622-1.jpg (28.14 KB, 下载次数: 0, 售价: 4 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H64622-1.jpg
　　用圆角矩形工具画一个320X125的圆角矩形，颜色无所谓，我们一会会更改。

212HA3R-2.jpg (23 KB, 下载次数: 0, 售价: 6 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212HA3R-2.jpg
　　为这个圆角矩形添加一个图层样式。

212HA5b-3.jpg (22.61 KB, 下载次数: 0, 售价: 1 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212HA5b-3.jpg

212H63S9-4.jpg (82.41 KB, 下载次数: 0, 售价: 6 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H63S9-4.jpg

212HA361-5.jpg (77.14 KB, 下载次数: 0, 售价: 1 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212HA361-5.jpg

212H64R9-6.jpg (42.47 KB, 下载次数: 0, 售价: 1 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H64R9-6.jpg
　　OK，接下来，我们复制一层圆角矩形这个图层，右键清除掉图层样式，按住SHIFT画一个矩形，SHIFT这里是增加的意思，保证我们新画的矩形和圆角矩形是一个形状图层。然后，将形状的路径操作更改为与形状区域相交，这样我们就得到了我们想要的下半部分的形状了。将形状颜色设置为#68ce6b。

212H63107-7.jpg (27.42 KB, 下载次数: 0, 售价: 4 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H63107-7.jpg
　　下面，我们为这个下半部分的形状添加一个图层样式。

212H63043-8.jpg (22.86 KB, 下载次数: 0, 售价: 6 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H63043-8.jpg
　　接下来，我们用直线工具，画一条直线，放到我们刚才的那个下半部分图层的顶部位置，设置颜色为#119915，现在，我们得到如下效果。

212HAZ2-9.jpg (25.92 KB, 下载次数: 0, 售价: 4 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212HAZ2-9.jpg
　　下面，我们用矩形工具，画一个正方形，放置在左上角，充当专辑图片的图片框，并设置一个图层样式。

212HA1U-10.jpg (27.01 KB, 下载次数: 0, 售价: 1 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212HA1U-10.jpg

212HCA0-11.jpg (74.08 KB, 下载次数: 0, 售价: 6 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212HCA0-11.jpg
　　加上我们的LOGO，没什么好说的，当然，你也可以直接用图片，创建个剪贴蒙版，因为刚才我们设置了描边和投影，直接剪贴蒙版的话，图层样式是会保留的。

212H62G2-12.jpg (21.71 KB, 下载次数: 0, 售价: 4 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H62G2-12.jpg
　　接下来，我们开始做播放的进度条，首先用圆角矩形工具画一个长条的圆角矩形，设置颜色为#d0d0d0，并添加一个图层样式。

212H61528-13.jpg (23.43 KB, 下载次数: 0, 售价: 3 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H61528-13.jpg

212HA153-14.jpg (72.47 KB, 下载次数: 0, 售价: 4 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212HA153-14.jpg

212H613V-15.jpg (76.91 KB, 下载次数: 0, 售价: 3 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H613V-15.jpg
　　用矩形工具，画一个矩形，设置颜色为#53ba56，并创建剪贴蒙版，赋予已播放的部分绿色显示。

212H64510-16.jpg (29.1 KB, 下载次数: 0, 售价: 2 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H64510-16.jpg
　　设置前景色为#ebebeb，画一个正圆形，并添加一个图层样式。

212HCV8-17.jpg (30.34 KB, 下载次数: 0, 售价: 4 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212HCV8-17.jpg

212H61536-18.jpg (77.77 KB, 下载次数: 0, 售价: 1 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H61536-18.jpg

212HA013-19.jpg (41.63 KB, 下载次数: 0, 售价: 6 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212HA013-19.jpg
　　接下来，我们画一个小一点的圆，颜色设置为# 53ba56，并添加一个图层样式。

212H63010-20.jpg (31.45 KB, 下载次数: 0, 售价: 1 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H63010-20.jpg

212HC5a-21.jpg (80.59 KB, 下载次数: 0, 售价: 4 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212HC5a-21.jpg
　　接下来，添加时间进度和标题信息，这里文字用的颜色为#51c054，并添加了一个投影。

212H642B-22.jpg (31.05 KB, 下载次数: 0, 售价: 3 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H642B-22.jpg

212H642U-23.jpg (40.37 KB, 下载次数: 0, 售价: 4 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H642U-23.jpg
　　接下来，添加一个频谱，用矩形工具画就行了，也没什么可讲的，颜色为#119915，同样添加一个投影。

212H64309-24.jpg (32.18 KB, 下载次数: 0, 售价: 3 金钱)

2023-3-10 03:29 上传

点击文件名下载附件
212H64309-24.jpg

212H62049-25.jpg (40.37 KB, 下载次数: 0, 售价: 4 金钱)

[ps] PS手把手教你创建一个MINI PLAYER

浏览过的版块