随着市场的变化，UI风格也从具象化转变成扁平化，但是近些年扁平化效果用的多了，大家也产生了一些审美疲劳，想从中脱颖而出实在是太难了，所以现在的UI风格逐渐从扁平化转变成轻质感。
Pixso社区案例——磨砂玻璃质感天气图标
什么是轻质感？就是利用颜色渐变、叠加材质、增加光感等方式，提高图标的整体表现力，但是又有别于之前具象化的图标，更多的是采用概括的方式去表现。其中毛玻璃就是当下最流行的一种设计语言，毛玻璃不仅可以很好的表现出图标的质感，还可以通过虚实关系突出图标主体。玻璃拟态表现出有空间感的图标效果，这些效果可以让UI界面瞬间提升档次，同时增加画面层次感。
那么这个毛玻璃效果要怎么做呢，其实很简单，在Pixso资源社区就有很多相关素材。
Pixso社区案例—— 3D玻璃质感图标
今天我们就来手把手教你如何制作出一个好看又高级的毛玻璃效果。
1. 创建画板
首先第一步打开pixso.cn网站，进入工作台，在里面新建一个画板，大小随意，我这里选择的是自定义1000 x 1000 的画板。
2. 创建圆角矩形
2.1 选择左上角的矩形图标（或者按快捷键R），创建一个矩形框，我这里选择的是256 x 256的尺寸；
2.2 调整下图形的颜色和圆角数值，让他看起来更符合现在的图标样式，圆角参数48，RGB色值255,70,70，透明度100%。
3. 渐变设置
现在我们给矩形配上当下最流行的渐变色，让它符合现在的图标流行趋势。
3.1 点击纯色填充后面的小三角，将其设置成线性渐变；
3.2 调整顶部渐变颜色，RBG色值为255,160,225，不透明度为100%；
3.3 调整底部渐变颜色，RBG色值为255,70,120，不透明度为100%。
4. 制作毛玻璃效果
现在我们将这个图形复制一个，开始制作上层的毛玻璃效果。
4.1 首先选中图形，按住键盘上的ALT键和鼠标左键拖拽复制一个矩形；
4.2 然后将图形的颜色改为白色，不透明度给到50%；
4.3 现在就是添加毛玻璃的关键，在效果中调整它的内阴影、外阴影、背景模糊这三个参数；
点击效果后面的加号，然后点击外阴影前面的圆形按钮，会弹出外阴影的具体参数，我们设置为 X轴：4，Y轴：4，模糊：4，颜色选择黑色，不透明度25%，
然后再添加一个效果，将效果调整为内阴影，点击内阴影前的圆形按钮，将内阴影的参数设置为 X轴：4，Y轴：4，模糊：4，注意这里颜色选择白色，不透明度50%，
最后在添加第三个效果，将效果调为背景模糊，点击背景模糊前的圆形按钮，将背景模糊调整为20，
这样一个毛玻璃效果基本上就实现了，现在在毛玻璃上添加出一些细节。
5. 增加细节
现在图标的框基本上完成了，再添加上一个五角星图案，我们来制作一个常用的“收藏”图标。
5.1 点击左上角的矩形按钮后面的小三角，选择星形按钮创建一个五角星；
5.2 然后设置下五角星的圆角参数，大小170 x 170，圆角半径10，比率48%；
现在，一个“收藏”图标就制作完成了。
是不是非常简单，一共只需要五步，让你轻松学会毛玻璃效果，当然这个只是UI设计中非常简单的一个小图标，只要多加练习，举一反三，你也可以成为一名优秀的UI设计师。
你也可以直接在Pixso社区直接复制使用，前端直接拿代码，快速完成产品落地。
Pixso社区案例——毛玻璃UI视觉设计
总体来说，玻璃拟态效果还是很简单的，能够快速表现丰富的层次感，实用性也很强，是目前UI设计圈十分流行的趋势之一，感兴趣的小伙伴可以登录，其中的资源社区精选更有其他丰富的案例，可供大家学习。快来制作一款属于你自己的毛玻璃效果吧。
