美文网首页 移动 前端 Python Android Java
Sketch - 教你正确的做iOS Blur的姿势

Sketch - 教你正确的做iOS Blur的姿势

作者: Bux | 来源:发表于2015-05-07 11:45 被阅读3965次

今天我们来说说如何通过Sketch,制作iOS8的透明毛玻璃效果,相当快捷,可能有些朋友已经知道了,那就当是给其他朋友扫盲了。

Sketch,都知道吧,Mac系统的新晋设计软件。轻量,矢量是它的两个Keywords,很多便捷的功能也就不一一介绍了,大家可以去官网看看Features。


做设计的很多朋友经常会运用iOS毛玻璃的效果,在PS里进行高斯模糊操作,图层叠加在一个完成的模糊背景图层,最后利用蒙版设计出一个按钮。

其实在Sketch里进行这个操作很简单,但如果你不知道的话,那你也肯定也不会知道这是多简单的事儿了。(精分!)

First

选择想要添加模糊背景的图层或者目标,大部分应该会是一个按钮,当然你选择其他的,我也不会管你。

Paste_Image.png

Next

在选中后可以看到Sketch界面右边的inspector,这部分有很多的选项(啊好多英文,看不懂,主人救我)。

没事,别慌,我们只用到一个。

找到最下面的那个选项:高斯模糊(Gaussian Blur),这时候会看到有一个指着上下的小箭头,没错,点击它。

Paste_Image.png

Last

选择“ Background Blur”。注意:请先确保选对了图层,再进行这步操作。

Paste_Image.png

现在要做的就是调整像素的数量,来达到你想要的效果。我在这的设置是10px,预览效果会根据像素数量的改变而变化,选择最满意的效果即可。

就这么几步操作,就达到了最满意的效果。

相关文章

网友评论

    本文标题:Sketch - 教你正确的做iOS Blur的姿势

    本文链接:https://www.haomeiwen.com/subject/imaifttx.html