Photoshop实例教程:绘制iOS5通知栏背景

http://www.webjx.com/  发布时间:2012-03-19 02:26:38  来源:作者:飞鱼 

制作工具:Adobe Photoshop cs5
iOS5发布后评价都说很棒,于是毫不犹豫的刷了,算是纪念Jobs的临终大作。改进的功能很多,其中一个大功能就是有了一个跟android几乎一样的通知栏,同事看了说:我擦,这功能跟android 的下拉框有啥区别?完全抄袭么… 然后就有人说了:那不是,瞧,对比一下,明显… iOS5的通知栏帅多了,瞧这背景,瞧这细节…
好吧,仔细看了下的确很酷,细节纹理做得很棒,像一块布。发现做起来也不复杂就几步就可以了^__^。

最终效果


步骤 1

新建psd,大小800*600,填充背景色(#45454c)。如下图。飞鱼:填充神马的不用我教了吧 XD

步骤 2

新建图层, 填充黑色(#000000),选择 滤镜-杂色-添加杂色,杂色数量20%左右。然后将图层模式改为:滤色。如下图。

步骤 3

分别选择 滤镜-模糊-动感模糊,角度90,距离30左右。然后选择 滤镜-锐化-锐化,如下图:
这个时候基本有点感觉了吧^__^ 继续。

步骤 4

接下来只要做横向的效果就差不多了,新建一个图层,按照步骤2,只是角度变为45度。结果如下图:
这里其实还有另外一个办法就是复制一层,ctrl+t 旋转一下就可以了,不过长度会不够。

步骤 5

到这里效果基本都出来了,只要加个图层,做一下内阴影,或者黑白渐变,然后叠加一下就有效果了。

总结

可以发现,做这个东西只要几种滤镜就可以轻松达到效果,具体细节需要仔细去调,比如颜色,阴影等。

更多