设计规则是什么？

在UI设计和平面设计师看来，图标设计是我们首先要学习的技能之一，是用户界面中绝对必不可少的元素。一般来说，我们理解图标设计的意义，就是将一个概念转化为清晰易读的图形，从而降低用户的理解成本，提高界面的美感。而且很多小伙伴在学习图标设计的过程中不规范，所以很多图标设计作品都不尽如人意！为此，给大家分享一些图标设计规则。我们来看看图标设计中的规则:1。图标尺寸为了保证图标尺寸的一致性，我们往往会建立一个基本的网格尺寸来绘制图标。常见的网格大小有:16，24，36，48，64，128，512，1024。这些尺寸不是固定的，设计中有特殊尺寸。比如Google在桌面电脑上设计图标的时候，在鼠标和键盘是主要输入方式的时候，使用的是密集布局，基本网格减少到20个。下面是一个常用的24x24显示:网格包含2px出血部位。这样可以保证图标在导出时保持所需的比例和周围的空白，也可以平衡图标的视觉重心。*使用常规图标时，避开出血位置的零件。*在使用多个元素的图标时，为了避免图标拥挤，我们可以确保一些图标出现在出血位置，并且它们之间有足够的空间。2.图标关键词的关键线由圆形、方形、矩形、正交、三角形和对角线组成。它为图标集中的基本形状或比例提供了一致的大小。这使得创建视觉稳定性更容易，并且有助于在设计具有相似比例的图标时有一个* * *参考。大小为24的关键线构图如下(大小为24的出血区域为2):在网格上绘制图标时，将图标标准化是一个很好的方法，这样从整体视觉角度看起来比较统一。3.Pixel 3-1像素单位在设计一组系统图标时，要注意图标的像素大小，使用相同的网格大小，设计线条粗细相同的图标，包括曲线、角度、内外笔画。这样图标看起来更统一，也有利于图标的后期迭代。当然，笔画像素的粗细也不是绝对的。我们将系统图标的线条粗细设置为3px。当你将3px应用于一个指纹图标时，它会看起来非常拥挤，视觉上比其他图标更重。这时候我们可以把它的线性像素降低到2px。3-2避免小数点使用矢量工具绘制图标时，仔细观察图标的网格大小和图标结构大小，避免小数点。4.图标的曲率是圆形图标中拐角的数量。任何圆角矩形都有一定的曲率。图标中表示曲率的方式有两种:外曲率和内曲率。外部曲线和内部曲线不一定同时存在。在某些情况下，内部结构可以是直角的(没有曲率)。如下图所示:内部结构为圆形时，整个图标会有点臃肿。这时候我们可以直接把一些内部圆角改成直角(或者改变曲率)，改变后图标的整体结构会更加和谐。需要注意的是，如果一个图标被这样处理过，那么同样情况下的图标也应该这样处理，否则图标会显得非常混乱，不一致。5.倾斜角度根据像素的网格线设置两条对角线会让图标看起来更清晰。在倾角的选择上，不应该出现7.8，14.2这种奇怪的数值。我们可以采用15的增量作为倾斜角度(也可以采用其他规则角度方案)，这样会使整体图案变化更加规则，满足不同形状的角度要求。6.断点形式在制作很多图标的时候，会利用断点的空隙来打破“全包裹图标”的沉闷感，让图标透气。如果要向图标添加断点，请确保断点采用相同的形式。7.图标间距确保图标中的每个细节和元素都有足够的空间。一个图标相邻元素之间的空间在整个图标中不能太小。我们可以定义最小间隔来避免“卡住”轮廓。24px以下的间距不应小于1px。8.如果在制作图标时需要透视，请确保图标的透视是一致的。9.视觉重心物理对准时，非中心对称图形会有视觉偏差感。几个形状不同的图标视觉重心不在一条水平线上，需要微调才能保证平衡感。10.简洁图形在处理图形时，不要留下多余的节点，消除多余的节点，保持图形的整洁。11.命名图标的命名要求比较严格，这涉及到随着扁平化设计风格的流行，图标的风格也变得越来越简单。其实要准确表达意思，需要注意很多细节。在图标大同小异的今天，如何让你的图标让人信服也是一门学问！所以一定要牢牢学习掌握以上图标设计规则~