网格系统的前世今生

还有非常多规范，不详细列举，遵循 8dp 网格很容易找到适合的尺寸与距离。

△Airbnb 8-Point Grid

△Uber 8-Point Grid

8 点网格的价值所在

对于设计师：有限制的规则让设计更高效，减少不必要的争论，确保更高的统一性。

对于团队：简单的规则让设计师和工程师保持高度统一，减少不必要的沟通。工程师在这样的系统下就能够更快速的识别一个 8dp 的间隔，而不需要每次都进行测量。

对于用户：它们相信的品牌会给他们带来高度的一致性。和半个像素的模糊边缘说再见吧。

如何高效利用 8 点网格？

1. 建立网格并对齐网格

几乎所有设计软件都有「对齐到网格」的选项。如果你的设计绝对符合这套系统的话，设置好相应的网格选项并对齐绝对会给你很大的帮助。所以，你要先确保你打开了「对齐到网格」选项。

△Sketch中设置8px为基准的网格

2. 确定你自己的增量习惯

大多数设计软件都可以调整移动增量值，我喜欢把我的大增加值（按住command移动的增量）从默认的 10 调整到 8，这会方便很多。

△在sketch中调整键盘增量

3. 快捷键

很多应用程序都有快捷键，可以让你在设计时快速移动元素、调整大小。记住这些快捷键，配合网格使用可以大大提高你的效率。

写在最后

但学会了网格系统就不一定就可以排出优秀的设计作品，熟记了 Material Design 的各种参数也不一定就能做好 UI 设计。想要熟练掌握好网格系统的相关知识，达到灵活运用的程度，必须经过大量的优秀作品解构和专项知识训练，以及提升自己的审美能力和版面把控力。

FEVTE编注：更多平面设计理论学习请访问飞特网平面设计理论知识栏目，地址：https://www.fevte.com/plan/shejililun/