photoshop制作逼真旋钮(翻译教程)

UI / UI设计教程 /      

uimaker
UI设计师 / 江苏 南京

来源:uimaker.com   作者:naruco

关键词

 好久没折腾PS了,今天看了psd+上的《Create a Clean iPad Interface in Photoshop 》这篇文章,一时手痒,就截了一段,学习学习。先看看最终的效果:

PS教程1

 

1、新建文档



 

2、填充任意色,执行图中滤镜

 

 

图2
 
 

3、用(U)画个圆,并建几条参考线,填充黑色,调整填充至8%,再用钢笔工具,勾出图中选区形状;

 

 

 

4、应用图层样式

 

图层样式1

图层样式2

图层样式3

 

5、再建一圆

 
6、应用图层样式
 
 
图1

图2

图3
 
 

7、新增一圆,填充#CFCFCF,调节至适当位置

 

 
 
8、添加如下图层样式
 
 
PS1

PS2

PS3
 
 

9、新增一圆,调节至适当大小,填充#414141

 

 
10、应用图层样式
 
 
应用图层样式1

应用图层样式2

应用图层样式3
 
 
11、用钢笔工具画出如下图色块,填充#6DCFF6后,图层上右键选“剪贴蒙版”
 
 
PS教程1

PS教程2
 
 
 

12、新增一圆,填充白色

 

 
13、应用如下图层样式
 
 
图层样式01

图层样式02

图层样式03

图层样式04

图层样式05
 
 
14、选用笔刷工具,调节至适当大小,调整硬度至0%,描出如图效果后,新建剪贴蒙版
 
 
 
15、新建一层,填充任意色,执行滤镜-杂色-添加杂色,然后执行滤镜-模糊-径向模糊,具体参数如图

最后新建剪贴蒙版,并调节图层形式为“强光”,不透明调至41%
 
 
PS教程

PS教程2
 
16、新建一圆,调节填充为0%,添加1像素黑色内描边,通过重复复制和改变大小,做出如下图效果。

最后群组,并调节不透明度至15%
 
 
PS01

PS02

PS03

PS04
 
17、依图示画出箭头,并应用图层样式
 
PS教程01

PS教程02

PS教程03

PS教程04

PS教程05
 
 
18、螺丝钉的制作,先画出适当大小的图,填充黑色,并应用如下图图层样式
 
 
螺丝钉样式01

螺丝钉样式02

螺丝钉样式03
 
19、新增一圆,填充#494949,并按下图所示应用图层样式
 
PS设计教程01

PS设计教程02

PS设计教程03

PS设计教程04
 
20、文字工具输入“+”,调节适当大小和适当字休,旋转45度后应用如下图所示图层样式
 
 
PS教程01

PS教程02

PS教程03

PS教程04
 
 
 
最后复制产生另一螺丝钉,大功造成!

这是第一次在站酷发布PS学习帖,多有不足,还望多多指教!
 
本文由 站酷网 - naruco 翻译,转载请保留此信息,多谢合作。
 

 

 收藏