Photoshop方形复古播放器图标制作教程

给各位Photoshop软件的使用者们来分享一下方形复古播放器图标的具体制作教程。

教程分享:

一、新建一个1000*800的文档,添加一个渐变调整层,做一个#b4b097到#4e473a的90度的径向渐变,设置缩放为150%,勾选仿色,防止出现色块。

我想大家一定很好奇,我的截图径向渐变中的浅色为何不居中,而是位于中部居上,看我们的GIF演示。 在渐变填充的状态下,我们把鼠标指针放置到屏幕上,出现那个移动工具的图标时,我们拖动,渐变的位置也跟着动,这一个操作方法,在图层样式中一样可用。


二、使用圆角矩形工具画一个600*600像素的圆角矩形,设置圆角为140像素,设置水平居中,垂直居中。

 


三、我将这个圆角矩形命名为“主体”,并为其添加了一个图层样式。

 


 


 


 


 


四、复制一层“主体”图层,更改图层名为“投影”,将“投影”图层置于“主体”图层下层,将图层填充设置为0,再添加一个图层样式,我们来增强一下投影效果。

 


 


五、原图画的是一个类似椭圆的形状,我这里偷懒一下,还是画的圆角矩形,大小为500X360像素,圆角半径为130像素,添加一个图层样式。

 


 


 


六、下面,我们创建屏幕,设置前景色为#b4b097,使用圆角矩形工具,画一个大小为420*280像素,圆角半径为100像素的圆角矩形。

 


七、为这个“屏幕”图层添加一个图层样式。

 


 


 


 


 


八、复制一层“屏幕”图层,转智能对象,添加一个杂色,并将图层混合模式更改为“柔光”。

 


九、用两个屏幕的那个圆角矩形相减,得到我们需要的屏幕下部的高光形状,将这个形状的颜色设置为#eaead2,在属性面板中设置一个1像素的羽化,并将图层混合模式更改为“柔光”,不透明度34%。

 


十、设置前景色为#eaead2,用屏幕的那个圆角矩形和一个椭圆相交,得到我们需要的屏幕顶部的高光形状,同样的将图层混合模式更改为“柔光”,不透明度34%,并添加一个图层蒙版,适当的擦拭左右两侧。

 


十一、下面,我们来制作按纽,设置前景色为#b4b097,画一个正圆,并添加一个图层样式。

 


 


十二、设置前景色为#d9d0ca,画一个小一点的圆,并添加一个图层样式。

 


 


 


 


十三、复制一层“按纽”图层,更改图层名为“投影”,将图层填充设置为0,再添加一个图层样式,我们来增强下投影效果。

 


 


十四、选择住按纽的这三个图层,CTRL+G,创建图层组,命名为“按纽1”,复制图层组,得到四个按纽,最右侧的一个按纽,我将颜色更改了,这里不再给参数了,如果你不懂得如何改,那么你看教程就是只是单纯的看,并没有真正的理解。

 


十五、最后我添加了我们P大点S的LOGO和图标,设置了一个内阴影和投影,这个图层样式太经常用到了,我们的教程里太经常看到了,这里就不说了。

 


最终效果:

时间: 2024-09-19 15:43:34

Photoshop方形复古播放器图标制作教程的相关文章

Photoshop设计电视机主题UI图标制作教程

给各位Photoshop软件的使用者们来详细的解析分享一下设计电视机主题UI图标的制作教程. 教程分享: 首先,我们看看原图,一个400*300的小图.   新建一个1000*800的文档,添加一个渐变调整层,做一个#b4b097到#4e473a的90度的径向渐变,设置缩放为150%,勾选仿色,防止出现色块.   我想大家一定很好奇,我的截图径向渐变中的浅色为何不居中,而是位于中部居上,看我们的GIF演示. 在渐变填充的状态下,我们把鼠标指针放置到屏幕上,出现那个移动工具的图标时,我们拖动,渐变

photoshop设计iPhoneES手机主题图标制作教程

给各位photoshop软件的使用者们来详细的分享一下设计iPhoneES手机主题图标的制作教程. 教程分享:   STEP01,绘制机身厚度 绘制一个350*350px,圆角为60px的圆角矩形,为其添加一个固有色:"#ba9b7a" 然后再为其添加明暗变化(使用渐变叠加):     将"与图层对齐"选中以后,渐变效果的约束范围就是该形状本身; 其中浅色色块位置为"0%"."15%"."85%".&quo

photoshop快速设计描边小图标制作教程

给各位photoshop软件的使用者们来详细的解析分享一下快速设计描边小图标的制作教程. 教程分享: 描边图标是追波上MBE大神开始设计的图标风格,然后就掀起了一股时尚风潮 下面是一些截图:   <点图片看大图>www.16xx8.com 在绘制之前,我们先分析并总结一下上面图标的特点: 1.图形外观围绕着深色描线,也可以叫描边,描线与图形偶尔错位开. 2.描边有断线 3.图形线条简单,比较圆润,基本上都是圆角,图形容易绘制,也很可爱,十分的萌萌哒. 4.色泽比较鲜艳大胆,几乎都是明亮色,明黄

photoshop临摹一个指针主题图标制作教程

给各位photoshop软件的使用者们来详细的解析分享一下临摹一个指针主题图标的制作教程. 教程分享:     好了,以上的信息就是小编给各位photoshop的这一款软件的使用者们带来的详细的临摹一个指针主题图标的制作教程解析分享的全部内容了,各位看到这里的使用者们现在是非常的清楚了吧,那么各位就快去按照小编的教程自己去制作下吧.

photoshop设计一枚筹码图标制作教程

给各位photoshop软件的使用者们来详细的解析分享一下设计一枚筹码图标的制作教程. 教程分享:   好了,以上的信息就是小编给各位photoshop的这一款软件的使用者们带来的详细的设计一枚筹码图标的制作教程解析分享的全部内容了,各位看到这里的使用者们现在是非常的清楚了制作方法了吧,那么各位现在就快去按照小编分享的教程自己去尝试制作下吧.

photoshop简单易学的圆环图标制作教程

给各位photoshop软件的使用者们来详细的解析分享一下简单易学的圆环图标的制作教程. 教程分享:   好了,以上的信息就是小编给各位photoshop的这一款软件的使用者们带来的详细的简单易学的圆环图标的制作教程解析分享的全部内容了,各位看到这里的使用者们现在是非常的清楚了教程了吧,那么各位就快去按照小编的教程自己制作下吧.

Photoshop天气主题APP应用图标制作教程

给各位Photoshop软件的使用者们来说一下天气主题APP应用图标的制作教程. 教程分享: 1.背景填充渐变如图,再花正圆矩形大小,适当就行.   2.图层样式为径向渐变,渐变色如图(自己看着调).   3.绘制阴影,用椭圆工具在图标下层绘制一个形状如图的椭圆,在属性面板里进行羽化,效果如图.然后建立图层蒙版擦出多余部分.   4.椭圆工具如上图画上第一层云朵的阴影黑色,不透明度为12%.   5.Ctrl + J 复制一层云朵上移动,图层样式:斜面和浮雕,渐变叠加上浅下深都是灰度的.下面颜色

photoshop设计白色相机UI图标制作教程

给各位photoshop软件的使用者们来详细的解析分享一下设计白色相机UI图标的制作教程. 教程分享:           好了,以上的信息就是小编给各位photoshop的这一款软件的使用者们带来的详细的设计白色相机UI图标的制作教程分享的全部内容了,各位看到这里的photoshop软件的使用者们,小编相信你们现在是非常的清楚了教程了吧,那么现在就快去自己试试吧.

photoshop设计玉镯主题UI图标制作教程

给各位photoshop软件的使用者们来详细的解析分享一下设计玉镯主题UI图标的制作教程. 教程分享: 第一步.绘制图标底座形状,这里给的是300*300,圆角度数为20.   第二步.给底座填充一个从深色到浅色渐变,顶部添加亮色内阴影,底部添加投影.     第三步.添加一个240PX的圆,并给上暗内阴影,下亮投影.同时添加一个比矩形略深的渐变叠加,打造凹槽效果.   第四步.在凹槽内添加一个直径200px,宽度30px的圆环,颜色给高亮绿色,这里给了#adfcd6,做玉镯的基本形状.   第