伪3d毛玻璃风格图标的一点设计思路和方法分享

本文主要是讲解一下思路和一些基础操作，以如下部分讲解：

PART 01  拆分分析风格特色和绘图逻辑

PART 02 如何不用3D软件快速制作简单图形（用Adobe Illustrator）

PART 03 毛玻璃图标的简单操作及示例（用sketch）

预设光线的方向是左上角顶光

从左到右，从高到低，颜色会逐渐变深

在色相上进行渐变

注意，在这里我所说的「3D图形」，其实就是2.5D形状

我用画面里的云来做示例，方法很简单，首先我们找来一朵胖胖的云（矢量的）

将云的形状放入

，用「效果-3D和材质-3D（经典）-凸出和斜角」进行生成

参数需要自定义，主要调整「位置」和「凸出高度」

生成后进行「扩展外观」再「取消编组」

解组后拆分如上，再根据自己的需求用「路径查找器合并形状」

先绘制一下基本形状

然后改变需要做成毛玻璃的图层的样式，为图形的色彩填充添加透明度，添加「背景模糊」效果

然后根据案例进行颜色和模糊数值的修改调整，看的出来，左侧的案例毛玻璃层「偏绿」一些，而且因为重叠部分和未重叠部分颜色差异不大，说明「毛玻璃层的填充透明度更小」，而且边缘更加清晰，说明「背景模糊程度更小」

所以调整结果如下