优艾设计网

UI图标,设计旋转开关UI图标教程

优艾设计网 https://www.uibq.com 2020-09-14 00:00 出处:网络 作者:全栈UI笔记
本篇UI教程跟大家分享如何设计一枚旋转风格的开关按钮,主体由灰白色组成,简单漂亮,想学UI设计的同学就跟着练习一下吧。

步骤四:

现在为装饰圆添加不同的描边效果,并将多余的线条利用选区框选出来,在图层蒙版遮中填充黑色。

UI图标,设计旋转开关UI图标教程

UI图标,设计旋转开关UI图标教程

UI图标,设计旋转开关UI图标教程

UI图标,设计旋转开关UI图标教程

UI图标,设计旋转开关UI图标教程

UI图标,设计旋转开关UI图标教程

步骤五:

现在选择直线段工具,长度20px,粗细4px,并复制为加号移动到合适位置,添加OFF文字Adobe 黑体 Std R,字体大小20点颜色#a0a0a0。

UI图标,设计旋转开关UI图标教程

步骤六:

现在我们来绘制内部圆,继续使用椭圆工具、绘制一个290px*290px的正圆,并为它添加图层样式。

UI图标,设计旋转开关UI图标教程

UI图标,设计旋转开关UI图标教程

UI图标,设计旋转开关UI图标教程

UI图标,设计旋转开关UI图标教程

步骤七:

现在我们来绘制圆环,绘制两个正圆大小分别为200x,180px的正圆,将俩个合并为一个形状层,选择路径选择工具选择内圆,减去顶层形状,并添加图层样式。

UI图标,设计旋转开关UI图标教程

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

精彩评论

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