如何用Photoshop制作iOS 7透明磨砂玻璃效果

半个月前，苹果发布了iOS 7系统正式版，于是伴随着扁平化界面一同而来的透明磨砂玻璃效果让所有支持iOS 7的设备的用户都能用上了。因此，我做了一套iOS 7的透明磨砂玻璃效果的UI。可是，没想到很多人对于怎么设计这个透明磨砂玻璃的特效甚是不解。这真是我始料不及，当iOS 7 Beta版本发布的时候我就分析了一下怎么在Photoshop中来设计这个界面，其实就是很简单的事情，很容易想通的。那既然有这么多的童鞋不太明白是怎么制作的，于是我决定写一篇文章大致讲解一下吧。

准备

首先，你要挑选一张看着舒服的图片作为背景，图片好看心情才好。由于我写此篇文章的目的只是讲解透明磨砂玻璃效果的制作，其他一些基本且无关的操作因此忽略，因此需要有一定的Photoshop操作基础。

Step 1

在打开的Photoshop文档中使用圆角矩形工具（U）拖拽出一个基础形状，比如880×320的大小，4个像素的圆角。

Step 2

将背景图片拖放到PS文档中，将图层置于刚刚创建的圆角矩形之上，并且将图层转换为智能对象，然后将鼠标放在这两个图层之间，按住ALT键点击鼠标创建剪切蒙版。

Step 3

关键的地方到了，选中这个背景图片的图层，然后应用高斯模糊滤镜，随便设置多少半径，只要看起来效果满意即可，比如10个像素。这里可以看到图层下方多出了一个智能滤镜。这就是为什么上一步中要把图层转换为智能对象的原因，转换为智能对象后，应用的滤镜即可成为智能滤镜，而智能滤镜的好处之一是可以添加蒙版，另外还有个更大的作用就是时候可以更改滤镜的参数。

Step 4

这一步需要绘制一个承载信息的横条，以880×100的尺寸为例，将图层的颜色设置为与背景接近，同时与背景框架保持底部对齐。由于背景的底部有两个角带有圆角，所以仍然需要使用第二步中的方法创建剪切蒙版。

Step 5

这是另一个关键的步骤，由于背景现在是全部都是模糊的，而最终的效果中只需要横条下方的区域模糊，因此点击第三步中的智能滤镜的缩略图以选中智能滤镜的蒙版，然后按住CTRL键点击横条的缩略图。这样就载入了横条图层的选区，而由于是需要这部分是模糊其他部分清晰，所以按住CTRL+SHIFT+I键反转选区。最后使用黑色填充这块区域，于是就得到最终需要的效果了

到这里，iOS 7的透明磨砂玻璃效果就完成了。最后，添加些文字就可以完成了。总得来说，我的讲解是比较简单的，因为忽略了一些不是关键的地方，因此，这需要具有一定的Photoshop基础，当然都是很容易掌握的基础。

本文出自： http://www.soleilneon.com/blog, 原文地址： http://www.soleilneon.com/blog/2013/09/how-design-the-blurred-glasses-effect-in-ios-7-with-photoshop/, 感谢原作者分享。