极简风格滑块设计

在现代设计中，极简风格设计正在成为当代人的审美标准，本着简单，易用，便于传达的原则，极简风格摒弃了复杂的光影效果，线条，使呈现的内容更加突出。在APP设计中，极简风格隶属于扁平风格设计，但是却比扁平化设计更加纯粹。

1.制作非操作状态 下的滑块

step 1

打开Photoshop软件，按ctrl +N新建画布，数据如下

step 2

运用圆角矩形工具，绘制一个矩形，填充灰色（RGB:102,102,102），作为滑块轨迹

step 3

复制圆角矩形1图层。填充蓝色（RGB：0,135,255），完成滑动条的绘制

step 4

绘制一个宽高均为12像素的圆，填充蓝色（RGB：0,135,255），作为滑动块

step 5

按ctrl +G组合键 ，将上面的滑块进行编组，命名为非操作状态。

2.制作调节状态 下的滑块

step 1

复制非操作状态图层组，将图层组命名为调节状态

step 2

进入调节状态图层组，在椭圆上绘制一个宽高均为30像素的正圆，填充蓝色（RGB:0，135，255）,设置不透明度50%

step 3

绘制一个宽高均为44像素的正圆，设置填充无，描边蓝色（RGB:0，135，255），不透明度20%

3.制作单击状态 下的滑块

step 1

复制非操作状态图层组，将图层命名为 单击状态

step 2

进入单击状态图层组，将椭圆宽高调整至18像素

4.制作调节状态 下的滑块

step 1

复制非操作状态图层组，将图层命名为 禁用状态

step 2

进入禁用状态图层组，隐藏圆角矩形1拷贝 图层

step 3

将圆角矩形1 和椭圆1 图层填充浅灰色（RGB:187，187，187）

step 4

运用形状的布尔运算，将圆角矩形1图层修改至如图样式

最终效果

做完收工 ctrl+s保存