音量调节滑块设计

在一些音乐或游戏类的APP应用软件中,经常会用到控制块调节音量大小,采用这样的方式既便于操作,又能够美化界面,提升用户体验。

1.制作滑块轨迹

step 1

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

背景内容为绿色(RGB:145,183,60)

step 2

运用圆角矩形 ,绘制一个宽650,高20像素,圆角半径为10像素的圆角矩形,填充灰绿色(RGB:30,31,34)


step 3

为圆角矩形添加内阴影效果,数据如下

step 4

为圆角矩形添加投影效果,数据如下

效果如图

2.绘制滑动条

step 1

运用圆角矩形,绘制一个宽278,高14像素,圆角半径为7像素的圆角矩形,填充浅绿色(RGB:179,218,93),如图

step 2

为圆角矩形添加斜面和浮雕,数据如下

效果如下

3.绘制滑动块

step 1

运用圆角矩形工具,绘制一个圆角矩形,填充深黄色(RGB:212,175,60)到浅黄色(RGB:250,214,101)的线性渐变,。渐变效果

step 2

运用圆角矩形工具,绘制一个较小的矩形,大小位置如图

step 3

为小圆角矩形添加深黄色(RGB:214,177,62)到浅黄色(RGB:247,202,83)的线性渐变,数据如图。

step 4

为小圆角矩形添加内发光效果,数据如图。

step 5

运用矩形工具,绘制3个小矩形,填充深黄色(RGB:200,136,19)

最终效果

做完收工 Ctrl+s 保存

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

友情链接更多精彩内容