层级思维解构图标分类体系

近年来，Ul设计行业蓬勃发展，图标设计风格更是呈现出多元化的特点，各种新颖、创意的设计风格层出不穷。图标样式早已从潺潺溪水变成汪洋大海，通过系统归纳和整理各类常用的面性图标设计类型与风格，我们构建了一套体系化的记忆框架，使得在日常工作中能够迅速且准确地作出图标样式的决策，从而有效提升设计效率与质量。本文章主要讨论近年UI界面中会经常使用的图标风格，线性图标样式组成一般过于简单，在此不做讨论。

并特别关注层级是否穿透这一关键因素来区分不同类型的图标。这种分类思维不仅使图标的辨识变得更为便捷，还有助于人们更轻松地形成深刻的记忆印象。通过这种创新性的分类方法，我们得以更清晰地理解图标的本质与特点，进一步提升我们对常用图标的认知水平和应用能力。

整体风格简洁大方。由于没有其他质感元素的加入，所以对图形要求更加需要简约而精致

主副图形对比色搭配，整体风格既简约又具备颜色丰富度

·渐变方向从上到下，这种渐变方向较为传统，呈现轻轻鼓起的圆润形态

·渐变方向从下到上，为图标赋予了轻盈而灵动的视觉感受

·渐变方向从左到右，融合了渐变圆弧形成的高光形状，形式较新颖

多层级图标的设计，主要依据其是否具备穿透特性进行划分，即不穿透与穿透两大维度。在实际操作中，多数情况下，我们会借助不同层级的设计手法来塑造图标的层次感，而这其中往往融入了微妙的质感处理。因此，我们并不以扁平与质感作为多层级图标的主要划分标准。

·色彩搭配邻近色

·色彩搭配邻近色，渐变方向-左到右

·色彩搭配邻近色，和谐统一，主图形内发光质感，边缘有1像素高光和副图形隔开

·色彩搭配邻近色，采用强质感，多层级之间巧妙运用投影进行区分，使得每一层都清晰分明，互相映衬。主图形的质感通过渐变、内阴影或内发光等手法进行精细刻画，增强了视觉冲击力。

·采用强质感，多层级，更贴近真实物体的质感和光影效果。用素描的三大调五大面思维，让光影细节拉满，通常需要手动加光，无法单纯用软件自带渐变

主图形透出底部副图形形状，副图形被遮挡形状模糊处理，主图形通常边缘有1像素高光，呈现出精致而独特的分隔效果。

·邻近色穿透，底部图形通常为暗色

·不同色系穿透

为减轻记忆压力，我们直接沿用先前提出的无底板图标风格分类方案。在此基础上，我们进一步引入一个底板构成元素，以此作为额外的区分点。因此，整个分类维度与异形图标分类方案保持高度一致，使得用户能够更轻松地进行识别和记忆。分类维度不再赘述，直接展示案例

·底板渐变+投影，渐变方向从下到上，主图形渐变方向从下到上，和底板统一

·底板渐变+投影，渐变方向从下到上，主图形渐变方向上到下，和底板相反

·底板渐变，渐变方向从右下到左上，主图形渐变方向上到下，并带有较强的投影

·底板扁平，主图形和副图形之间投影区分

·底板扁平，主图形和副图形之间投影区分，副图形降低透明度

·底板渐变，主图形渐变方向根据物体造型来定制

·底板渐变，主副图形穿透