打造磨砂玻璃：高斯模糊与杂色滤镜制作iOS风格毛玻璃背景的UI设计技巧
作者：甜姐姐｜面向：PS初学者/设计爱好者｜关键词：高斯模糊、杂色、毛玻璃、UI质感
大家是不是也遇到过这种情况：做UI背景想要“iOS那种高级毛玻璃”，结果一上来就滤镜-高斯模糊一拉，画面直接糊成“跟没睡醒似的”，高级感没来，廉价感先到了。
甜姐姐先把本质说清楚：高级感的毛玻璃不是“更糊”，而是“更像玻璃”。玻璃的感觉来自三件事：模糊的层次、微微的雾感（对比度被压住）、细小颗粒（杂色/噪点）。今天我们用PS最简单的组合：高斯模糊 + 杂色，做一个贼专业、又不难上手的iOS风格磨砂玻璃背景。
一、准备工作：先把“玻璃那一块”单独拎出来
目的很简单：毛玻璃通常是一个半透明面板盖在内容上，所以我们要把它当“一个独立的玻璃层”来做，后期好调、不翻车。
- 用矩形工具画一个面板区域（比如卡片/弹窗的位置）。
- 把这个形状图层命名为：
Glass（养成好习惯，后面真的救命）。
小技巧：如果你是做UI稿，建议在开始前就确定画布尺寸（比如 iPhone 常用宽度 390/414），这样模糊半径更好“对标”真实效果。
二、第一步做“糊得对”：高斯模糊要有边界感
很多人糊完就完事了，但真正的iOS毛玻璃是：背景被柔化，但细节还隐约能认出来，像隔着一块磨砂亚克力看东西。
- 先选中背景图层，按
Ctrl + J 复制一层（命名：BG_blur）。 - 按住
Alt，点击两层中间建立剪贴蒙版（让模糊只出现在玻璃区域）。 - 选中
BG_blur：滤镜 > 模糊 > 高斯模糊。
参数建议（给你一个不踩雷的起点）：
常见误区：半径拉到40+看起来“很丝滑”，但那是“糊”，不是“玻璃”。玻璃要保留一点点“能看出来后面是什么”的信息，不然像打了马赛克。
三、第二步做“雾感”：压对比度，让它像蒙了一层薄纱
iOS毛玻璃不只是模糊，它还会把背景的对比度压下来，亮的没那么亮、暗的没那么暗——像呼一口气在玻璃上那种雾雾的感觉。
- 在
BG_blur 上方新建调整图层：曲线 或 色阶。 - 曲线做法：把高光稍微压一点、阴影稍微抬一点（幅度别大）。
简单粗暴的参考：你可以把曲线两端“捏”向中间一点点，让整体更平。记住一句话：雾感=对比度克制，别一把梭哈。
快捷键提示：切换移动工具 V；自由变换 Ctrl + T；撤销 Ctrl + Z（新版可多步撤销）。
四、第三步加“质感灵魂”：杂色（噪点）让毛玻璃不塑料
很多人做的毛玻璃为什么“像塑料片”？因为太干净了。真实的磨砂表面会有细小颗粒感，PS里最省事的就是加杂色，就像给画面撒一丢丢“盐粒”，立刻更像材质。
- 新建一个空白图层（命名：
Noise），放在玻璃区域上方。 - 填充50%灰：
编辑 > 填充 > 50%灰（或按 Shift + F5 选择填充内容）。 滤镜 > 杂色 > 添加杂色
参数建议：
然后把 Noise 这个图层的混合模式改成：柔光 或 叠加，不透明度建议 10% ~ 30%。
注意：噪点不是越多越高级。太多会像“起砂的旧手机膜”。你要的是“若有若无”，让人感觉舒服，而不是让人看见粒子在跳舞。
五、加分项：高光边缘+轻投影，玻璃立体感立刻起来
这一步属于“看起来很厉害但实际上挺简单”的那种。玻璃面板一般会有一点点边缘高光，再配一点轻投影，就像卡片浮起来一样，UI瞬间精致。
- 加 描边：位置选“内部”，颜色白色，不透明度 10%~25%，大小 1px。
- 加 内阴影（做边缘暗一点点）：不透明度 8%~15%，距离 0~2，大小 6~14。
- 加 投影：不透明度 10%~20%，距离 6~14，大小 12~24。
类比一下：描边像“玻璃边缘的反光线”，内阴影像“玻璃厚度带来的压暗”，投影像“它真的浮在上面”。三件套一上，质感就来了。
六、实战场景：不同背景怎么调才不翻车？
- 背景很花（街景/人像）：模糊半径可以稍大一点（+3~8px），同时把曲线对比度再压一点。
- 背景很干净（纯色/渐变）：模糊别太大，不然像一块白雾；噪点可以稍微加一点点（不透明度+5%）。
- 想更iOS“通透”：在玻璃上方加一层白色填充（剪贴蒙版），不透明度 5%~12%，像给玻璃加“奶味”。
甜姐姐的检查方法：把玻璃层组（模糊+曲线+噪点）整体开/关对比。高级的毛玻璃是“更柔、更稳、更干净”，而不是“变化很大、很刺激”。
七、结尾：毛玻璃的终极秘诀就俩字——克制
今天这套 高斯模糊 + 雾感压对比 + 杂色，你只要按步骤走，做出来基本不会丑。真正拉开差距的，是最后那一点点“收着来”。
记住甜姐姐这句话：毛玻璃不是滤镜炫技，是让信息更好读的背景处理。模糊别贪大、噪点别贪多、阴影别贪黑——你越克制，它越高级。
如果你愿意练一下：找3张不同风格的背景（花/净/暗），用同一套流程做三块玻璃面板，对比参数变化带来的差别，你会进步飞快。
