N Style图标制作教程 II(源文件psd下载) / 木子杰软件教程

大家还记得上次的N Style图标制作教程吗，是一只粉嫩嫩的小兔子！不知道大家有没有做作业呢？这次@yu0910继续给大家发福利，带来一大波图标制作教程，这次的风格是颓废机械风格跟不规则形状风格，本教程依旧提供源文件psd下载，希望大家多多支持！另外欢迎上传交作业啦~

一、颓废机械风格 —— METAL （备份图标）

link：

Step01：点击 — 【文件】— 【新建】（快捷键Ctrl+N）新建一个新的图像，命名好并把宽度设置为800px，高度为600px，分辨率为72dpi，然后点击确定，记得顺手保存文件（快捷键Ctrl+S）。

Step02：选择【圆角矩形工具】（快捷键U，可按Shift+U切换），在画布点击【创建圆角矩形】弹出层，设置宽度为180px，高度为180px，半径20px，并勾选【从中心】，然后点击确定；

Step03：重命名图层为di，右键设置图层样式：

【斜面和浮雕】：样式：内斜面、方式：平滑、深度100%、方向：上、大小3、软化1、阴影角度90°、勾选【使用全局光】、高度30°、高光模式颜色#dedede、阴影模式颜色#262626、

【渐变叠加】：线性渐变，色值从上到下为 #333333 — #c6c6c6，角度为90°；

复制di图层重命名为di_bian，选择右键清除图层样式，填充颜色改为# 616161；按住Ctrl键点击图层载入选区，向上移动两像素，再反向选区（快捷键Shift+Ctrl+I），再点击【图层】窗口的【添加图层蒙版】；

Step04：制作残旧金属纹理部分，这一步采用的是素材图片嵌入和笔刷绘制，可在网上搜索关键字：残旧、颓废、喷溅、金属等字眼下载相关素材，ps：本教程所用到的图片跟笔刷连同图标源文件psd均有提供（见附件下载或者网盘链接），笔刷如何载入请自行，谢谢！

金属纹理主要是不断通过设置图层的混合模式和不透明度的参数值叠加调试而成的，本教程调试后的参数如下：

01采用素材图片 Rust_5.JPG，混合模式：正片叠底，不透明度70%；

02 使用笔刷，颜色#8c8c8c，不透明度30%；

03采用素材图片纹理.png，混合模式：变暗，不透明度30%；

这一步可自由发挥，自己觉得金属图片哪块可以作为纹理即用就可，参数也可自己调试叠加，以实际效果为主；

Step05：制作金属破损处，选择【钢笔工具】（快捷键P，可按Shift+P切换），绘制几个不规则多边形，形状自由发挥自定，配置金属纹理背景，颜色深点即可，此处举例：填充颜色#777777，设置图层样式：

【内阴影】：正片叠底，填充颜色#464646，角度90°，距离1px，阻塞0，大小1px；

再复制图层载入选区，填充颜色为#FFFFFF，向上移动一像素，反向选区（快捷键Shift+Ctrl+I），再点击【图层】窗口的【添加图层蒙版】。其他破损处也是使用这种操作方法；

Step06：复制图层di重命名为nei_di，点击【编辑】—【自由变换路径】（快捷键Ctrl+T），缩小90%（记得点击【保持长宽比】），右键清除图层样式，选择【混合选项】设置：

【渐变叠加】：线性渐变，色值从上到下为 #4b4b4b — #98988d，角度为90°；

【投影】：正片叠底，颜色#202020，角度90°，距离5px，扩展0，大小8px；

Step07：绘制备份图标，选择【椭圆工具】（快捷键U，可按Shift+U切换），在画布上按住Shift键画一个正圆，再选择【椭圆工具】，并选择路径【减去顶层形状】，画一个圆环，选择【钢笔工具】（快捷键P，可按Shift+P切换），并选择路径【合并形状】，在圆环右边处画一个三角形，最后再选【钢笔工具】，并选择路径【减去顶层形状】，画一个缺口，完成备份图标，重命名为backup，填充颜色#202020，设置图层样式：

【描边】：大小3px，外部，线性渐变，色值从上到下为 #787878 — #484848，角度为90°；

【内阴影】：正片叠底，颜色#474747，角度90°，距离3px，阻塞0，大小3px；

再复制图层backup重命名为backup_bian，载入选区，向上移动一像素，反向选区（快捷键Shift+Ctrl+I），再点击【图层】窗口的【添加图层蒙版】，设置图层样式：

【渐变叠加】：线性渐变，色值从上到下为 #282828 — #aeaeae，角度为90°；

Step08：绘制螺丝孔：选择【椭圆工具】，在画布上按住Shift键画一个小正圆，大小自定适合即可，设置图层样式：

【描边】：大小2px，外部，线性渐变，色值从上到下为 #929292 — #3b3b3b，角度为90°；

【渐变叠加】：线性渐变，色值从上到下为 #353535 — #0c0c0c，角度为90°；

复制图层（快捷键Ctrl+J或者选择【移动工具】按住alt键拖动），复制四个小圆分别放在四个角；

绘制插槽：选择【矩形工具】（快捷键U，可按Shift+U切换），画一个长方形，大小自定适合即可，设置图层样式：

【描边】：大小1px，内部，颜色#606060；

【内阴影】：正片叠底，颜色#2c1d02，角度90°，距离1px，阻塞0，大小5px；

【渐变叠加】：线性渐变，色值从上到下为 #e5c511 — #644200，角度为90°；

最后复制六个图层，并排放在底部且居中排列；

Step09：制作内部框残旧金属纹理部分，一样是采用素材图片嵌入和笔刷绘制；

金属纹理主要是不断通过设置图层的混合模式和不透明度的参数值叠加调试而成的，本教程调试后的参数如下：

01采用素材图片 Rust_4.JPG，混合模式：强光，不透明度15%；

02 使用笔刷，颜色# 181818，混合模式：叠加，不透明度40%；

03使用笔刷，颜色# 3f311d，混合模式：叠加，不透明度50%；

这一步可自由发挥，自己觉得金属图片哪块可以作为纹理即用就可，参数也可自己调试叠加，以实际效果为主，完成图标绘制；

END：根据自己喜爱跟感觉调试破旧金属纹理，完成其他图标。

二、不规则形状 —— MEIOS （相机图标）

link：

Step02：选择【圆角矩形工具】（快捷键U，可按Shift+U切换），在画布点击【创建圆角矩形】弹出层，设置宽度为200px，高度为150px，半径10px，并勾选【从中心】，然后点击确定；（PS：因为是不规则形状的主题图标，长宽比采用4:3比例）

Step03：重命名图层为di，右键选择【混合选项】，设置

【描边】：大小为1，位置内部，填充类型为渐变，色值从上到下为 #ededed — #ffffff，角度为90°

【渐变叠加】：线性渐变，色值从上到下为 #f1f1f1 — #ffffff，角度为90°；

再复制图层（快捷键Ctrl+J），重命名为di2，填充颜色改为b9b9b9，并把图层向下移动三像素；

Step04：绘制镜头部分，选择【椭圆工具】（快捷键U，可按Shift+U切换），按住Shift键画个正圆，大小自定适合即可，源文件的大小是为120×120px，图层重命名为B_yuan；设置图层混合选项：

【描边】：大小为5，位置外部，填充类型为渐变，色值从上到下为 #d5d5d5 — #e6e6e6，角度为90°

【渐变叠加】：色值从上到下为 #292929 — #232323，角度为90°

【投影】：颜色为#323232，角度90°，距离7px，扩展0，大小13px；

复制图层B_yuan重命名为Blue_yuan；点击【编辑】—【自由变换路径】（快捷键Ctrl+T），缩小60%（记得点击【保持长宽比】），右键清除图层样式，选择【混合选项】设置：

【描边】：大小1px，位置内部，颜色# 111111，

【渐变叠加】：线性渐变，色值从上到下为 # 082441 — # 08101b，角度为90°；

再用【椭圆工具】画个正圆，大小自定，命名为S_yuan，填充颜色# 0c0c0c，

最后画镜头的高光，一样用【椭圆工具】画个正圆，大小自定，命名为guang，填充颜色# FFFFFF，不透明度为10%；

Step05：绘制相机的顶部，用【椭圆工具】和【矩形工具】通过删除部分节点、路径移动和填充颜色等绘制，在此就不一一详解；

最后绘制相机的小红点，用【椭圆工具】画个正圆，大小自定，放在相机的左上角位置，设置图层样式：

【描边】：大小1px，位置外部，颜色#ff4d42；

【内阴影】：颜色#ff483d，角度90°，距离5px，阻塞0，大小8px；

【渐变叠加】：线性渐变，色值从上到下为 # fe574c — #ff463b，角度为90°；

完成图标的绘制。

END：用相同的方法跟技巧完成整套主题图标，应该注意整体的一些细节（图片来自设计师@ElethomHunter），因为这套主题是不规则形状的，形状上无法统一，整体视觉细节效果应更加谨慎细腻。

文章来源：站酷

文章作者：yu0910

N Style图标制作教程 II(源文件psd下载)

相关推荐