优艾设计网

UI教程,设计金属质感的UI图标教程

优艾设计网 https://www.uibq.com 2020-09-14 00:00 出处:网络 作者:全栈UI笔记
教程讲解十分详细,主要分几个部分完成,分别是设计底纹,然后通过图层样式制作金属按钮,最后加上图案即可完成。

UI教程,设计金属质感的UI图标教程

步骤四:

为底座-2添加金属拉丝效果,新建图层填充#9f9f9f,添加杂色执行动感模糊命令,并创建剪贴蒙版,调整不透明度。

UI教程,设计金属质感的UI图标教程

UI教程,设计金属质感的UI图标教程

UI教程,设计金属质感的UI图标教程

UI教程,设计金属质感的UI图标教程

步骤五:

复制金属拉丝,ctrl+t旋转90度,并依次创建剪贴蒙版

UI教程,设计金属质感的UI图标教程

步骤六:

现在我们绘制内框位置,绘制两个圆角矩形,大小分别为450px,390px圆角半径为90px,合并形状选择路径选择工具,选中内框减去顶层形状,并添加图层样式。

UI教程,设计金属质感的UI图标教程

UI教程,设计金属质感的UI图标教程

UI教程,设计金属质感的UI图标教程

UI教程,设计金属质感的UI图标教程

UI教程,设计金属质感的UI图标教程

步骤七:

我们为内框添加金属拉丝效果吧,复制内框图层清除图层样式。获取选区其它操作方式如上,并调整不透明度。

UI教程,设计金属质感的UI图标教程

UI教程,设计金属质感的UI图标教程

UI教程,设计金属质感的UI图标教程

UI教程,设计金属质感的UI图标教程

提示:键盘也能翻页,试试"← →"键
0

精彩评论

暂无评论...
验证码 换一张
取 消